feat(core): add team badge to user info menu (#12144)

close AF-2545

fix(core): go to workspace command does not work using CMDK

feat(core): add team badge to user info

![CleanShot 2025-05-06 at 16 35 00@2x](https://github.com/user-attachments/assets/ff915ea5-761b-4851-9429-86cbb3041776)

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->

## Summary by CodeRabbit

- **New Features**
  - Introduced a redesigned user info section in the sidebar, including enhanced account details, cloud and AI usage indicators, and team workspace listing with improved navigation.
  - Workspace selector now supports controlled open/close state for smoother sidebar integration.
  - Team workspaces are grouped and displayed with role-based badges and tooltips.
  - Added new localization for team roles and workspace tooltips.

- **Improvements**
  - Updated theming and styling for user plan buttons and usage indicators for a more consistent look.
  - Sidebar user info UI is now more modular and responsive.

- **Bug Fixes**
  - Improved error handling and loading states for quota and usage displays.

- **Chores**
  - Refactored internal state management and code structure for better maintainability.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

packages/frontend/core/src/modules/cloud/entities/user-quota.ts

@@ -10,7 +10,7 @@ import {
   onStart,
   smartRetry,
 } from '@toeverything/infra';
-import { cssVar } from '@toeverything/theme';
+import { cssVarV2 } from '@toeverything/theme/v2';
 import bytes from 'bytes';
 import { map, tap } from 'rxjs';
 
@@ -48,8 +48,8 @@ export class UserQuota extends Entity {
   color$ = this.percent$.map(percent =>
     percent !== null
       ? percent > 80
-        ? cssVar('errorColor')
-        : cssVar('processingColor')
+        ? cssVarV2('toast/iconState/error')
+        : cssVarV2('toast/iconState/regular')
       : null
   );
 

packages/frontend/core/src/modules/workbench/entities/workbench.ts

@@ -21,6 +21,7 @@ export type WorkbenchOpenOptions = {
 
 const sidebarOpenKey = 'workbenchSidebarOpen';
 const sidebarWidthKey = 'workbenchSidebarWidth';
+const workspaceSelectorOpenKey = 'workspaceSelectorOpen';
 
 export class Workbench extends Entity {
   constructor(
@@ -70,6 +71,14 @@ export class Workbench extends Entity {
     this.globalState.set(sidebarWidthKey, width);
   }
 
+  workspaceSelectorOpen$ = LiveData.from(
+    this.globalState.watch<boolean>(workspaceSelectorOpenKey),
+    false
+  );
+  setWorkspaceSelectorOpen(open: boolean) {
+    this.globalState.set(workspaceSelectorOpenKey, open);
+  }
+
   active(index: number | View) {
     if (typeof index === 'number') {
       index = Math.max(0, Math.min(index, this.views$.value.length - 1));
@@ -114,6 +123,18 @@ export class Workbench extends Entity {
     this.setSidebarOpen(!this.sidebarOpen$.value);
   }
 
+  openWorkspaceSelector() {
+    this.setWorkspaceSelectorOpen(true);
+  }
+
+  closeWorkspaceSelector() {
+    this.setWorkspaceSelectorOpen(false);
+  }
+
+  toggleWorkspaceSelector() {
+    this.setWorkspaceSelectorOpen(!this.workspaceSelectorOpen$.value);
+  }
+
   open(to: To, option: WorkbenchOpenOptions = {}) {
     if (option.at === 'new-tab') {
       this.newTab(to, {

packages/frontend/core/src/modules/workspace/services/workspaces.ts

@@ -61,4 +61,10 @@ export class WorkspacesService extends Service {
       x => x.flavour === meta.flavour
     );
   }
+
+  getAllWorkspaceProfile() {
+    const list = this.listService.list.workspaces$.value;
+    const profiles = list.map(meta => this.getProfile(meta));
+    return profiles;
+  }
 }