handling all of the stuff with header logout and handling better jwttoken

packages/desktop/src/pages/Home/header/index.tsx

@@ -1,9 +1,10 @@
-import { $authTokens, $searchQuery } from "../../../controller/recoil";
+import { $jwtToken, $searchQuery } from "../../../controller/recoil";
 import { Dropdown, Menu } from "antd";
 import Logo, { LogoType } from "../../../components/Logo";
 import { useRecoilState, useSetRecoilState } from "recoil";
 
 import { GlobalHotKeys } from "react-hotkeys";
+import NirvanaApi from "../../../controller/nirvanaApi";
 import { STORE_ITEMS } from "../../../electron/constants";
 import SocketChannels from "@nirvana/core/sockets/channels";
 import UserAvatarWithStatus from "../../../components/User/userAvatarWithStatus";
@@ -16,17 +17,16 @@ export default function Header() {
   const { data: userDetailsResponse, isLoading } = useGetUserDetails();
   const [searchQuery, setSearchQuery] = useRecoilState($searchQuery);
 
-  const inputRef = useRef(null);
+  const setJwtToken = useSetRecoilState($jwtToken);
 
-  const setAuthTokens = useSetRecoilState($authTokens);
+  const inputRef = useRef(null);
 
   if (isLoading) {
     return <span>getting data</span>;
   }
 
   const logOut = () => {
-    window.electronAPI.store.set(STORE_ITEMS.GOOGLE_AUTH_TOKENS, null);
-    setAuthTokens(null);
+    setJwtToken(undefined);
   };
 
   const updateStatus = (newStatus: UserStatus) => {

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

@@ -17,7 +17,7 @@ export default function Home() {
     <div className="h-screen bg-zinc-700 flex flex-row">
       <div className="flex-1">
         {/* header */}
-        {/* <Header /> */}
+        <Header />
 
         {/*  main content */}
 

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

@@ -2,23 +2,17 @@ import Channels, { STORE_ITEMS } from "../../electron/constants";
 import { useEffect, useState } from "react";
 import { useRecoilState, useSetRecoilState } from "recoil";
 
-import { $authTokens } from "../../controller/recoil";
+import { $jwtToken } from "../../controller/recoil";
 import { CircularProgress } from "@mui/material";
 import { FcGoogle } from "react-icons/fc";
 import Logo from "../../components/Logo";
-import NirvanaApi from "../../controller/nirvanaApi";
 import { useLogin } from "../../controller/index";
 
 export default function Login() {
   const { mutateAsync } = useLogin();
   const [isLoading, setIsLoading] = useState<boolean>(false);
 
-  const continueAuth = () => {
-    setIsLoading(true);
-
-    // send to main process
-    window.electronAPI.auth.initiateLogin();
-  };
+  const setJwtToken = useSetRecoilState($jwtToken);
 
   useEffect(() => {
     window.electronAPI.once(
@@ -39,12 +33,7 @@ export default function Login() {
         });
 
         const { jwtToken, userDetails } = loginResponse;
-
-        window.electronAPI.store.set(STORE_ITEMS.AUTH_SESSION_JWT, jwtToken);
-
-        console.log(loginResponse);
-
-        // window.location.reload();
+        setJwtToken(jwtToken);
       }
     );
 
@@ -54,6 +43,13 @@ export default function Login() {
     // };
   }, []);
 
+  const continueAuth = () => {
+    setIsLoading(true);
+
+    // send to main process
+    window.electronAPI.auth.initiateLogin();
+  };
+
   return (
     <div className="container flex flex-col space-y-5 justify-center items-center h-screen bg-zinc-700">
       <Logo className="scale-50" />