TERES_web_frontend/src/App.tsx

import { BrowserRouter } from 'react-router-dom';
import { CssBaseline, ThemeProvider } from '@mui/material';
import { theme } from './theme';
import AppRoutes from './routes';
import SnackbarProvider from './components/Provider/SnackbarProvider';
import DialogProvider from './components/Provider/DialogProvider';
import AuthGuard from './components/AuthGuard';
import { useTitle } from 'ahooks';

import './locales';
import './utils/request'
import UserDataProvider from './components/Provider/UserDataProvider';

/**
 * 授权应用，包含路由守卫和用户数据提供器
 */
function AuthorizationApp() {
  return (
    <AuthGuard>
      <AppRoutes />
    </AuthGuard>
  );
}

/**
 * 封装MaterialUIApp，将主题、基础样式和路由包裹起来
 */
function MaterialUIApp() {
  return (
    <ThemeProvider theme={theme}>
      <CssBaseline />
      <SnackbarProvider>
        <DialogProvider>
          <BrowserRouter>
            <AuthorizationApp />
          </BrowserRouter>
        </DialogProvider>
      </SnackbarProvider>
    </ThemeProvider>
  );
}

function App() {
  useTitle('RAG Empowerment System');

  return (
    <MaterialUIApp />
  );
}

export default App;