Skip to content

Commit

Permalink
Willy/UI (#1593)
Browse files Browse the repository at this point in the history
* chore: clean auth hooks

* fix: don't call /user if no auth is configured
  • Loading branch information
willydouhard authored Dec 19, 2024
1 parent cefc8d9 commit 79437c3
Show file tree
Hide file tree
Showing 13 changed files with 182 additions and 204 deletions.
20 changes: 20 additions & 0 deletions libs/react-client/src/api/hooks/auth/config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import { useEffect } from 'react';
import { IAuthConfig } from 'src/index';

import { useApi } from '../api';
import { useAuthState } from './state';

export const useAuthConfig = () => {
const { authConfig, setAuthConfig, cookieAuth } = useAuthState();
const { data: authConfigData, isLoading } = useApi<IAuthConfig>(
authConfig ? null : '/auth/config'
);

useEffect(() => {
if (authConfigData) {
setAuthConfig(authConfigData);
}
}, [authConfigData, setAuthConfig]);

return { authConfig, isLoading, cookieAuth };
};
28 changes: 13 additions & 15 deletions libs/react-client/src/api/hooks/auth/index.ts
Original file line number Diff line number Diff line change
@@ -1,20 +1,19 @@
import { useRecoilState } from 'recoil';
import { useAuthConfig } from 'src/auth/config';
import { useSessionManagement } from 'src/auth/session';
import { useTokenManagement } from 'src/auth/token';
import { IUseAuth } from 'src/auth/types';
import { useUser } from 'src/auth/user';
import { accessTokenState } from 'src/state';
import { IAuthConfig, IUser } from 'src/types';

export const useAuth = (): IUseAuth => {
const { authConfig, isLoading, cookieAuth } = useAuthConfig();
const { logout } = useSessionManagement();
const { user, setUserFromAPI } = useUser();
const [accessToken] = useRecoilState(accessTokenState);
import { useAuthConfig } from './config';
import { useSessionManagement } from './sessionManagement';
import { useAuthState } from './state';
import { useTokenManagement } from './tokenManagement';
import { useUserManagement } from './userManagement';

export const useAuth = () => {
const { authConfig, cookieAuth } = useAuthConfig();
const { logout } = useSessionManagement();
const { user, setUserFromAPI } = useUserManagement();
const { accessToken } = useAuthState();
const { handleSetAccessToken } = useTokenManagement();

const isReady = !!(!isLoading && authConfig);
const isReady = !!authConfig;

if (authConfig && !authConfig.requireLogin) {
return {
Expand Down Expand Up @@ -43,5 +42,4 @@ export const useAuth = (): IUseAuth => {
};
};

// Re-export types and main hook
export type { IUseAuth };
export type { IAuthConfig, IUser };
27 changes: 27 additions & 0 deletions libs/react-client/src/api/hooks/auth/sessionManagement.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import { useContext } from 'react';
import { ChainlitContext } from 'src/index';

import { useAuthState } from './state';
import { useTokenManagement } from './tokenManagement';

export const useSessionManagement = () => {
const apiClient = useContext(ChainlitContext);
const { setUser, setThreadHistory, cookieAuth } = useAuthState();
const { removeToken } = useTokenManagement();

const logout = async (reload = false): Promise<void> => {
await apiClient.logout();
setUser(null);
setThreadHistory(undefined);

if (!cookieAuth) {
removeToken();
}

if (reload) {
window.location.reload();
}
};

return { logout };
};
25 changes: 25 additions & 0 deletions libs/react-client/src/api/hooks/auth/state.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import { useRecoilState, useSetRecoilState } from 'recoil';
import {
accessTokenState,
authState,
threadHistoryState,
userState
} from 'src/state';

export const useAuthState = () => {
const [authConfig, setAuthConfig] = useRecoilState(authState);
const [user, setUser] = useRecoilState(userState);
const [accessToken, setAccessToken] = useRecoilState(accessTokenState);
const setThreadHistory = useSetRecoilState(threadHistoryState);

return {
authConfig,
setAuthConfig,
user,
setUser,
accessToken,
setAccessToken,
setThreadHistory,
cookieAuth: authConfig?.cookieAuth !== false && authConfig?.requireLogin
};
};
53 changes: 53 additions & 0 deletions libs/react-client/src/api/hooks/auth/tokenManagement.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
import { useAuthState } from './state';

const tokenKey = 'token';

export function getToken(): string | null | undefined {
try {
return localStorage.getItem(tokenKey);
} catch (_) {
return;
}
}

export function setToken(token: string): void {
try {
return localStorage.setItem(tokenKey, token);
} catch (_) {
return;
}
}

export function removeToken(): void {
try {
return localStorage.removeItem(tokenKey);
} catch (_) {
return;
}
}

export function ensureTokenPrefix(token: string): string {
const prefix = 'Bearer ';
if (token.startsWith(prefix)) {
return token;
} else {
return prefix + token;
}
}

export const useTokenManagement = () => {
const { setAccessToken, cookieAuth } = useAuthState();

const handleSetAccessToken = (token: string) => {
if (!cookieAuth) {
localStorage.setItem('accessToken', token);
setAccessToken(token);
}
};

const removeToken = () => {
localStorage.removeItem('accessToken');
};

return { handleSetAccessToken, removeToken };
};
File renamed without changes.
34 changes: 34 additions & 0 deletions libs/react-client/src/api/hooks/auth/userManagement.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
import { useEffect } from 'react';
import { IUser } from 'src/types';

import { useApi } from '../api';
import { useAuthConfig } from './config';
import { useAuthState } from './state';
import { useTokenManagement } from './tokenManagement';

export const useUserManagement = () => {
const { user, setUser, cookieAuth } = useAuthState();
const { handleSetAccessToken } = useTokenManagement();
const { isLoading: authConfigLoading } = useAuthConfig();

const { data: userData, mutate: setUserFromAPI } = useApi<IUser>(
cookieAuth ? '/user' : null
);

useEffect(() => {
if (userData) {
setUser(userData);
}
}, [userData, setUser]);

useEffect(() => {
if (!(user && authConfigLoading && cookieAuth)) {
const token = localStorage.getItem('accessToken');
if (token) {
handleSetAccessToken(token);
}
}
}, [user, cookieAuth, authConfigLoading]);

return { user, setUserFromAPI };
};
6 changes: 5 additions & 1 deletion libs/react-client/src/api/index.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,10 @@
import { ensureTokenPrefix, removeToken } from 'src/auth/token';
import { IThread, IUser } from 'src/types';

import {
ensureTokenPrefix,
removeToken
} from 'src/api/hooks/auth/tokenManagement';

import { IFeedback } from 'src/types/feedback';

export * from './hooks/auth';
Expand Down
29 changes: 0 additions & 29 deletions libs/react-client/src/auth/config.ts

This file was deleted.

35 changes: 0 additions & 35 deletions libs/react-client/src/auth/session.ts

This file was deleted.

77 changes: 0 additions & 77 deletions libs/react-client/src/auth/token.ts

This file was deleted.

Loading

0 comments on commit 79437c3

Please sign in to comment.