[FIX] 대시보드 불필요 훅 파일 제거 & 타입 분리 & 서버 응답(total) 사용

[yyoonngg]

🚩 연관 이슈

closed #516

⏰ 우선순위(P1,P2,P3)

P1

---

🔧 작업 내용

대시보드 지출 테이블의 타입 혼용 문제를 해결하고, 불필요한 커스텀 훅을 제거하며, 총 지출 금액을 클라이언트 계산 대신 서버 응답 값으로 교체합니다.

1. selected → isSelected 타입 분리

ExpenseData는 서버 응답을 그대로 담는 타입이므로 UI 전용 선택 상태가 포함되어선 안 됩니다.

• ExpenseData에서 selected?: boolean | null 제거
• EditableExpenseRow(화면용 타입)에 isSelected: boolean 추가
• SelectedCell.accessor 타입을 keyof ExpenseData → keyof EditableExpenseRow로 변경
• UseExpenseTableReturn의 sortedRows, rowKey, columns 타입도 동일하게 수정
• 관련 훅, 상수, 테스트 코드 전체 반영

// Before: 서버 타입에 UI 상태가 섞여 있음
export type ExpenseData = {
  selected?: boolean | null;
  ...
};

// After: UI 상태는 화면용 타입에만
export type EditableExpenseRow = ExpenseData & {
  ...
  isSelected: boolean;
};

2. 단일 용도 커스텀 훅 제거

한 곳에서만 사용되는 단순 로직을 별도 훅으로 분리할 필요가 없어 인라인으로 정리했습니다.

• useExpenseCategoryUpdate 삭제 → useExpenseTable 내 useCallback으로 인라인
• useScrollToTopOnSave 삭제 → useExpenseTable 내 useCallback으로 인라인
• 관련 타입 UseExpenseCategoryUpdateParams 제거

3. 총 지출 금액을 서버 응답(total)으로 교체

기존 문제: calculateTotalExpense는 현재 화면에 로드된 rows만 합산하므로, 무한 스크롤로 일부 페이지만 로드된 경우 실제 합계와 다른 값을 표시함

변경 흐름:

API 응답 (total: 기간 내 전체 지출 합계)
  ↓ useExpensesV2 — total 상태 관리 및 반환
  ↓ DashboardTable
  ↓ EditableDataTable (total prop)
  ↓ ExpenseTableToolbar — "지출 합계" 표시

• useExpensesV2에서 첫 페이지 fetch 시 result.total을 상태로 저장, 반환
• calculateTotalExpense 함수, export, 관련 테스트 제거

4. 파일명 수정

• UseExpenseTableColumns.tsx → useExpenseTableColumns.tsx (훅 네이밍 컨벤션 준수)

---

📝 고민 내용

loadMore 시 total 갱신 여부

무한 스크롤로 다음 페이지를 불러올 때(loadMore) total은 갱신하지 않습니다. 서버의 total은 기간·필터 조건 기준 전체 합계이므로 페이지가 달라져도 값이 동일하며, 조회 조건이 바뀔 때(첫 페이지 fetch)만 갱신하는 것이 맞다고 판단했습니다.

미저장 변경 시 total 실시간 반영

사용자가 cost를 수정하거나 행을 추가/삭제하면 화면의 총합계가 즉시 반영됩니다.

서버 total은 미로드 페이지를 포함한 전체 합계이므로, 클라이언트 변경분(delta)을 useState로 누적하여 더하는 방식으로 구현했습니다.

costDelta (useState(0))
  - cost 셀 수정: delta += (newCost - prevCost)
  - 새 행 cost 입력: delta += newCost
  - 행 삭제: delta -= deletedRowCost
  - 행 병합: 변화 없음 (삭제 cost 합 = 병합 행 cost)
  - refetch(resetKey 변경): delta = 0

displayedTotal = serverTotal + costDelta

[github-actions]

🧪 Test Report

📊 HTML Report: https://softeerbootcamp-7th.github.io/WEB-Team5-Moong/pr-517/

