feat: add avatar and nickname display in user info scope

src/client/components/layout/UserConfig.tsx

@@ -1,4 +1,4 @@
-import { Avatar, AvatarFallback } from '@/components/ui/avatar';
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
 import { Button } from '@/components/ui/button';
 import {
   DropdownMenu,
@@ -53,17 +53,18 @@ export const UserConfig: React.FC<UserConfigProps> = React.memo((props) => {
     });
   });
 
+  const nickname = userInfo?.nickname ?? userInfo?.username ?? '';
+
   const avatar = (
     <Avatar size={props.isCollapsed ? 'sm' : 'default'}>
-      <AvatarFallback>
+      <AvatarImage src={userInfo?.avatar ?? undefined} />
-        {(userInfo?.username ?? '').substring(0, 2).toUpperCase()}
+      <AvatarFallback>{nickname.substring(0, 2).toUpperCase()}</AvatarFallback>
-      </AvatarFallback>
     </Avatar>
   );
 
   const name = (
-    <div className="flex-1 overflow-hidden text-ellipsis">
+    <div className="flex-1 overflow-hidden text-ellipsis" title={nickname}>
-      {userInfo?.username ?? ''}
+      {nickname}
     </div>
   );
 

src/server/model/_schema/index.ts

@@ -22,9 +22,12 @@ export const workspaceSchema = z.object({
 });
 
 export const userInfoSchema = z.object({
-  username: z.string(),
   id: z.string(),
   role: z.string(),
+  username: z.string(),
+  nickname: z.string().nullable(),
+  avatar: z.string().nullable(),
+  email: z.string().nullable(),
   createdAt: z.date(),
   updatedAt: z.date(),
   deletedAt: z.date().nullable(),