Skip to content

[Feature/#292] DISCONNECTED 계정 재연동 및 해제 UI 정리 - #299

Merged
YermIm merged 7 commits into
developfrom
feature/#292
Jul 13, 2026
Merged

[Feature/#292] DISCONNECTED 계정 재연동 및 해제 UI 정리#299
YermIm merged 7 commits into
developfrom
feature/#292

Conversation

@YermIm

@YermIm YermIm commented Jul 12, 2026

Copy link
Copy Markdown
Collaborator

🚨 관련 이슈

close #292

✨ 변경사항

  • 🐞 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.)

✏️ 작업 내용

  • 재연동 API

    • 목록 API status에 DISCONNECTED 반영
    • PATCH /api/platform/{orgId}/accounts/{accountId}/reconnect 추가·연동
  • 연동 플로우

    • 해제(DISCONNECTED) 계정에서 「연동하기」 → OAuth/키 입력 없이 reconnect로 기존 계정 복구
    • 계정 없음 → 기존처럼 신규 연동 (startNewConnect)
    • 다른 계정 교체는 BE 정책상 삭제 완료 후 신규 연동으로만 가능
  • 안내 UI

    • 연동 해제 모달: 복구 가능, 새벽 4시 삭제, 다른 계정은 삭제 후 연동 안내
    • 해제 카드: 복구 가능 / 다른 계정 연동 불가 문구
  • 카드 표시

    • 뱃지: 미연동, 연동 해제 구분 (색상 동일)
    • 해제 계정: 연동 계정·토큰 만료 예정 표시
    • tokenExpireAt null이면 —로 표시

😅 미완성 작업

N/A

📢 논의 사항 및 참고 사항

  • Google OAuth 복귀 URL은 BE에 수정 요청해 두었습니다.
  • 토큰 만료 후 재연동에 관한 내용은 문의 예정입니다.

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

Summary by CodeRabbit

  • 새로운 기능

    • 연결이 해제된 플랫폼 계정을 같은 계정으로 다시 “재연동”할 수 있습니다.
    • 재연동 진행 중 상태가 반영되며, 성공/실패 결과를 알림으로 확인할 수 있습니다.
  • 개선 사항

    • 연결 해제 상태에서 기존 계정 복구 가능 여부와 계정 삭제/재연동 가능 시점 안내 문구가 더 명확해졌습니다.
    • 연결 상태 및 토큰 만료 정보 표시가 조건에 따라 더 일관되게 렌더링됩니다(예: 값이 없으면 표시).
    • 버튼 라벨이 “연결 해제”에서 “연동 해제”로 정리되었습니다.

@YermIm
YermIm requested review from Seojegyeong and jjjsun July 12, 2026 16:47
@YermIm YermIm self-assigned this Jul 12, 2026
@YermIm YermIm added ✨ Feature 기능 개발 📬 API 서버 API 통신 labels Jul 12, 2026
@coderabbitai

coderabbitai Bot commented Jul 12, 2026

Copy link
Copy Markdown

Review Change Stack

📝 Walkthrough

Walkthrough

DISCONNECTED 상태의 기존 플랫폼 계정을 재연동하는 API와 페이지 흐름이 추가되었습니다. platformAccountId 보유 여부에 따라 카드 상태, 안내 문구, 버튼 동작을 분기하고 재연동 결과를 처리합니다.

Changes

플랫폼 계정 재연동

Layer / File(s) Summary
재연동 API 및 상태 계약
src/api/integration/platformAccounts.ts, src/types/integration/platformConnection.ts, src/utils/integration/mapPlatformAccounts.ts
재연동 PATCH API를 추가하고 플랫폼 계정 상태 타입 및 UI 매핑 주석을 정리했습니다.
재연동 페이지 흐름
src/pages/integration/PlatformIntegrationsPage.tsx
DISCONNECTED 상태에서 재연동 mutation을 실행하고, 성공 시 목록을 무효화하며 성공·실패 토스트와 대상 카드 로딩 상태를 처리합니다.
연동 해제 상태 UI
src/components/integration/PlatformIntegrationCard.tsx, src/components/integration/PlatformDisconnectModal.tsx
platformAccountId 존재 여부에 따라 상태 메타데이터, 안내 문구, 버튼 레이블과 재연동 관련 설명을 분기합니다.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Sequence Diagram(s)

sequenceDiagram
  participant PlatformIntegrationsPage
  participant reconnectPlatformAccount
  participant PlatformAPI
  participant QueryCache
  PlatformIntegrationsPage->>reconnectPlatformAccount: 재연동 요청
  reconnectPlatformAccount->>PlatformAPI: PATCH reconnect 엔드포인트 호출
  PlatformAPI-->>reconnectPlatformAccount: 완료 응답
  reconnectPlatformAccount-->>PlatformIntegrationsPage: Promise<void>
  PlatformIntegrationsPage->>QueryCache: 연결 목록 무효화
Loading

Possibly related PRs

Suggested reviewers: jjjsun, seojegyeong

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.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
Linked Issues check ✅ Passed DISCONNECTED + platformAccountId에 reconnect API를 적용하고, 신규 연동 흐름도 유지해 #292 요구사항을 충족합니다.
Out of Scope Changes check ✅ Passed API 연동, 카드/모달 문구, 상태 표시, 타입/매핑 정리 모두 재연동 기능과 직접 관련되어 보입니다.
Title check ✅ Passed 제목이 DISCONNECTED 계정 재연동과 해제 UI 정리를 핵심 변경으로 잘 요약하고 있습니다.
Description check ✅ Passed 관련 이슈, 변경사항 체크리스트, 작업 내용, 미완성 작업, 참고 사항이 포함되어 템플릿을 대부분 충족합니다.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch feature/#292

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 Jul 12, 2026

Copy link
Copy Markdown

📚 Storybook 배포 완료

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

@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: 1

🧹 Nitpick comments (1)
src/pages/integration/PlatformIntegrationsPage.tsx (1)

125-153: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

naverItem 중복 조회를 item으로 통합할 수 있습니다.

provider === "NAVER"일 때 item이 이미 NAVER 항목이므로, 두 번째 platformConnections.find 호출은 불필요합니다. 동일한 객체를 다시 조회하고 있습니다.

♻️ 제안: 중복 조회 제거
   const item = platformConnections.find((p) => p.provider === provider);
   if (item?.status === "disconnected" && item.platformAccountId != null) {
     if (reconnectMutation.isPending) return;
     reconnectMutation.mutate({
       orgId,
       accountId: item.platformAccountId,
     });
     return;
   }

-  if (provider === "NAVER") {
-    const naverItem = platformConnections.find((p) => p.provider === "NAVER");
-
-    if (naverItem?.platformAccountId != null) {
-      setNaverModalMode("reconnect");
-      setNaverCustomerId(naverItem.externalAccountId);
-      setIsNaverModalOpen(true);
-      return;
-    }
+  if (provider === "NAVER" && item?.platformAccountId != null) {
+    setNaverModalMode("reconnect");
+    setNaverCustomerId(item.externalAccountId);
+    setIsNaverModalOpen(true);
+    return;
   }

   await startNewConnect(provider);
🤖 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/pages/integration/PlatformIntegrationsPage.tsx` around lines 125 - 153,
Remove the redundant platformConnections.find call inside handleConnect’s NAVER
branch and reuse the existing item variable, preserving the current
platformAccountId check and reconnect modal behavior.
🤖 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/pages/integration/PlatformIntegrationsPage.tsx`:
- Around line 79-96: Pass reconnectMutation.isPending to PlatformIntegrationCard
through its loading-state prop, matching the existing
disconnectMutation.isPending-to-modal pattern. Ensure the reconnect action’s
“연동하기” button displays loading feedback and remains consistent with the existing
duplicate-call guard.

---

Nitpick comments:
In `@src/pages/integration/PlatformIntegrationsPage.tsx`:
- Around line 125-153: Remove the redundant platformConnections.find call inside
handleConnect’s NAVER branch and reuse the existing item variable, preserving
the current platformAccountId check and reconnect modal behavior.
🪄 Autofix (Beta)

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

Run ID: 9f0d2f0a-f7ab-43b3-848d-8fdded244ce6

📥 Commits

Reviewing files that changed from the base of the PR and between 03c72f5 and 487461f.

📒 Files selected for processing (6)
  • src/api/integration/platformAccounts.ts
  • src/components/integration/PlatformDisconnectModal.tsx
  • src/components/integration/PlatformIntegrationCard.tsx
  • src/pages/integration/PlatformIntegrationsPage.tsx
  • src/types/integration/platformConnection.ts
  • src/utils/integration/mapPlatformAccounts.ts

Comment thread src/pages/integration/PlatformIntegrationsPage.tsx

@jjjsun jjjsun 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 51a4932 into develop Jul 13, 2026
3 checks passed
@YermIm
YermIm deleted the feature/#292 branch July 13, 2026 05:39
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

📬 API 서버 API 통신 ✨ Feature 기능 개발

Projects

None yet

Development

Successfully merging this pull request may close these issues.

✨ [Feature] DISCONNECTED 계정 재연동 API 연동

2 participants