Skip to content

[Feature/#416] 플랫폼 대시보드 누락 기능·상태 UX 보완 - #426

Merged
YermIm merged 11 commits into
developfrom
feature/#416
Aug 9, 2026
Merged

[Feature/#416] 플랫폼 대시보드 누락 기능·상태 UX 보완#426
YermIm merged 11 commits into
developfrom
feature/#416

Conversation

@YermIm

@YermIm YermIm commented Aug 9, 2026

Copy link
Copy Markdown
Collaborator

🚨 관련 이슈

close #416

✨ 변경사항

  • 🐞 BugFix Something isn't working
  • 💻 CrossBrowsing Browser compatibility
  • 🌏 Deploy Deploy
  • 🎨 Design Markup & styling
  • 📃 Docs Documentation writing and editing (README.md, etc.)
  • ✨ Feature Feature
  • 🔨 Refactor Code refactoring
  • ⚙️ Setting Development environment setup
  • ✅ Test Test related (storybook, jest, etc.)

✏️ 작업 내용

  • 플랫폼 대시보드 실시간 트래픽 차트에 PNG/SVG/CSV 저장 메뉴 추가 (개별·전체보기)
  • 플랫폼 선택 드롭다운을 connected(+ 토큰 유효) 플랫폼만 노출하도록 필터링
  • WorkspaceSwitcher에서 워크스페이스 1개일 때 새 워크스페이스 위 구분선 숨김
  • 전체보기 performance 부분 실패 시 성공한 플랫폼만 렌더, 실패 플랫폼은 안내 표시
  • 플랫폼 선택을 ?provider= URL과 동기화
    • 유효하지 않거나 미연동/만료(error)인 provider는 전체보기로 정리하고 query 제거
    • date-only tokenExpireAt은 해당 일자부터 만료로 판정

😅 미완성 작업

N/A

📢 논의 사항 및 참고 사항

N/A

💬 리뷰어 가이드 (P-Rules)
P1: 필수 반영 (Critical) - 버그 가능성, 컨벤션 위반. 해결 전 머지 불가.
P2: 적극 권장 (Recommended) - 더 나은 대안 제시. 가급적 반영 권장.
P3: 제안 (Suggestion) - 아이디어 공유. 반영 여부는 드라이버 자율.
P4: 단순 확인/칭찬 (Nit) - 사소한 오타, 칭찬 등 피드백.

Summary by CodeRabbit

  • 새로운 기능
    • 플랫폼 트래픽 차트를 PNG, SVG, CSV 형식으로 다운로드할 수 있습니다.
    • 플랫폼별 데이터를 일부 불러오지 못해도 정상적으로 불러온 성과를 확인할 수 있습니다.
    • URL을 통해 선택한 플랫폼 화면을 공유하고 새로고침 후에도 선택 상태를 유지합니다.
  • 개선 사항
    • 연결되지 않았거나 만료된 플랫폼은 선택 목록에서 제외됩니다.
    • 플랫폼 로드 실패 상태와 만료일 처리가 더욱 정확해졌습니다.
    • 워크스페이스 목록이 없을 때 불필요한 구분선이 표시되지 않습니다.

@YermIm
YermIm requested review from Seojegyeong and jjjsun August 9, 2026 09:32
@YermIm YermIm self-assigned this Aug 9, 2026
@YermIm YermIm added ✨ Feature 기능 개발 🐞 BugFix Something isn't working labels Aug 9, 2026
@coderabbitai

coderabbitai Bot commented Aug 9, 2026

Copy link
Copy Markdown

Review Change Stack

Warning

Review limit reached

@YermIm, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 23 minutes

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 9291321e-4739-4e69-b88f-9c8fe99beb67

📥 Commits

Reviewing files that changed from the base of the PR and between 3ddce98 and d2eb514.

📒 Files selected for processing (1)
  • src/pages/dashboard/platform/PlatformDashboard.tsx
📝 Walkthrough

Walkthrough

플랫폼 대시보드가 URL 기반 플랫폼 선택, 연결 플랫폼 필터링, 성과 부분 실패 처리를 지원합니다. 개별·전체 트래픽 차트에 PNG·SVG·CSV 다운로드를 추가했습니다. 토큰 만료 판별과 워크스페이스 구분선 표시도 변경했습니다.

Changes

플랫폼 대시보드 개선

Layer / File(s) Summary
성과 부분 실패 처리
src/types/dashboard/platform.ts, src/hooks/dashboard/usePlatformPerformance.ts, src/components/dashboard/platform/AllPlatformView.tsx
성과 조회가 성공한 플랫폼 데이터와 실패 제공자 목록을 반환합니다. 전체 실패일 때만 조회 오류를 발생시킵니다. 화면은 성공 카드와 실패 카드를 구분해 렌더링합니다.
URL 기반 플랫폼 선택
src/pages/dashboard/platform/PlatformDashboard.tsx, src/components/dashboard/platform/PlatformViewSwitcher.tsx, src/utils/integration/mapPlatformAccounts.ts
연결되고 만료되지 않은 플랫폼만 선택 목록에 표시합니다. provider 검색 파라미터로 선택 상태를 유지합니다. 유효하지 않은 선택은 전체 보기로 정리합니다. 사용 가능한 플랫폼이 없으면 선택 UI를 비활성화합니다.
트래픽 차트 다운로드
src/components/dashboard/platform/platformTrafficChartDownload.config.ts, src/components/dashboard/platform/PlatformTrafficChartDownload.tsx, src/components/dashboard/platform/PlatformTrafficChart.tsx, src/components/dashboard/platform/AllPlatformTrafficChart.tsx, src/components/dashboard/platform/SinglePlatformView.tsx, src/components/dashboard/platform/AllPlatformView.tsx
개별 및 전체 트래픽 차트에 PNG, SVG, CSV 다운로드 메뉴를 연결합니다. 차트와 컨테이너에 다운로드용 ID를 적용합니다. 파일명에 현재 날짜를 포함합니다.

워크스페이스 스위처 표시

Layer / File(s) Summary
워크스페이스 생성 영역 표시
src/components/sidebar/WorkspaceSwitcher.tsx
다른 워크스페이스가 있을 때만 생성 영역의 상단 구분선을 표시합니다.

Estimated code review effort: 4 (Complex) | ~45 minutes

Sequence Diagram(s)

sequenceDiagram
  participant Operator as 대시보드 사용자
  participant Dashboard as PlatformDashboard
  participant Switcher as PlatformViewSwitcher
  participant URL as URL 검색 파라미터
  participant Performance as usePlatformPerformance
  participant View as AllPlatformView

  Operator->>Switcher: 플랫폼 선택
  Switcher->>Dashboard: 선택된 provider 전달
  Dashboard->>URL: provider 파라미터 갱신
  Dashboard->>Performance: 사용 가능한 플랫폼 성과 조회
  Performance-->>View: platforms와 failedProviders 반환
  View-->>Operator: 성공 카드와 실패 카드 렌더링
Loading

Possibly related PRs

Suggested labels: 🎨 Html&css

Suggested reviewers: jjjsun, seojegyeong

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 25.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed 제목이 플랫폼 대시보드의 누락 기능과 상태 UX 개선이라는 주요 변경 내용을 명확하게 요약합니다.
Description check ✅ Passed 관련 이슈, 변경사항, 미완성 작업, 논의 사항을 템플릿에 맞게 작성했으며 변경 내용도 구체적입니다.
Linked Issues check ✅ Passed 차트 저장, 플랫폼 필터링, 부분 실패 처리, URL 동기화, 워크스페이스 UI 개선 등 이슈 #416의 요구사항을 모두 반영합니다.
Out of Scope Changes check ✅ Passed 변경된 파일과 기능은 모두 이슈 #416의 플랫폼 대시보드 기능 및 상태 UX 개선 범위에 포함됩니다.
✨ Finishing Touches 💡 1
📝 Generate docstrings 💡
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch feature/#416

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@github-actions

github-actions Bot commented Aug 9, 2026

Copy link
Copy Markdown

📚 Storybook 배포 완료

항목 링크
📖 Storybook https://69a147b60a56365d9e2185ef-aidnkkzyix.chromatic.com/
🔍 Chromatic https://www.chromatic.com/build?appId=69a147b60a56365d9e2185ef&number=594

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🧹 Nitpick comments (1)
src/components/dashboard/platform/PlatformTrafficChartDownload.tsx (1)

14-17: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

컴포넌트 props 타입 이름을 I*Props로 변경하세요.

TPlatformTrafficChartDownloadProps는 컴포넌트 props 타입 규칙과 다릅니다.

수정 예시
-type TPlatformTrafficChartDownloadProps = {
+interface IPlatformTrafficChartDownloadProps {
   /** 개별 보기: 플랫폼 코드 (GOOGLE 등). 없으면 전체보기 */
   platform?: string;
-};
+}
 
 export default function PlatformTrafficChartDownload({
   platform,
-}: TPlatformTrafficChartDownloadProps) {
+}: IPlatformTrafficChartDownloadProps) {

As per coding guidelines, component props use I*Props.

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/components/dashboard/platform/PlatformTrafficChartDownload.tsx` around
lines 14 - 17, Rename the component props type
TPlatformTrafficChartDownloadProps to IPlatformTrafficChartDownloadProps and
update all references to use the new I*Props naming convention.

Source: Coding guidelines

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/components/dashboard/platform/PlatformTrafficChartDownload.tsx`:
- Around line 19-50: Hide or disable the download menu in
PlatformTrafficChartDownload when its new available prop is false, while
preserving normal downloads when true. In SinglePlatformView, pass available
based on clickStreamData?.timeSeriesData.length so downloads are only exposed
when chart data exists; update both referenced sites accordingly.

In `@src/pages/dashboard/platform/PlatformDashboard.tsx`:
- Line 49: Update the provider validation logic in PlatformDashboard around
usePlatformConnections so it runs only after connections has been successfully
received, not merely when isFetched is true; guard the providerFromUrl
normalization and related effect against undefined connection data so failed
requests do not replace the deep-link provider with the all-view value or remove
its query parameter.

---

Nitpick comments:
In `@src/components/dashboard/platform/PlatformTrafficChartDownload.tsx`:
- Around line 14-17: Rename the component props type
TPlatformTrafficChartDownloadProps to IPlatformTrafficChartDownloadProps and
update all references to use the new I*Props naming convention.
🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: cdec443b-e6b4-4784-8048-974a9ed7a342

📥 Commits

Reviewing files that changed from the base of the PR and between 0c9bbeb and 3ddce98.

📒 Files selected for processing (12)
  • src/components/dashboard/platform/AllPlatformTrafficChart.tsx
  • src/components/dashboard/platform/AllPlatformView.tsx
  • src/components/dashboard/platform/PlatformTrafficChart.tsx
  • src/components/dashboard/platform/PlatformTrafficChartDownload.tsx
  • src/components/dashboard/platform/PlatformViewSwitcher.tsx
  • src/components/dashboard/platform/SinglePlatformView.tsx
  • src/components/dashboard/platform/platformTrafficChartDownload.config.ts
  • src/components/sidebar/WorkspaceSwitcher.tsx
  • src/hooks/dashboard/usePlatformPerformance.ts
  • src/pages/dashboard/platform/PlatformDashboard.tsx
  • src/types/dashboard/platform.ts
  • src/utils/integration/mapPlatformAccounts.ts

Comment thread src/components/dashboard/platform/PlatformTrafficChartDownload.tsx
Comment thread src/pages/dashboard/platform/PlatformDashboard.tsx Outdated

@Seojegyeong Seojegyeong left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P4: 확인했습니다!

@YermIm
YermIm merged commit e9fc6eb into develop Aug 9, 2026
3 checks passed
@YermIm
YermIm deleted the feature/#416 branch August 9, 2026 10:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

🐞 BugFix Something isn't working ✨ Feature 기능 개발

Projects

None yet

Development

Successfully merging this pull request may close these issues.

✨ [Feature] 플랫폼 대시보드 누락 기능·상태 UX 보완

2 participants