50 lines
1.5 KiB
TypeScript
50 lines
1.5 KiB
TypeScript
|
import { Route, Switch, Redirect } from "wouter";
|
||
|
import { useTernaryDarkMode } from "usehooks-ts";
|
||
|
import { useEffect } from "react";
|
||
|
|
||
|
import './App.css'
|
||
|
|
||
|
import { TooltipProvider } from "./components/ui/tooltip.tsx";
|
||
|
import Layout from "./components/layout/layout.tsx";
|
||
|
|
||
|
import Gallery from "@/page/galleryPage.tsx";
|
||
|
import NotFoundPage from "@/page/404.tsx";
|
||
|
import LoginPage from "@/page/loginPage.tsx";
|
||
|
import ProfilePage from "@/page/profilesPage.tsx";
|
||
|
import ContentInfoPage from "@/page/contentInfoPage.tsx";
|
||
|
import SettingPage from "@/page/settingPage.tsx";
|
||
|
import ComicPage from "@/page/reader/comicPage.tsx";
|
||
|
import DifferencePage from "./page/differencePage.tsx";
|
||
|
|
||
|
const App = () => {
|
||
|
const { isDarkMode } = useTernaryDarkMode();
|
||
|
|
||
|
useEffect(() => {
|
||
|
if (isDarkMode) {
|
||
|
document.body.classList.add("dark");
|
||
|
}
|
||
|
else {
|
||
|
document.body.classList.remove("dark");
|
||
|
}
|
||
|
}, [isDarkMode]);
|
||
|
|
||
|
return (
|
||
|
<TooltipProvider>
|
||
|
<Layout>
|
||
|
<Switch>
|
||
|
<Route path="/" component={() => <Redirect replace to="/search?" />} />
|
||
|
<Route path="/search" component={Gallery} />
|
||
|
<Route path="/login" component={LoginPage} />
|
||
|
<Route path="/profile" component={ProfilePage}/>
|
||
|
<Route path="/doc/:id" component={ContentInfoPage}/>
|
||
|
<Route path="/setting" component={SettingPage} />
|
||
|
<Route path="/doc/:id/reader" component={ComicPage}/>
|
||
|
<Route path="/difference" component={DifferencePage}/>
|
||
|
<Route component={NotFoundPage} />
|
||
|
</Switch>
|
||
|
</Layout>
|
||
|
</TooltipProvider>);
|
||
|
};
|
||
|
|
||
|
export default App
|