Skip to content

[#918] prefactor: shared/ErrorState·EmptyState를 라우트 경계용으로 보강 #1055

Description

@thxforall

Parent

#918 — 🗺️ [wayfinder] Error page 준수 (결정 D7 / 리스크 R4)

What to build

shared/ErrorState·EmptyState는 현재 소비자 0의 dead export다 — shared/index.ts가 export하지만 import하는 파일이 하나도 없다. 후속 슬라이스에서 이 둘이 라우트 레벨 error.tsx/not-found.tsx의 본문이 되므로, 그 용도를 감당할 수 있게 먼저 보강한다. "Make the change easy, then make the easy change."

현재 ErrorStateonRetry 콜백 하나만 받아 고정된 "Retry" 버튼을 그린다. 라우트 404는 콜백이 아니라 네비게이션 CTA(홈으로 / 탐색하러 가기)가 필요하고, 라우트 500은 Next의 reset() 콜백과 홈 링크를 동시에 노출해야 한다. 아이콘도 AlertCircle 고정이라 "없음"과 "실패"를 구분할 수 없다.

docs/design-system/patterns.md §3.2/3.3이 상정한 title / message / action 시그니처에 맞춘다.

소비자가 0이므로 지금이 시그니처를 바꿀 수 있는 유일하게 안전한 시점이다. 단 추가는 전부 optional로 — 기존 prop을 제거하거나 의미를 바꾸지 않는다(R4).

Acceptance criteria

  • ErrorState가 네비게이션 CTA(링크)와 콜백 액션을 함께 표현할 수 있다 — 주 액션 + 보조 액션 2개까지
  • ErrorState·EmptyState 모두 아이콘을 외부에서 지정할 수 있다 (기본값은 현행 유지)
  • 기존 prop(message·details·onRetry·className·forwardRef)의 시그니처와 동작이 그대로다 — 추가는 전부 optional (R4: 파괴적 변경 금지)
  • 두 컴포넌트 모두 시맨틱 토큰만 쓴다 (하드코딩 hex 0)
  • 라이트/다크 양쪽에서 렌더 확인
  • 단위 테스트: 액션 없음 / 콜백만 / 링크만 / 둘 다인 경우 렌더 검증
  • shared/index.ts export 유지 (타입 포함)

Blocked by

None - can start immediately

Metadata

Metadata

Assignees

No one assigned

    Labels

    bump:patchBug fixes / internal refactorfrontend프론트엔드ready-for-agentFully specified, ready for an AFK agentrefactor리팩토링

    Type

    No type

    Projects

    Status
    Todo

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions