- ErrorPage 컴포넌트 추가: init/messages 로드 실패(서버/네트워크) 시 ChatContainer 가 에러 화면+재시도(refetch) 렌더 (기존엔 빈 채팅처럼 보임) - 대기 표시: 채팅 영역 '협상 중' 타이핑 버블 + 입력 버튼 자리 '...' 점 애니메이션 - desync 에러코드(CHAT_INPUT_MODE_MISMATCH 1404 / CHAT_AGENT_TIMEOUT 1405) 추가 및 메시지 Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
38 lines
1.3 KiB
TypeScript
38 lines
1.3 KiB
TypeScript
import { AlertTriangle } from 'lucide-react'
|
|
import { Button } from '@/components/Button'
|
|
|
|
export interface ErrorPageProps {
|
|
/** 상단 메시지(굵게). 기본: 일반 오류 문구. */
|
|
message?: string
|
|
/** 보조 설명. 기본: 재시도 안내. */
|
|
description?: string
|
|
/** 재시도 버튼 핸들러. 없으면 버튼 미표시. */
|
|
onRetry?: () => void
|
|
}
|
|
|
|
// 데이터 로드 실패(서버/네트워크 오류) 시 보여주는 에러 화면. 컨테이너를 가득 채운다(h-full).
|
|
export function ErrorPage({
|
|
message = '문제가 발생했습니다.',
|
|
description = '잠시 후 다시 시도해주세요.',
|
|
onRetry,
|
|
}: ErrorPageProps) {
|
|
return (
|
|
<div className="flex h-full w-full items-center justify-center">
|
|
<div className="flex flex-col items-center gap-6 p-12">
|
|
<div className="flex size-20 items-center justify-center rounded-full bg-destructive/10">
|
|
<AlertTriangle className="size-10 text-destructive" />
|
|
</div>
|
|
<div className="flex flex-col items-center gap-2 text-center">
|
|
<p className="title-2 text-destructive">{message}</p>
|
|
<p className="body-1 text-neutral-70">{description}</p>
|
|
</div>
|
|
{onRetry && (
|
|
<Button variant="primary" size="lg" onClick={onRetry}>
|
|
다시 시도
|
|
</Button>
|
|
)}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|