fix(ui): refine workspace tabs and navigation

.github/workflows/ci.yml

@@ -51,6 +51,9 @@ jobs:
       - name: Run active workspace tab locator contract
         run: yarn run test:active-tab-locator
 
+      - name: Run local file tab title contract
+        run: yarn run test:local-file-tab-title
+
       - name: Run saved console tree refresh contract
         run: yarn run test:saved-console-tree-refresh
 

chat2db-community-client/package.json

@@ -49,6 +49,7 @@
     "test:sql-execution-batch": "tsx src/service/sqlExecutionBatch.test.ts",
     "test:sql-execution-request-tracker": "tsx src/service/sqlExecutionRequestTracker.test.ts",
     "test:sql-execution-stream": "tsx src/service/sqlExecutionStream.test.ts",
+    "test:local-file-tab-title": "tsx src/pages/main/workspace/utils/localTextFile.test.ts",
     "test:sql-in-clipboard": "tsx src/utils/sqlInClipboard.test.ts && tsx src/components/SQLEditor/helper/sqlInsertValueDefaults.test.ts",
     "test:tree-title-highlight": "tsx src/blocks/NewTree/components/TitleRender/highlightSearchText.test.ts",
     "test:verification-code-countdown": "tsx src/utils/verificationCodeCountdown.test.ts && tsx src/utils/latestRequest.test.ts",

chat2db-community-client/src/blocks/SearchResult/index.tsx

