From 565f221a94df1ed686032dfdbe4bb154971bc91f Mon Sep 17 00:00:00 2001
From: xlx1212 <xlx1212@noreply.gitcode.com>
Date: Wed, 5 Aug 2026 02:40:47 +0800
Subject: [PATCH] fix: make workspace icons consistent between active and
 inactive states (#1849)

Active workspaces showed a DotMatrixArrowRightIcon (arrow) instead of the
normal folder/letter icon, making active and inactive workspaces look like
different entity types. Remove the isActive conditional from both the
assistant workspace and normal workspace branches so all rows always use
the same icon regardless of active state. Clean up now-dead SCSS rules
for the removed active-icon classes. Add a layout test to prevent
regression.
---
 .../sections/workspaces/WorkspaceItem.tsx     | 21 ++++---------------
 .../workspaces/WorkspaceListSection.scss      | 21 +------------------
 .../WorkspaceListSectionLayout.test.ts        | 20 ++++++++++++++++++
 3 files changed, 25 insertions(+), 37 deletions(-)

diff --git a/src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceItem.tsx b/src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceItem.tsx
index 32aaf802cb..d851487bea 100644
--- a/src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceItem.tsx
+++ b/src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceItem.tsx
@@ -2,7 +2,6 @@ import React, { lazy, Suspense, useCallback, useContext, useEffect, useMemo, use
 import { createPortal } from 'react-dom';
 import { Folder, FolderOpen, MoreHorizontal, FolderSearch, Plus, ChevronDown, Trash2, RotateCcw, Copy, FileText, GitBranch, Bot, Link2, ListChecks, Loader2, Clock3 } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
-import { DotMatrixArrowRightIcon } from './DotMatrixArrowRightIcon';
 import { Button, ConfirmDialog, Modal, Tooltip } from '@/component-library';
 import { useI18n } from '@/infrastructure/i18n';
 import { aiExperienceConfigService } from '@/infrastructure/config/services/AIExperienceConfigService';
@@ -790,15 +789,9 @@ const WorkspaceItem: React.FC<WorkspaceItemProps> = ({
             data-workspace-id={workspace.id}
           >
             <span className="bitfun-nav-panel__assistant-item-avatar" aria-hidden="true">
-              {isActive ? (
-                <span className="bitfun-nav-panel__assistant-item-active-icon">
-                  <DotMatrixArrowRightIcon size={14} />
-                </span>
-              ) : (
-                <span className="bitfun-nav-panel__assistant-item-avatar-letter">
-                  {workspaceDisplayName.charAt(0)}
-                </span>
-              )}
+              <span className="bitfun-nav-panel__assistant-item-avatar-letter">
+                {workspaceDisplayName.charAt(0)}
+              </span>
               <span className={`bitfun-nav-panel__assistant-item-icon-toggle${sessionsCollapsed ? ' is-collapsed' : ''}`}>
                 <ChevronDown size={12} />
               </span>
@@ -1025,13 +1018,7 @@ const WorkspaceItem: React.FC<WorkspaceItemProps> = ({
         >
           <span className="bitfun-nav-panel__workspace-item-icon" aria-hidden="true">
             <span className="bitfun-nav-panel__workspace-item-icon-default">
-              {isActive ? (
-                <span className="bitfun-nav-panel__workspace-item-active-icon">
-                  <DotMatrixArrowRightIcon size={14} />
-                </span>
-              ) : (
-                <FolderOpen size={14} />
-              )}
+              <FolderOpen size={14} />
             </span>
             <span className={`bitfun-nav-panel__workspace-item-icon-toggle${sessionsCollapsed ? ' is-collapsed' : ''}`}>
               <ChevronDown size={14} />
diff --git a/src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceListSection.scss b/src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceListSection.scss
index 841398bd3c..e80a96c414 100644
--- a/src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceListSection.scss
+++ b/src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceListSection.scss
@@ -301,24 +301,6 @@
     padding-right: 52px;
   }
 
-  &__workspace-item-active-icon {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    color: inherit;
-  }
-
-  &__assistant-item-active-icon {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    color: inherit;
-    transition: opacity $motion-fast $easing-standard,
-                transform $motion-fast $easing-standard;
-    opacity: 1;
-    transform: scale(1);
-  }
-
   &__workspace-item-avatar {
     position: relative;
     display: inline-flex;
@@ -1115,8 +1097,7 @@
     &:hover {
       background: color-mix(in srgb, var(--element-bg-medium) 60%, transparent);
 
-      .bitfun-nav-panel__assistant-item-avatar-letter,
-      .bitfun-nav-panel__assistant-item-active-icon {
+      .bitfun-nav-panel__assistant-item-avatar-letter {
         opacity: 0;
         transform: scale(0.6);
       }
diff --git a/src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceListSectionLayout.test.ts b/src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceListSectionLayout.test.ts
index 1fa445147a..7f384e5ae4 100644
--- a/src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceListSectionLayout.test.ts
+++ b/src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceListSectionLayout.test.ts
@@ -10,6 +10,13 @@ function readWorkspaceListStylesheet(): string {
   return stylesheet.replace(/\r\n/g, '\n');
 }
 
+function readWorkspaceItemSource(): string {
+  return readFileSync(
+    fileURLToPath(new URL('./WorkspaceItem.tsx', import.meta.url)),
+    'utf8',
+  );
+}
+
 function extractBlock(stylesheet: string, selector: string): string {
   const escapedSelector = selector.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
   const match = stylesheet.match(new RegExp(`${escapedSelector}\\s*\\{(?<body>[\\s\\S]*?)\\n\\s*\\}`));
@@ -90,4 +97,17 @@ describe('WorkspaceListSection layout styles', () => {
       expect(block).toContain('height: 20px;');
     }
   });
+
+  it('renders the same icon for active and inactive workspace rows', () => {
+    const source = readWorkspaceItemSource();
+    const stylesheet = readWorkspaceListStylesheet();
+
+    // Active and inactive workspace rows must not render different icon types
+    // (e.g. an arrow for active, folder for inactive).
+    expect(source).not.toContain('DotMatrixArrowRightIcon');
+    expect(source).not.toContain('workspace-item-active-icon');
+    expect(source).not.toContain('assistant-item-active-icon');
+    expect(stylesheet).not.toContain('workspace-item-active-icon');
+    expect(stylesheet).not.toContain('assistant-item-active-icon');
+  });
 });