feat(project-dashboard): create project-dashboard page with dashboard-shared

[piggggggggy]

Skip Review (optional)

• Minor changes that don't affect the functionality (e.g. style, chore, ci, test, docs)
• Previously reviewed in feature branch, further review is not mandatory
• Self-merge allowed for solo developers or urgent changes

Description (optional)

Refactor: Separate dashboard core into dashboard-shared for reuse in other services

Background

As part of recent structural changes, our product now allows each service (e.g., DASHBOARDS, PROJECT, ALERT_MANAGER…) to be independently enabled via a global config. While most services are isolated, some require cross-service reuse of UI and logic.

In this case, we needed to integrate dashboard features into the PROJECT service, not just as a viewer but as a fully functional dashboard UI.
However, the backend APIs were not split, and the dashboard resources remained shared.

To support this scenario cleanly in the frontend, we introduced a dashboard-shared layer — a reusable dashboard core that separates domain logic and UI from the original DASHBOARDS service.

Summary of Changes

• Introduced dashboard-shared/ folder under services/
• Split the shared content into:
  • core/: shared logic (actions, composables, helpers)
  • dashboard-create/: create page interface and store
  • dashboard-detail/: detail page interface, store, and UI components
  • Extracted all domain actions (clone, delete, share…) as composable functions in core/actions

Purpose

• Decouple dashboard UI logic from the original service to allow reuse in other service contexts
• Enable PROJECT to use DASHBOARDS’ core logic without duplicating logic or UI
• Improve long-term scalability for future service integrations

---

리팩터링: dashboard-shared 디렉토리로 대시보드 코어 분리 및 재사용 구조화

배경

최근 글로벌 설정 기반으로 각 서비스(DASHBOARDS, PROJECT 등)의 활성화 여부를 제어할 수 있게 되면서,
UI/로직을 서비스 간에 재사용해야 하는 케이스가 일부 발생하고 있습니다.

이번 작업은 PROJECT 서비스에서 기존 대시보드 기능을 그대로 가져오되,
단순 조회가 아닌 독립적인 대시보드 서비스처럼 동작해야 하는 요구를 반영한 것입니다.
백엔드 리소스는 여전히 공유되기 때문에, 프론트엔드에서만 UI/로직 분리가 필요했습니다.

이를 위해 dashboard-shared라는 공통 대시보드 레이어를 도입했습니다.

주요 변경사항

• services/ 하위에 dashboard-shared/ 디렉토리 신설
• 주요 구조 분리:
  • core/: 액션, composable, helper 등 공유 로직
  • dashboard-create/: 생성 페이지 UI + store
  • dashboard-detail/: 상세 페이지 인터페이스 + store + UI
  • 도메인 액션(clone, delete, share 등)을 모두 composable로 추상화

목적

• 대시보드 기능을 원본 서비스로부터 분리하여, 타 서비스에서 재사용 가능하도록 구조화
• PROJECT 서비스에서 대시보드 기능을 독립적으로 운용할 수 있도록 지원
• 향후 유사한 서비스 간 재사용 케이스에 대응 가능한 기반 마련

Things to Talk About (optional)

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

4 Skipped Deployments

Name	Status	Preview	Comments	Updated (UTC)
console	⬜️ Ignored (Inspect)	Visit Preview		Apr 10, 2025 7:40am
dashboard	⬜️ Ignored (Inspect)	Visit Preview		Apr 10, 2025 7:40am
feature-integration-project-detail	⬜️ Ignored (Inspect)	Visit Preview		Apr 10, 2025 7:40am
web-storybook	⬜️ Ignored (Inspect)	Visit Preview		Apr 10, 2025 7:40am

[Copilot]

Copilot reviewed 70 out of 70 changed files in this pull request and generated 1 comment.

[Copilot]

Copilot reviewed 70 out of 70 changed files in this pull request and generated 1 comment.

Comments suppressed due to low confidence (2)

apps/web/src/services/dashboard-shared/dashboard-create/components/DashboardCreateStep2SingleCase.vue:262

• The conditional rendering for dashboard-create-scope-form was removed, which may affect the intended behavior for different entry points. Please confirm if the component should now always render regardless of entryPoint.

<dashboard-create-scope-form />

apps/web/src/services/dashboard-shared/core/actions/use-dashboard-folder-share-action.ts:41

• Silently returning an empty dashboard list on error may mask API issues. Consider propagating the error or adding more robust error handling to avoid silently ignoring failures.

console.error(error); return { results: [] };

[Copilot]

Consider using the computed property state.isPrivate instead of checking props.dashboardId directly to ensure consistency when determining if the dashboard is private.

Suggested change

	if (props.dashboardId?.startsWith('private')) return i18n.t('DASHBOARDS.ALL_DASHBOARDS.PRIVATE');
	if (state.isPrivate) return i18n.t('DASHBOARDS.ALL_DASHBOARDS.PRIVATE');