@@ -405,6 +405,11 @@ const SearchResult = forwardRef((props: IProps, ref: ForwardedRef<ISearchResultR
       popover: i18n('common.text.output'),
       label: i18n('common.text.output'),
       key: CONSOLE_TAB_ID,
+      styles: {
+        flex: '0 0 96px',
+        width: '96px',
+        maxWidth: '96px',
+      },
       children: (
         <ExecutionConsole
           records={props.executionLogRecords || []}

chat2db-community-client/src/pages/main/CommunityMainPage.tsx

@@ -1,9 +1,8 @@
 import { Confetti, IconButton, IconfontSvg } from '@chat2db/ui';
 import { Tooltip, type InputRef } from 'antd';
-import { Layers, MessagesSquare } from 'lucide-react';
+import { Layers, LayoutDashboard, MessageSquarePlus } from 'lucide-react';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 
-import ChartNoAxesCombined from '@/components/LucideIcons/ChartNoAxesCombined';
 import i18n from '@/i18n';
 import { INavItem } from '@/typings/main';
 import feedback from '@/utils/feedback';
@@ -42,7 +41,7 @@ function CommunityMainPage() {
     () => [
       {
         key: 'stream',
-        icon: MessagesSquare,
+        icon: MessageSquarePlus,
         isLoad: false,
         component: <Stream />,
         name: i18n('stream.nav.title'),
@@ -56,7 +55,7 @@ function CommunityMainPage() {
       },
       {
         key: 'dashboard',
-        icon: ChartNoAxesCombined,
+        icon: LayoutDashboard,
         isLoad: false,
         component: <Dashboard />,
         name: i18n('dashboard.title'),

chat2db-community-client/src/pages/main/workspace/components/WorkspaceTabs/index.tsx

@@ -53,7 +53,11 @@ import { copyToClipboard, getTemporaryId, isTemporaryId } from '@/utils';
 import { useIndexDBStore } from '@/store/indexDB';
 import { getDatabaseSupport } from '@/utils/database';
 import ConsoleERModal from '@/blocks/ERModal/ConsoleERModal';
-import { getLocalTextFileIcon, SQL_FILE_EXTENSION_NAME } from '../../utils/localTextFile';
+import {
+  getLocalTextFileIcon,
+  getLocalTextFileTabPresentation,
+  SQL_FILE_EXTENSION_NAME,
+} from '../../utils/localTextFile';
 import { EditorType } from '@/components/SQLEditor';
 import { ShortcutAction } from '@/constants/shortcut';
 
@@ -1495,13 +1499,17 @@ const WorkspaceTabs = memo(() => {
 
   const getWorkspaceTabItems = (tabs: IWorkspaceTab[]) => {
     return tabs.map((item) => {
-      const popoverContent = item.uniqueData?.popoverContent;
+      const localFileTabPresentation =
+        item.type === WorkspaceTabType.LocalSQLFile
+          ? getLocalTextFileTabPresentation(item.uniqueData?.filePath, item.title)
+          : undefined;
+      const popoverContent = localFileTabPresentation?.popover || item.uniqueData?.popoverContent;
       return {
         prefixIcon:
           item.type === WorkspaceTabType.LocalSQLFile
             ? getLocalTextFileIcon(item.uniqueData?.fileExtension)
             : workspaceTabConfig[item.type]?.icon,
-        label: item.title,
+        label: localFileTabPresentation?.label ?? item.title,
         popover: popoverContent ? <div style={{ padding: '4px 6px' }}>{popoverContent}</div> : undefined,
         key: item.id,
         editableName: item.type === WorkspaceTabType.CONSOLE,

chat2db-community-client/src/pages/main/workspace/utils/localTextFile.test.ts

@@ -0,0 +1,46 @@
+import { getLocalTextFileTabPresentation } from './localTextFile';
+
+function assertEqual(actual: unknown, expected: unknown, message: string) {
+  const actualJson = JSON.stringify(actual);
+  const expectedJson = JSON.stringify(expected);
+  if (actualJson !== expectedJson) {
+    throw new Error(`${message}: expected ${expectedJson}, got ${actualJson}`);
+  }
+}
+
+assertEqual(
+  getLocalTextFileTabPresentation('/Users/example/Desktop/test.sql', 'fallback.sql'),
+  {
+    label: 'test.sql',
+    popover: '/Users/example/Desktop/test.sql',
+  },
+  'uses a POSIX file name as the label and preserves the path for hover',
+);
+assertEqual(
+  getLocalTextFileTabPresentation('C:\\Users\\example\\Desktop\\test.sql', 'fallback.sql'),
+  {
+    label: 'test.sql',
+    popover: 'C:\\Users\\example\\Desktop\\test.sql',
+  },
+  'uses a Windows file name as the label and preserves the path for hover',
+);
+assertEqual(
+  getLocalTextFileTabPresentation('\\\\server\\share\\queries\\report.sql', 'fallback.sql'),
+  {
+    label: 'report.sql',
+    popover: '\\\\server\\share\\queries\\report.sql',
+  },
+  'uses a UNC file name as the label and preserves the path for hover',
+);
+assertEqual(
+  getLocalTextFileTabPresentation('release.sql', 'fallback.sql'),
+  { label: 'release.sql', popover: 'release.sql' },
+  'preserves a bare file name and exposes it on hover',
+);
+assertEqual(
+  getLocalTextFileTabPresentation(undefined, 'saved-title.sql'),
+  { label: 'saved-title.sql', popover: undefined },
+  'falls back to the persisted title when the path is missing',
+);
+
+console.log('local text file tests passed');

chat2db-community-client/src/pages/main/workspace/utils/localTextFile.ts

@@ -12,3 +12,22 @@ export const LOCAL_TEXT_FILE_ICON_MAP: Record<string, string> = {
 export const getLocalTextFileIcon = (fileExtension?: string) => {
   return LOCAL_TEXT_FILE_ICON_MAP[(fileExtension || '').toLowerCase()] || LOCAL_TEXT_FILE_FALLBACK_ICON;
 };
+
+const getLocalTextFileName = (filePath: string) => {
+  const normalizedPath = (filePath || '').replace(/\\/g, '/');
+  const fileName = normalizedPath.slice(normalizedPath.lastIndexOf('/') + 1);
+  return fileName || filePath;
+};
+
+export const getLocalTextFileTabPresentation = (filePath: string | undefined, fallbackLabel: string) => {
+  if (!filePath) {
+    return {
+      label: fallbackLabel,
+      popover: undefined,
+    };
+  }
+  return {
+    label: getLocalTextFileName(filePath),
+    popover: filePath,
+  };
+};