From 366bcc739beb760558c35f1ef959c17a54770d26 Mon Sep 17 00:00:00 2001
From: Artsiom Kharytonchyk <artsiom.kharytonchyk@coxautoinc.com>
Date: Tue, 16 Apr 2024 12:31:10 +0300
Subject: [PATCH] feat: add hash routing

---
 package.json           | 1 -
 src/App.tsx            | 9 ++++++---
 src/index.tsx          | 4 ++--
 src/pages/Coverage.tsx | 2 +-
 4 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/package.json b/package.json
index f4c2670..c0df950 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,6 @@
   "name": "git-dashboard",
   "version": "0.1.0",
   "private": true,
-  "homepage": "https://akharytonchyk.github.io/git-pull-request-dashboard/",
   "dependencies": {
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.0",
diff --git a/src/App.tsx b/src/App.tsx
index 02e04a6..03cbb6f 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -5,7 +5,7 @@ import { AppBar, Box, Toolbar } from "@mui/material";
 import { SettingsDrawer } from "./SettingsDrawer";
 import { AuthHeader } from "./components/AuthHeader";
 import { UnAuthHeader } from "./components/UnAuthHeader";
-import { Outlet } from "react-router-dom";
+import { Outlet, useNavigate } from "react-router-dom";
 
 export const ConfigContext = React.createContext<{
   octokit: GitService | null;
@@ -23,6 +23,7 @@ function App() {
   const [token, setToken] = React.useState<string>();
   const [octokit, setOctokit] = React.useState<GitService | null>(null);
   const [openSettings, setOpenSettings] = React.useState<boolean>(false);
+  const navigate = useNavigate();
 
   const onLogin = React.useCallback(() => {
     if (token) {
@@ -42,9 +43,10 @@ function App() {
         setUser(user.data);
         localStorage.setItem("token", token);
         localStorage.setItem("user", JSON.stringify(user.data));
+        navigate("/");
       });
     }
-  }, [token]);
+  }, [token, navigate]);
 
   React.useEffect(() => {
     setToken(localStorage.getItem("token") ?? undefined);
@@ -64,7 +66,8 @@ function App() {
     localStorage.removeItem("user");
     setUser(undefined);
     setOctokit(null);
-  }, []);
+    navigate("/login");
+  }, [navigate]);
 
   const [repositorySettings, setRepositorySettings] = React.useState<
     Record<string, boolean>
diff --git a/src/index.tsx b/src/index.tsx
index 22fb2c7..9fce3c8 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -3,14 +3,14 @@ import ReactDOM from "react-dom/client";
 import "./index.css";
 import App from "./App";
 import reportWebVitals from "./reportWebVitals";
-import { RouterProvider, createBrowserRouter } from "react-router-dom";
+import { RouterProvider, createHashRouter } from "react-router-dom";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { ScopedCssBaseline } from "@mui/material";
 import LandingPage from "./pages/LandingPage";
 import { Coverage } from "./pages/Coverage";
 import { Dashboard } from "./components/Dashboard";
 
-const router = createBrowserRouter([
+const router = createHashRouter([
   {
     path: "/",
     element: <App />,
diff --git a/src/pages/Coverage.tsx b/src/pages/Coverage.tsx
index e111d8c..48ecac0 100644
--- a/src/pages/Coverage.tsx
+++ b/src/pages/Coverage.tsx
@@ -26,7 +26,7 @@ export const Coverage: React.FC = () => {
   const { data, isLoading, isError } = useQuery({
     queryKey: ["coverage"],
     queryFn: async () => {
-      const coverage = await fetch("/coverage.json", {
+      const coverage = await fetch("coverage.json", {
         headers: {
           Accept: "application/json",
         },