feat: add display name to user class (not persisted) (Chainlit#1188)

* feat: add display name to user class (not persisted) * fix: copilot test
mauanga · Aug 6, 2024 · c89ea37 · c89ea37
1 parent 6435856
commit c89ea37
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 6 deletions.
diff --git a/backend/chainlit/user.py b/backend/chainlit/user.py
@@ -1,4 +1,4 @@
-from typing import Dict, Literal, TypedDict
+from typing import Dict, Literal, Optional, TypedDict
 
 from dataclasses_json import DataClassJsonMixin
 from pydantic.dataclasses import Field, dataclass
@@ -19,13 +19,15 @@
 class UserDict(TypedDict):
     id: str
     identifier: str
+    display_name: Optional[str]
     metadata: Dict
 
 
 # Used when logging-in a user
 @dataclass
 class User(DataClassJsonMixin):
     identifier: str
+    display_name: Optional[str] = None
     metadata: Dict = Field(default_factory=dict)
 
 

diff --git a/frontend/src/components/atoms/buttons/userButton/avatar.tsx b/frontend/src/components/atoms/buttons/userButton/avatar.tsx
@@ -6,7 +6,7 @@ import UserIcon from 'assets/user';
 
 export default function UserAvatar(props: IconButtonProps) {
   const { user } = useAuth();
-
+  const displayName = user?.display_name || user?.identifier;
   return (
     <IconButton {...props}>
       <Avatar
@@ -19,7 +19,7 @@ export default function UserAvatar(props: IconButtonProps) {
         src={user?.metadata?.image || undefined}
       >
         {user ? (
-          user.identifier?.[0]?.toUpperCase()
+          displayName?.[0]?.toUpperCase()
         ) : (
           <UserIcon sx={{ height: 20, width: 20 }} />
         )}

diff --git a/frontend/src/components/atoms/buttons/userButton/menu.tsx b/frontend/src/components/atoms/buttons/userButton/menu.tsx
@@ -40,7 +40,7 @@ export default function UserMenu({ anchorEl, open, handleClose }: Props) {
         {user.id}
       </Typography>
       <Typography width="100%" fontSize="13px" fontWeight={400}>
-        {user.identifier}
+        {user.display_name || user.identifier}
       </Typography>
     </ListItem>
   );
@@ -86,7 +86,7 @@ export default function UserMenu({ anchorEl, open, handleClose }: Props) {
     <MenuItem
       key="logout"
       onClick={() => {
-        logout();
+        logout(true);
         handleClose();
       }}
     >

diff --git a/libs/react-client/src/api/hooks/auth.ts b/libs/react-client/src/api/hooks/auth.ts
@@ -30,12 +30,15 @@ export const useAuth = () => {
 
   const isReady = !!(!isLoading && authConfig);
 
-  const logout = async () => {
+  const logout = async (reload = false) => {
     await apiClient.logout();
     setUser(null);
     removeToken();
     setAccessToken('');
     setThreadHistory(undefined);
+    if (reload) {
+      window.location.reload();
+    }
   };
 
   const saveAndSetToken = (token: string | null | undefined) => {

diff --git a/libs/react-client/src/types/user.ts b/libs/react-client/src/types/user.ts
@@ -15,5 +15,6 @@ export interface IUserMetadata extends Record<string, any> {
 export interface IUser {
   id: string;
   identifier: string;
+  display_name?: string;
   metadata: IUserMetadata;
 }