import React from "react";
import { Route, Routes } from "react-router-dom";
import { ConfigProvider } from "antd";
import zhCN from "antd/lib/locale/zh_CN";
import { MemoSpinLoding } from "./components";
import theme from "./theme.scss";
import "./App.scss";
import "./configure";

const Login = React.lazy(() => import("./pages/Login"));
const Layout = React.lazy(() => import("./pages/Layout"));

const Zhlocale: typeof zhCN = zhCN;
if (Zhlocale.DatePicker?.lang) {
  Zhlocale.DatePicker.lang = {
    ...Zhlocale.DatePicker.lang,
    monthFormat: "M月",
    shortWeekDays: ["日", "一", "二", "三", "四", "五", "六"],
  };
}

function App() {
  return (
    <div className="App">
      <ConfigProvider
        locale={Zhlocale}
        theme={{ token: { colorPrimary: theme.primaryColor } }}
      >
        <React.Suspense fallback={<MemoSpinLoding />}>
          <Routes>
            <Route path="/login" Component={Login} />
            <Route path="/*" Component={Layout} />
          </Routes>
        </React.Suspense>
      </ConfigProvider>
    </div>
  );
}

export default App;