Feature/main api

[haeni82]

이슈

• closed #이슈번호

✔️ 체크리스트

• : Merge할 브랜치를 확인해 주세요.

🔍 작업 내용

• lineId presist로 저장하여 새로고침 시에도 유지 되도록
• 잔여량 그래프, 가족 구성원 정보 컴포넌트 api 연동
• 페이지 재 진입시 로딩 시간이 있음 => tanStack Query적용함
• 공유풀 사용량 그래프는 api 완성되면 추후 연동 예정

⚠️ 주의 사항 / 기타

Summary by CodeRabbit

• New Features

  • 가족 구성원 목록, 공유 풀, 차단 상태의 실시간 API 연동 및 로딩 표시 추가
  • 사용자 세션이 브라우저에 저장되어 유지됨
  • 가족 구성원 상세보기 접근 제어 및 상세 페이지로의 이동 개선

• Refactor

  • 정적 데이터 흐름을 API 기반 동적 데이터로 전환
  • 차트 및 멤버 목록의 데이터 전달 방식 통합
  • 용량 표시용 포맷 유틸리티 도입 및 표시 개선

[coderabbitai]

Warning

Rate limit exceeded

@haeni82 has exceeded the limit for the number of commits that can be reviewed per hour. Please wait 15 minutes and 58 seconds before requesting another review.

⌛ How to resolve this issue?

After the wait time has elapsed, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout.

Please see our FAQ for further information.

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: a4cdd13f-e433-40e9-ac12-e5aa1cbbe59c

📥 Commits

Reviewing files that changed from the base of the PR and between 0338af8 and 50da0f5.

📒 Files selected for processing (1)

• src/page/Policy/Policy.tsx

📝 Walkthrough

Walkthrough

API exports replaced (policyService → blockService, added familyService); Main page and components refactored to fetch data via React Query; new types and data-format utilities added; user store made persistent; component props and member type fields adjusted for API-driven rendering.

Changes

Cohort / File(s)	Summary
API exports & services src/api/index.ts, src/api/services/blockService.ts, src/api/services/familyService.ts	Removed policyService export; added blockService and new familyService (implements getMembers).
Main page data flow src/page/Main/MainPage.tsx	Rewrote to use React Query to fetch block status, family members, and shared pool data; added loading spinner and block end-time formatting; consumes new services and types.
Pie chart & data UI src/page/Main/components/PieChart.tsx, src/page/Main/components/DataBar.tsx	PieChart now accepts single `sharedPoolData?: SharedData
Family member UI changes src/page/Main/components/FamilyMemberList.tsx, src/page/Main/components/MemberCard.tsx	Props changed from myUserId/isMe to isEnable; MemberCard computes canViewDetail and navigates to /detail with lineId.
Types & utils src/types/FamilyMember.ts, src/types/SharedData.ts, src/utils/dataFormat.ts	Added isMe and lineId to FamilyMember; added SharedData type; added bytesToGb, bytesToMb, formatData utilities.
State persistence src/store/userStore.ts	Wrapped useUserStore with persist (zustand) using storage key "user-storage" for localStorage persistence.
Other pages/data src/page/Policy/Policy.tsx	Initial familyMembers entries extended with isMe and lineId fields.

Sequence Diagram(s)

sequenceDiagram
    actor User
    participant MainPage
    participant ReactQuery as React Query
    participant BlockSvc as blockService
    participant FamilySvc as familyService
    participant SharedSvc as sharedPoolService
    participant Components as PieChart &\nFamilyMemberList

    User->>MainPage: 페이지 로드
    MainPage->>ReactQuery: useQuery 호출 (block, family, shared)
    par 병렬 데이터 페칭
        ReactQuery->>BlockSvc: getBlockStatus()
        BlockSvc-->>ReactQuery: block status
    and
        ReactQuery->>FamilySvc: getMembers()
        FamilySvc-->>ReactQuery: family members
    and
        ReactQuery->>SharedSvc: getSharedPool()
        SharedSvc-->>ReactQuery: shared pool data
    end
    ReactQuery->>MainPage: 데이터/로딩 상태 반환
    alt 로딩 중
        MainPage->>Components: 로딩 스피너 표시
    else 데이터 준비 완료
        MainPage->>Components: 전달(sharedPoolData, familyMembers, blockStatus)
        Components->>User: 렌더링(차트, 목록, 차단시간)
    end

Loading

예상 코드 검토 노력

🎯 3 (Moderate) | ⏱️ ~20 분

관련 가능성 있는 PR

• Feature/main api #41: 동일한 API 서비스명 변경 및 MainPage/컴포넌트 통합 변경과 중복되는 코드영역을 수정함 — 강한 연관성 있음.
• Feature/main api #40: 기존 policyService.getBlockStatus 관련 변경을 blockService로 옮긴 작업과 직접적으로 연결됨.
• 1차 병합 #16: MainPage와 PieChart 변경(데이터 소스/props 변경)에 대한 이전 작업과 코드 레벨 연관성 있음.

🚥 Pre-merge checks | ✅ 1 | ❌ 2

❌ Failed checks (1 warning, 1 inconclusive)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 16.67% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.
Title check	❓ Inconclusive	PR 제목이 너무 모호하고 범용적이어서 실제 변경사항을 명확히 전달하지 못합니다.	더 구체적인 제목으로 변경하세요. 예: 'MainPage API 연동 및 React Query 도입' 또는 'API 통합 및 상태 관리 개선'

✅ Passed checks (1 passed)

Check name	Status	Explanation
Description check	✅ Passed	PR 설명이 대부분 작성되었으나 이슈 번호가 미작성되어 있고 주의사항이 불완전합니다.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feature/main-api

---

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

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}