fix: show workspace logo in selector

frontend/src/layouts/main/WorkspaceSelector.vue

@@ -2,6 +2,7 @@
     import { computed, onBeforeUnmount, onMounted, ref } from 'vue';
     import { useRouter } from 'vue-router';
     import { useI18n } from 'vue-i18n';
+    import AppAvatar from '@/components/AppAvatar.vue';
     import { useAuthStore } from '@/features/auth/stores/authStore.js';
     import { useWorkspaceStore } from '@/features/workspaces/stores/workspaceStore.js';
     import {
@@ -67,7 +68,11 @@
             :class="{ 'workspace-trigger-static': !canOpenWorkspaceMenu }"
             @click.stop="toggleWorkspaceMenu"
         >
-            <span class="workspace-trigger-mark">W</span>
+            <AppAvatar
+                :name="activeWorkspaceName"
+                :src="workspaceStore.activeWorkspace?.logoUrl"
+                size="sm"
+            />
             <span class="label workspace-trigger-label">{{ activeWorkspaceName }}</span>
             <v-icon
                 v-if="canOpenWorkspaceMenu"
@@ -88,8 +93,15 @@
                 :class="{ 'user-menu-item-active': workspace.id === workspaceStore.activeWorkspaceId }"
                 @click="chooseWorkspace(workspace.id)"
             >
-                <span>{{ workspace.name }}</span>
-                <span><small>{{ workspace.timeZone }}</small></span>
+                <AppAvatar
+                    :name="workspace.name"
+                    :src="workspace.logoUrl"
+                    size="sm"
+                />
+                <span class="user-menu-item-copy">
+                    <span>{{ workspace.name }}</span>
+                    <small>{{ workspace.timeZone }}</small>
+                </span>
             </button>
 
             <button
@@ -143,12 +155,6 @@
         cursor: default;
     }
 
-    .workspace-trigger-mark {
-        @apply flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-xl text-xs font-black uppercase;
-        background: linear-gradient(135deg, rgba(255, 138, 61, 0.16), rgba(239, 68, 68, 0.14));
-        color: #c2410c;
-    }
-
     .workspace-trigger-label {
         @apply max-w-[11rem] truncate;
     }
@@ -162,7 +168,7 @@
     }
 
     .user-menu-item {
-        @apply flex items-center gap-3 rounded-[0.9rem] px-3 py-3 text-left text-sm font-semibold transition-colors flex-col;
+        @apply flex items-center gap-3 rounded-[0.9rem] px-3 py-3 text-left text-sm font-semibold transition-colors;
         color: #172033;
     }
 
@@ -175,8 +181,17 @@
         color: #c2410c;
     }
 
-    .user-menu-item small {
-        @apply ml-auto text-xs font-medium;
+    .user-menu-item-copy {
+        @apply flex min-w-0 flex-1 flex-col gap-0.5;
+    }
+
+    .user-menu-item-copy span,
+    .user-menu-item-copy small {
+        @apply truncate;
+    }
+
+    .user-menu-item-copy small {
+        @apply text-xs font-medium;
         color: #526178;
     }