- Implemented CreateTarget and updated UpdateTarget methods in TargetsController. - Introduced IServerService and IServerRepository for server operations. - Created ServersController for handling server-related API requests. - Added ServerUpdateDto for server updates and enhanced Target/Server classes with default values. - Updated TargetRepository and TargetService for target creation and updates. - Modified DapperConfiguration for server mappings. - Updated package dependencies for form validation and state management. - Enhanced Layout.tsx for improved responsiveness and user experience. - Added TitleContext for managing page titles. - Updated Servers.tsx and ServerEdit.tsx for server data handling. - Improved error handling and loading states across components.
112 lines
4.1 KiB
TypeScript
112 lines
4.1 KiB
TypeScript
// App.tsx or main routing component
|
|
import React, { useEffect, ReactNode } from "react";
|
|
import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom';
|
|
|
|
import Layout from '@/components/layouts/Layout';
|
|
import LayoutLogin from '@/components/layouts/LayoutLogin';
|
|
import Home from '@/components/pages/Home';
|
|
import Login from '@/components/pages/Login';
|
|
import Servers from '@/components/pages/Servers';
|
|
import Targets from '@/components/pages/Targets';
|
|
import Templates from '@/components/pages/Templates';
|
|
import { ColorModeContext } from '@/theme/theme';
|
|
import { SetupDataProvider } from '@/context/SetupDataContext';
|
|
import { useTitle } from "@/context/TitleContext";
|
|
|
|
import { createTheme, ThemeProvider } from '@mui/material/styles';
|
|
import CssBaseline from '@mui/material/CssBaseline';
|
|
|
|
interface PageWrapperProps {
|
|
title: string;
|
|
children: ReactNode;
|
|
}
|
|
|
|
const PageWrapper: React.FC<PageWrapperProps> = ({ title, children }) => {
|
|
const { setTitle } = useTitle();
|
|
|
|
useEffect(() => {
|
|
setTitle(title);
|
|
}, [title, setTitle]);
|
|
|
|
return <>{children}</>;
|
|
};
|
|
|
|
const App = () => {
|
|
const [mode, setMode] = React.useState<'light' | 'dark'>('light');
|
|
|
|
const colorMode = React.useMemo(
|
|
() => ({
|
|
toggleColorMode: () => {
|
|
setMode((prevMode) => (prevMode === 'light' ? 'dark' : 'light'));
|
|
},
|
|
}),
|
|
[]
|
|
);
|
|
|
|
const theme = React.useMemo(() => createTheme({ palette: { mode } }), [mode]);
|
|
return (
|
|
<ColorModeContext.Provider value={colorMode}>
|
|
<ThemeProvider theme={theme}>
|
|
<CssBaseline />
|
|
<SetupDataProvider>
|
|
<Router basename="/">
|
|
<Routes>
|
|
<Route path="/" element={<Navigate to="/login" replace />} />
|
|
<Route
|
|
path="/home"
|
|
element={
|
|
<PageWrapper title="Dashboard">
|
|
<Layout>
|
|
<Home />
|
|
</Layout>
|
|
</PageWrapper>
|
|
}
|
|
/>
|
|
<Route
|
|
path="/servers"
|
|
element={
|
|
<PageWrapper title="Servers">
|
|
<Layout>
|
|
<Servers />
|
|
</Layout>
|
|
</PageWrapper>
|
|
}
|
|
/>
|
|
<Route
|
|
path="/targets"
|
|
element={
|
|
<PageWrapper title="Targets">
|
|
<Layout>
|
|
<Targets />
|
|
</Layout>
|
|
</PageWrapper>
|
|
}
|
|
/>
|
|
<Route
|
|
path="/templates"
|
|
element={
|
|
<PageWrapper title="Templates">
|
|
<Layout>
|
|
<Templates />
|
|
</Layout>
|
|
</PageWrapper>
|
|
}
|
|
/>
|
|
<Route
|
|
path="/login"
|
|
element={
|
|
<LayoutLogin>
|
|
<Login />
|
|
</LayoutLogin>
|
|
}
|
|
/>
|
|
</Routes>
|
|
</Router>
|
|
</SetupDataProvider>
|
|
</ThemeProvider>
|
|
</ColorModeContext.Provider>
|
|
);
|
|
};
|
|
|
|
export default App;
|