import { createRoot } from 'react-dom/client'
import { RouterProvider } from 'react-router';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { App as AntdApp , ConfigProvider} from 'antd'
import dayjs from 'dayjs';
import weekday from 'dayjs/plugin/weekday';
import localeData from 'dayjs/plugin/localeData';
import 'dayjs/locale/zh-cn';
import zhCN from 'antd/locale/zh_CN';

import { AuthProvider } from './hooks/AuthProvider';
import { router } from './routes';
import { Toaster } from '../components/ui/sonner';

// 配置 dayjs 插件
dayjs.extend(weekday);
dayjs.extend(localeData);

// 设置 dayjs 语言
dayjs.locale('zh-cn');

// 创建QueryClient实例
const queryClient = new QueryClient();

// 应用入口组件
const App = () => {
  return (
    <QueryClientProvider client={queryClient}>
      <ConfigProvider locale={zhCN} theme={{
        token: {
          colorPrimary: '#1890ff',
          borderRadius: 4,
          colorBgContainer: '#f5f5f5',
        },
        components: {
          Button: {
            borderRadius: 4,
          },
          Card: {
            borderRadius: 6,
            boxShadow: '0 2px 8px rgba(0, 0, 0, 0.08)',
          }
        }
      }}>
        <AntdApp>
          <AuthProvider>
            <RouterProvider router={router} />
          </AuthProvider>
        </AntdApp>
      </ConfigProvider>
      <Toaster />
    </QueryClientProvider>
  )
};

const rootElement = document.getElementById('root')
if (rootElement) {
  const root = createRoot(rootElement)
  root.render(
    <App />
  )
}