fixing things across the board

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

@@ -13,17 +13,15 @@ export default function ProtectedRoute({
   const { isLoading, isError } = useGetUserDetails();
   const navigate = useNavigate();
 
-  useEffect(() => {
-    if (isError) {
-      navigate("/login");
-    }
-  }, [isError]);
-
   useEffect(() => {
     // console.log(window.electronAPI.store.get(STORE_ITEMS.AUTH_TOKENS));
     // nirvanaApi.getUserDetails();
   }, []);
 
+  if (isError) {
+    navigate("/login");
+  }
+
   if (isLoading) return <span>please wait while we authenticate you</span>;
 
   // if we can successfully get user details, we are good to continue

packages/desktop/src/controller/nirvanaApi.ts

@@ -41,8 +41,8 @@ class NirvanaApi {
   }
 
   user = {
-    async getUserDetails(): Promise<User> {
-      return await axios.get(localHost + `/users`, {
+    async getUserDetails(accessToken: string): Promise<User> {
+      return await axios.get(localHost + `/users?access_token=${accessToken}`, {
         headers: { Authorization: this._authToken },
       });
     },

packages/desktop/src/nirvanaApp.tsx

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

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

@@ -2,6 +2,7 @@ import { useEffect, useState } from "react";
 
 import Channels from "../../electron/constants";
 import { CircularProgress } from "@mui/material";
+import { FcGoogle } from "react-icons/fc";
 import Logo from "../../components/Logo";
 import { nirvanaApi } from "../../controller/nirvanaApi";
 import { useCreateUser } from "../../controller/index";
@@ -10,10 +11,6 @@ import { useNavigate } from "react-router-dom";
 export default function Login() {
   const navigate = useNavigate();
 
-  const [isSignUp, setIsSignUp] = useState<boolean>(false);
-
-  const { mutateAsync } = useCreateUser();
-
   const continueAuth = () => {
     setIsLoading(true);
     // send to main process
@@ -32,11 +29,6 @@ export default function Login() {
 
         nirvanaApi.setGoogleIdToken(id_token);
 
-        // create user if on sign up page
-        if (isSignUp) {
-          await mutateAsync(access_token);
-        }
-
         // now can go to home and get authenticated regardless of type of user
         navigate("/home");
       }
@@ -62,19 +54,10 @@ export default function Login() {
       ) : (
         <button
           onClick={continueAuth}
-          className="text-white p-3 rounded shadow border border-white"
+          className=" text-md text-slate-200 py-2 px-5 border border-gray-200 transition-all hover:bg-gray-200 hover:text-teal-500 rounded flex flex-row items-center space-x-2"
         >
-          {isSignUp ? "Sign Up" : "Sign In"}
-        </button>
-      )}
-
-      {isSignUp ? (
-        <button onClick={() => setIsSignUp(false)} className="text-slate-200">
-          Sign In Here
-        </button>
-      ) : (
-        <button onClick={() => setIsSignUp(true)} className="text-slate-200">
-          Create Account Here
+          <FcGoogle className="text-lg" />
+          <span>Continue with Google</span>
         </button>
       )}
     </div>