리포트에서 확인 가능:

• ✅ 통과/실패한 테스트 목록
• ⏱️ 각 테스트 실행 시간
• 📝 에러 로그 및 스택 트레이스

Report generated at: 2026-02-25T10:44:39.378Z

[github-actions]

Lighthouse report ✨

Moong 성능측정

🟢: 90 - 100 / 🟠: 50 - 89 / 🔴: 0 - 49

로그인

/login

Category	Score
🟢 Performance	97
🟢 Accessibility	91
🟢 Best Practices	96
🟢 SEO	100
🟢 First Contentful Paint	0.4 s
🟠 Largest Contentful Paint	1.3 s
🟢 Speed Index	0.6 s
🟢 Total Blocking Time	0 ms
🟢 Cumulative Layout Shift	0

온보딩

/onBoarding

Category	Score
🟢 Performance	99
🟢 Accessibility	95
🟢 Best Practices	100
🟢 SEO	100
🟢 First Contentful Paint	0.3 s
🟢 Largest Contentful Paint	1.0 s
🟢 Speed Index	0.3 s
🟢 Total Blocking Time	0 ms
🟢 Cumulative Layout Shift	0

대시보드

/dashboard

Category	Score
🟢 Performance	96
🟠 Accessibility	87
🟢 Best Practices	100
🟢 SEO	100
🟢 First Contentful Paint	0.3 s
🟠 Largest Contentful Paint	1.3 s
🟢 Speed Index	1.1 s
🟢 Total Blocking Time	0 ms
🟢 Cumulative Layout Shift	0.001

분석

/analysis

Category	Score
🟢 Performance	97
🟢 Accessibility	90
🟢 Best Practices	100
🟢 SEO	100
🟢 First Contentful Paint	0.4 s
🟢 Largest Contentful Paint	1.2 s
🟢 Speed Index	1.2 s
🟢 Total Blocking Time	0 ms
🟢 Cumulative Layout Shift	0.005

캘린더

/calendar

Category	Score
🟢 Performance	98
🟠 Accessibility	88
🟢 Best Practices	100
🟢 SEO	100
🟢 First Contentful Paint	0.3 s
🟢 Largest Contentful Paint	1.1 s
🟢 Speed Index	0.9 s
🟢 Total Blocking Time	0 ms
🟢 Cumulative Layout Shift	0

저축

/saving

Category	Score
🟢 Performance	98
🟠 Accessibility	84
🟠 Best Practices	74
🟢 SEO	100
🟢 First Contentful Paint	0.3 s
🟢 Largest Contentful Paint	1.1 s
🟢 Speed Index	1.0 s
🟢 Total Blocking Time	0 ms
🟢 Cumulative Layout Shift	0.037

예측

/forecast

Category	Score
🟢 Performance	97
🟢 Accessibility	90
🟢 Best Practices	100
🟢 SEO	100
🟢 First Contentful Paint	0.4 s
🟠 Largest Contentful Paint	1.2 s
🟢 Speed Index	1.2 s
🟢 Total Blocking Time	0 ms
🟢 Cumulative Layout Shift	0

가족관리

/family

Category	Score
🟢 Performance	98
🟢 Accessibility	90
🟢 Best Practices	100
🟢 SEO	100
🟢 First Contentful Paint	0.3 s
🟢 Largest Contentful Paint	1.1 s
🟢 Speed Index	1.0 s
🟢 Total Blocking Time	0 ms
🟢 Cumulative Layout Shift	0

설정

/settings

Category	Score
🟢 Performance	98
🟠 Accessibility	89
🟢 Best Practices	100
🟢 SEO	100
🟢 First Contentful Paint	0.3 s
🟢 Largest Contentful Paint	1.0 s
🟢 Speed Index	0.9 s
🟢 Total Blocking Time	0 ms
🟢 Cumulative Layout Shift	0

[rkdwoals159]

확인했습니다! 고생하셨어요~