WIP typescript spaghetti.

Chainlit · Nov 15, 2024 · 4b7268d · 4b7268d
1 parent 76b4532
commit 4b7268d
Show file tree

Hide file tree

Showing 3 changed files with 42 additions and 17 deletions.
diff --git a/frontend/src/pages/AuthCallback.tsx b/frontend/src/pages/AuthCallback.tsx
@@ -4,10 +4,11 @@ import { useNavigate } from 'react-router-dom';
 import { useAuth } from '@chainlit/react-client';
 
 import { useQuery } from 'hooks/query';
+import { apiClient } from 'api';
 
 export default function AuthCallback() {
   const query = useQuery();
-  const { authConfig, user, setAccessToken } = useAuth();
+  const { authConfig, user, setAccessToken, setUser } = useAuth();
   const navigate = useNavigate();
 
   useEffect(() => {
@@ -16,7 +17,8 @@ export default function AuthCallback() {
       const token = query.get('access_token');
       setAccessToken(token);
     } else {
-      // TODO: Do stuff to ensure user object.
+      const user = await apiClient.getUser();
+      setUser(user);
     }
   }, [query]);
 

diff --git a/libs/react-client/src/api/hooks/auth.ts b/libs/react-client/src/api/hooks/auth.ts
@@ -22,6 +22,7 @@ export interface IUseAuth {
   accessToken: string | undefined;
   logout: (reload?: boolean) => Promise<void>;
   setAccessToken: (token: string | null | undefined) => void;
+  setUser: (IUser) => void;
 }
 
 // Define useAuth hook
@@ -35,6 +36,12 @@ export const useAuth = (): IUseAuth => {
   const [accessToken, setAccessToken] = useRecoilState(accessTokenState);
   const setThreadHistory = useSetRecoilState(threadHistoryState);
 
+  // See whether we're currently logged in _and_ fetch user object.
+  const { data: apiUser, isLoading: userIsLoading } = useApi<IUser>(
+    user ? null : `/user`,
+    { token: accessToken }
+  );
+
   useEffect(() => {
     if (!data) return;
     setAuthConfig(data);
@@ -78,19 +85,28 @@ export const useAuth = (): IUseAuth => {
     }
   };
 
-  useEffect(() => {
-    if (authConfig?.cookieAuth) {
-      // TODO: Do something to get user object.
-      // setUser(user as IUser)
-      return;
-    }
+  // TOOD: Rewrite this.
+  // When app launches, attempt call to getUser() to determine whether we're logged in.
+  // If so, call setUser(). If not, call logout();
+  //
+  // Old code:
+  // useEffect(async () => {
+  //   if (!user) {
+  //     if (authConfig?.cookieAuth) {
+  //       const user = await apiClient.getUser();
+  //       setUser(user);
+  //       return;
+  //     }
+
+  //     if (getToken()) {
+  //       // Initialize the token from local storage
+  //       saveAndSetToken(getToken());
+  //       return;
+  //     }
+
+  //   }
+  // }, []);
 
-    if (!user && getToken()) {
-      // Initialize the token from local storage
-      saveAndSetToken(getToken());
-      return;
-    }
-  }, []);
 
   // TODO: Change this based on whether our cookies are working.
   const isAuthenticated = !!accessToken;
@@ -103,7 +119,8 @@ export const useAuth = (): IUseAuth => {
       isAuthenticated: true,
       accessToken: '',
       logout: () => Promise.resolve(),
-      setAccessToken: () => {}
+      setAccessToken: () => {},
+      setUser: setUser
     };
   }
 
@@ -114,6 +131,7 @@ export const useAuth = (): IUseAuth => {
     isReady,
     accessToken: accessToken,
     logout: logout,
-    setAccessToken: saveAndSetToken
+    setAccessToken: saveAndSetToken,
+    setUser: setUser
   };
 };
diff --git a/libs/react-client/src/api/index.tsx b/libs/react-client/src/api/index.tsx
@@ -1,4 +1,4 @@
-import { IThread } from 'src/types';
+import { IThread, IUser } from 'src/types';
 import { removeToken } from 'src/utils/token';
 
 import { IFeedback } from 'src/types/feedback';
@@ -154,6 +154,11 @@ export class ChainlitAPI extends APIBase {
     return res.json();
   }
 
+  async getUser(): Promise<IUser> {
+    const res = await this.get(`/user`);
+    return res.json();
+  }
+
   async setFeedback(
     feedback: IFeedback,
     accessToken?: string