import { useNavigate } from "react-router";
import { ErrorCircleIcon } from "tdesign-icons-react";
import { Button, Space } from "tdesign-react";

export function NotFoundPage() {
  const navigate = useNavigate();

  const handleGoHome = () => {
    void navigate("/");
  };

  return (
    <Space align="center" className="not-found-page" direction="vertical" size="large">
      <ErrorCircleIcon size="64px" style={{ color: "var(--td-warning-color)" }} />
      <h1>404</h1>
      <p>您访问的页面不存在</p>
      <Button onClick={handleGoHome} theme="primary">
        返回首页
      </Button>
    </Space>
  );
}