simpler routing without react router...better for me

packages/desktop/package.json

@@ -106,7 +106,6 @@
     "react-dom": "^17.0.2",
     "react-icons": "^4.3.1",
     "react-query": "^3.34.16",
-    "react-router-dom": "^6.2.2",
     "recoil": "^0.6.1"
   }
 }

packages/desktop/src/components/ProtectedRoute/index.tsx

@@ -1,5 +1,4 @@
-import { Route, useNavigate } from "react-router-dom";
+import Login from "../../pages/Login";
-
 import { STORE_ITEMS } from "../../electron/store";
 import { nirvanaApi } from "../../controller/nirvanaApi";
 import { useEffect } from "react";
@@ -10,21 +9,20 @@ export default function ProtectedRoute({
 }: {
   children?: React.ReactNode;
 }) {
-  const { isLoading, isError } = useGetUserDetails();
+  const { isLoading, isError, refetch } = useGetUserDetails();
-  const navigate = useNavigate();
 
   useEffect(() => {
     // console.log(window.electronAPI.store.get(STORE_ITEMS.AUTH_TOKENS));
     // nirvanaApi.getUserDetails();
   }, []);
 
+  if (isLoading || true)
+    return <span>please wait while we authenticate you</span>;
+
   if (isError) {
-    navigate("/login");
+    return <Login onReady={() => refetch()} />;
   }
 
-  if (isLoading) return <span>please wait while we authenticate you</span>;
-
   // if we can successfully get user details, we are good to continue
-
   return <>{children}</>;
 }

packages/desktop/src/controller/index.tsx

@@ -27,7 +27,7 @@ export function useGetUserDetails() {
 
   return useQuery(
     Querytypes.GET_USER_DETAILS,
-    () => getUserDetails(authTokens.accessToken, authTokens.idToken),
+    () => getUserDetails(authTokens?.accessToken, authTokens?.idToken),
     {
       retry: false,
     }

packages/desktop/src/controller/recoil.tsx

@@ -4,7 +4,7 @@ export const $authTokens = atom<{
   accessToken: string;
   refreshToken: string;
   idToken: string;
-}>({
+} | null>({
   key: "AUTH_TOKENS", // unique ID (with respect to other atoms/selectors)
   default: null, // default value (aka initial value)
 });

packages/desktop/src/nirvanaApp.tsx

@@ -1,4 +1,3 @@
-import { BrowserRouter, HashRouter, Route, Routes } from "react-router-dom";
 import { QueryClient, QueryClientProvider } from "react-query";
 
 import Home from "./pages/Home";
@@ -18,22 +17,9 @@ function NirvanaApp() {
     <>
       <QueryClientProvider client={queryClient}>
         <RecoilRoot>
-          <HashRouter>
+          <ProtectedRoute>
-            <Routes>
+            <Home />
-              <Route path="/" element={<Login />} />
+          </ProtectedRoute>
-              <Route
-                path="home"
-                element={
-                  <ProtectedRoute>
-                    <Home />
-                  </ProtectedRoute>
-                }
-              />
-              {/* <Route exact path="/profile/create" component={Sit} />
-            <Route exact path="/profile/edit" component={Sit} /> */}
-            </Routes>
-          </HashRouter>
-
           <ReactQueryDevtools initialIsOpen={false} />
         </RecoilRoot>
       </QueryClientProvider>

packages/desktop/src/pages/Login/index.tsx

@@ -7,11 +7,9 @@ import { FcGoogle } from "react-icons/fc";
 import Logo from "../../components/Logo";
 import { nirvanaApi } from "../../controller/nirvanaApi";
 import { useCreateUser } from "../../controller/index";
-import { useNavigate } from "react-router-dom";
 import { useSetRecoilState } from "recoil";
 
-export default function Login() {
+export default function Login({ onReady }: { onReady: Function }) {
-  const navigate = useNavigate();
   const setAuthTokens = useSetRecoilState($authTokens);
 
   const continueAuth = () => {
@@ -34,7 +32,7 @@ export default function Login() {
         });
 
         // now can go to home and get authenticated regardless of type of user
-        navigate("/home");
+        onReady();
       }
     );
 

yarn.lock

@@ -42,7 +42,7 @@
   dependencies:
     "@babel/helper-plugin-utils" "^7.16.7"
 
-"@babel/runtime@^7.12.5", "@babel/runtime@^7.17.2", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.2", "@babel/runtime@^7.7.2", "@babel/runtime@^7.7.6":
+"@babel/runtime@^7.12.5", "@babel/runtime@^7.17.2", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.2", "@babel/runtime@^7.7.2":
   version "7.17.2"
   resolved "https://registry.npmjs.org/@babel/runtime/-/runtime-7.17.2.tgz"
   integrity sha512-hzeyJyMA1YGdJTuWU0e/j4wKXrU4OMFvY2MSlaI9B7VQb0r5cxTE3EAIS2Q7Tn2RIcDkRvTA/v2JsAEhxe99uw==
@@ -3943,13 +3943,6 @@ he@^1.2.0:
   resolved "https://registry.npmjs.org/he/-/he-1.2.0.tgz"
   integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==
 
-history@^5.2.0:
-  version "5.3.0"
-  resolved "https://registry.npmjs.org/history/-/history-5.3.0.tgz"
-  integrity sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ==
-  dependencies:
-    "@babel/runtime" "^7.7.6"
-
 hoist-non-react-statics@^3.3.1, hoist-non-react-statics@^3.3.2:
   version "3.3.2"
   resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
@@ -6110,21 +6103,6 @@ react-query@^3.34.16:
     broadcast-channel "^3.4.1"
     match-sorter "^6.0.2"
 
-react-router-dom@^6.2.2:
-  version "6.2.2"
-  resolved "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.2.2.tgz"
-  integrity sha512-AtYEsAST7bDD4dLSQHDnk/qxWLJdad5t1HFa1qJyUrCeGgEuCSw0VB/27ARbF9Fi/W5598ujvJOm3ujUCVzuYQ==
-  dependencies:
-    history "^5.2.0"
-    react-router "6.2.2"
-
-[email protected]:
-  version "6.2.2"
-  resolved "https://registry.npmjs.org/react-router/-/react-router-6.2.2.tgz"
-  integrity sha512-/MbxyLzd7Q7amp4gDOGaYvXwhEojkJD5BtExkuKmj39VEE0m3l/zipf6h2WIB2jyAO0lI6NGETh4RDcktRm4AQ==
-  dependencies:
-    history "^5.2.0"
-
 react-transition-group@^4.4.2:
   version "4.4.2"
   resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-4.4.2.tgz#8b59a56f09ced7b55cbd53c36768b922890d5470"