import '@icon-park/react/styles/index.css';
import 'react-contexify/dist/ReactContexify.css';
import '@styles/index.css';
import {router} from '@routes';
import {createRoot} from 'react-dom/client';
import {RouterProvider} from 'react-router-dom';
import {QueryClientProvider} from '@tanstack/react-query';
import {StrictMode, Suspense} from 'react';
import {ConfigProvider} from 'antd';
import {ThemeConfig} from 'antd/es/config-provider/context';
import 'dayjs/locale/zh-cn';
import zhCN from 'antd/es/locale/zh_CN';
import {Loading} from '@components';
import {QUERY_CLIENT} from '@utils';

const root = createRoot(document.getElementById('root')!);

const themeConfig: ThemeConfig = {
  components: {
    Menu: {
      colorItemTextSelected: '#00a6ca',
      colorItemBgSelected: '#E1F6FC',
    },
  },
  token: {
    colorPrimary: '#00a6ca',
  },
};

root.render(
  <StrictMode>
    <QueryClientProvider client={QUERY_CLIENT}>
      <ConfigProvider theme={themeConfig} locale={zhCN}>
        <Suspense
          fallback={<Loading tip='正在加载' width='100vw' height='100vh' />}
        >
          <RouterProvider router={router} />
        </Suspense>
      </ConfigProvider>
    </QueryClientProvider>
  </StrictMode>,
);