Mina Choi
05fe0de5ce
- 협상 채팅 말풍선에서 협력사 제시가 마스킹 + 챗버블 컴포넌트 분리 - 견적 리스트에 재생성된 다음 차수 표시 - 매칭 없는 경로용 404 폴백 페이지 추가 - 견적 재생성 모달 너비 확대 Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
43 lines
1.9 KiB
TypeScript
43 lines
1.9 KiB
TypeScript
import {Link, useNavigate, useRouteError} from 'react-router';
|
|
import {FileQuestion} from 'lucide-react';
|
|
import { Typography } from '@/components/ui/typography';
|
|
|
|
// 매칭되는 라우트가 없을 때(catch-all '*') 떨어지는 404 페이지.
|
|
// 라우터 errorElement 로도 재사용 가능하도록 useRouteError 는 있으면 참고만 한다(없어도 동작).
|
|
export default function NotFoundPage() {
|
|
const navigate = useNavigate();
|
|
const error = useRouteError() as {status?: number} | undefined;
|
|
const status = error?.status ?? 404;
|
|
|
|
return (
|
|
<div className="min-h-screen flex items-center justify-center bg-background px-4">
|
|
<div className="w-full max-w-sm bg-card border border-border rounded-lg shadow-sm p-8 flex flex-col items-center text-center gap-3">
|
|
<div className="h-12 w-12 rounded-full bg-muted flex items-center justify-center">
|
|
<FileQuestion className="h-6 w-6 text-muted-foreground" />
|
|
</div>
|
|
<Typography variant="h3" as="h1">{status} · 페이지를 찾을 수 없음</Typography>
|
|
<Typography variant="muted">
|
|
요청하신 주소의 페이지가 존재하지 않거나, 이동·삭제되었습니다.
|
|
<br />
|
|
주소를 다시 확인해 주세요.
|
|
</Typography>
|
|
<div className="mt-2 flex items-center gap-2">
|
|
<button
|
|
type="button"
|
|
onClick={() => navigate(-1)}
|
|
className="py-2 px-4 border border-border text-foreground font-semibold rounded text-sm hover:bg-muted transition-colors cursor-pointer"
|
|
>
|
|
이전으로
|
|
</button>
|
|
<Link
|
|
to="/products"
|
|
className="py-2 px-4 bg-primary text-primary-foreground font-semibold rounded text-sm hover:bg-primary/95 transition-colors"
|
|
>
|
|
상품관리로 돌아가기
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|