
import { lazy } from "react";
import { createBrowserRouter } from "react-router-dom";
import { Component } from "react";

const HomePage = lazy(() => import("@/app/App"));
const MainLayout = lazy(() => import("@/app/MainLayout"));


interface ErrorBoundaryProps {
  children: React.ReactNode;
}
class ErrorBoundary extends Component<ErrorBoundaryProps> {
  state = { hasError: false };

  static getDerivedStateFromError(_error: any) {
    return { hasError: true };
  }

  render() {
    if (this.state.hasError) {
      return <h1>出错了，请稍后再试。</h1>;
    }

    return this.props.children;
  }
}
export const router = createBrowserRouter([
  {
    path: "/",
    element: <MainLayout />,
    errorElement: (
      <ErrorBoundary>
        <div className="flex-auto flex flex-col p-6">出错了，请稍后再试。</div>
      </ErrorBoundary>
    ),
    children: [
      {
        path: "/",
        element: <HomePage />,
      },
    ],
  },
]);
