[ Refactor ] API 에러 핸들링(토스트) 통일 작업

[hyun907]

📝 리팩토링 설명

• 현재 API 에러 처리(특히 토스트)가 화면/컴포넌트마다 제각각입니다.

  • ExpenseEditBottomSheet는 useMutation({ onError }) 내부에서 토스트를 띄웁니다.
  • ExpenseRecordFunnel은 mutate(..., { onError }) 호출부에서 토스트를 띄웁니다.

• 이로 인해 다음 문제가 있습니다.

  • 동일한 실패 상황인데도 토스트 문구/톤이 서로 다르게 노출됨
  • 어떤 곳은 console.error를 찍고, 어떤 곳은 생략되는 등 디버깅 경험이 불균일
  • 추후 “공통 에러 정책(예: 인증 만료 시 로그아웃/리다이렉트, 서버 메시지 우선 노출, 특정 코드별 메시지 매핑)”을 적용하려면 수정 포인트가 분산됨

• 따라서 API 에러 → 공통 핸들러(토스트 정책) 로 수렴시켜, 성공/실패 메시지와 처리 흐름을 일관되게 유지하려 합니다.

---

🌿 To-do (작성 예시)

• 공통 에러 토스트 정책 정의

  • 기본 실패 문구(예: “다시 시도해 주세요.”) 통일
  • 서버 에러 메시지 노출 우선순위/예외 케이스(네트워크 오류, 401/403 등) 정리

• 공통 유틸/훅 추가

  • 예: handleApiError(error, { fallbackMessage }) 또는 useApiToast() 형태

• React Query 적용 방식 통일

  • 옵션 위치를 통일:

    • (논의 필요) mutationFn은 순수하게 두고, onSuccess/onError는 mutation 선언부에 고정
    • 또는 반대로 mutate 호출부에서만 처리 (프로젝트 컨벤션으로 1개 선택)

• 기존 코드 교체

  • ExpenseEditBottomSheet의 update/delete onError → 공통 핸들러로 치환
  • ExpenseRecordFunnel의 submit onError → 공통 핸들러로 치환

• 메시지/로깅 일원화

  • console.error 포맷 통일(기능명 prefix 등) 또는 공통 logger 사용

---

📚 ETC

• 대상 예시
  • ExpenseEditBottomSheet: updateMutation, deleteMutation의 onError에서 토스트 처리
  • ExpenseRecordFunnel: submitExpense(..., { onError })에서 토스트 처리
• 기대효과
  • 사용자 경험(토스트 메시지/톤) 일관성 확보
  • 에러 정책 변경 시 수정 범위 축소
  • 중복 코드 제거 및 디버깅 편의 향상