fix: use browserRouter

Me-d-c-truy-n · Jun 10, 2024 · 9c9df3b · 9c9df3b
1 parent 58eda2c
commit 9c9df3b
Show file tree

Hide file tree

Showing 5 changed files with 92 additions and 80 deletions.
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -39,13 +39,20 @@ jobs:
         run: npm install
       - name: Build
         run: npm run build
+      - name: Create 404.html
+      run: |
+        cp dist/index.html dist/404.html
+      - name: Rename dist to docs
+        run: mv dist docs
       - name: Setup Pages
         uses: actions/configure-pages@v3
       - name: Upload artifact
         uses: actions/upload-pages-artifact@v1
         with:
-          # Upload dist repository
-          path: './dist'
+          # Upload docs repository
+          path: './docs'
       - name: Deploy to GitHub Pages
         id: deployment
-        uses: actions/deploy-pages@v1
+        uses: actions/deploy-pages@v1
+        with:
+          target_folder: docs
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "frontend",
-  "homepage": "https://Me-d-c-truy-n.github.io/Frontend",
+  "homepage": "https://Me-d-c-truy-n.github.io/frontend",
   "private": true,
   "version": "0.0.0",
   "type": "module",

diff --git a/src/layout/Layout.tsx b/src/layout/Layout.tsx
@@ -5,7 +5,7 @@ import ButtonSettings from "../components/Button/Settings/ButtonSettings";
 
 const Layout = () => {
   return (
-    <div className={`max-w-5xl mx-auto relative overflow-x-hidden`}>
+    <div className={`max-w-5xl min-h-screen mx-auto relative overflow-x-hidden`}>
       <Header />
       <main className="p-1">
         <Outlet />

diff --git a/src/routers/router.tsx b/src/routers/router.tsx
@@ -1,5 +1,5 @@
 import Layout from "../layout/Layout";
-import { createHashRouter } from "react-router-dom";
+import { createBrowserRouter } from "react-router-dom";
 import Home from "../pages/Home";
 import NovelPreview from "../pages/NovelPreview";
 import ScrollToTop from "../hooks/useScrollToTop";
@@ -14,80 +14,85 @@ import PrivacyPolicy from "../pages/Information/PrivacyPolicy";
 import AboutLicense from "../pages/Information/AboutLicense";
 import AboutUs from "../pages/Information/AboutUs";
 
-const router = createHashRouter([
+const router = createBrowserRouter(
+  [
+    {
+      element: <ScrollToTop />,
+      children: [
+        {
+          element: <CheckNewServer />,
+          children: [
+            {
+              element: <Layout />,
+              children: [
+                {
+                  path: "",
+                  element: <Home />,
+                },
+                {
+                  path: "tu-truyen",
+                  element: <Bookcase />,
+                },
+                {
+                  path: "truyen/:novelId",
+                  children: [
+                    {
+                      path: "",
+                      element: <NovelPreview />,
+                    },
+                    {
+                      path: ":chapterId",
+                      element: <NovelChapter />,
+                    },
+                  ],
+                },
+                {
+                  path: "tac-gia/:authorId",
+                  element: <AuthorPage />,
+                },
+                {
+                  path: "tim-kiem",
+                  element: <FilterPage />,
+                },
+                {
+                  path: "thong-tin",
+                  children: [
+                    {
+                      path: "dieu-khoan-dich-vu",
+                      element: <TermOfService />,
+                    },
+                    {
+                      path: "chinh-sach-bao-mat",
+                      element: <PrivacyPolicy />,
+                    },
+                    {
+                      path: "ve-ban-quyen",
+                      element: <AboutLicense />,
+                    },
+                    {
+                      path: "nhom-phat-trien",
+                      element: <AboutUs />,
+                    },
+                  ],
+                },
+              ],
+            },
+          ],
+        },
+        {
+          path: "notfound",
+          element: <Notfound />,
+        },
+        {
+          path: "*",
+          element: <Notfound />,
+        },
+      ],
+    },
+  ],
   {
-    element: <ScrollToTop />,
-    children: [
-      {
-        element: <CheckNewServer />,
-        children: [
-          {
-            element: <Layout />,
-            children: [
-              {
-                path: "/",
-                element: <Home />,
-              },
-              {
-                path: "/tu-truyen",
-                element: <Bookcase />,
-              },
-              {
-                path: "/truyen/:novelId",
-                children: [
-                  {
-                    path: "",
-                    element: <NovelPreview />,
-                  },
-                  {
-                    path: ":chapterId",
-                    element: <NovelChapter />,
-                  },
-                ],
-              },
-              {
-                path: "/tac-gia/:authorId",
-                element: <AuthorPage />,
-              },
-              {
-                path: "/tim-kiem",
-                element: <FilterPage />,
-              },
-              {
-                path: "/thong-tin",
-                children: [
-                  {
-                    path: "dieu-khoan-dich-vu",
-                    element: <TermOfService />,
-                  },
-                  {
-                    path: "chinh-sach-bao-mat",
-                    element: <PrivacyPolicy />,
-                  },
-                  {
-                    path: "ve-ban-quyen",
-                    element: <AboutLicense />,
-                  },
-                  {
-                    path: "nhom-phat-trien",
-                    element: <AboutUs />,
-                  },
-                ],
-              },
-            ],
-          },
-        ],
-      },
-      {
-        path: "/notfound",
-        element: <Notfound />,
-      },
-      {
-        path: "*",
-        element: <Notfound />,
-      },
-    ],
+    basename: "/frontend",
   },
-]);
+);
 
 export default router;
diff --git a/vite.config.ts b/vite.config.ts
@@ -4,7 +4,7 @@ import react from "@vitejs/plugin-react";
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  base: "/Frontend/",
+  base: "/frontend/",
   test: {
     environment: "jsdom",
     globals: true,