diff --git a/apps/web/src/components/affine/new-workspace-setting-detail/profile.tsx b/apps/web/src/components/affine/new-workspace-setting-detail/profile.tsx index b4737f30da..f9dc8fd588 100644 --- a/apps/web/src/components/affine/new-workspace-setting-detail/profile.tsx +++ b/apps/web/src/components/affine/new-workspace-setting-detail/profile.tsx @@ -4,7 +4,7 @@ import { useAFFiNEI18N } from '@affine/i18n/hooks'; import { DoneIcon } from '@blocksuite/icons'; import { useBlockSuiteWorkspaceAvatarUrl } from '@toeverything/hooks/use-block-suite-workspace-avatar-url'; import { useBlockSuiteWorkspaceName } from '@toeverything/hooks/use-block-suite-workspace-name'; -import { type FC, useCallback, useState } from 'react'; +import { type FC, useCallback, useRef, useState } from 'react'; import type { AffineOfficialWorkspace } from '../../../shared'; import { Upload } from '../../pure/file-upload'; @@ -37,12 +37,17 @@ export const ProfilePanel: FC<{ const [, update] = useBlockSuiteWorkspaceAvatarUrl( workspace.blockSuiteWorkspace ); + + const [prevName, setPrevName] = useState( + workspace.blockSuiteWorkspace.meta.name + ); const [name, setName] = useBlockSuiteWorkspaceName( workspace.blockSuiteWorkspace ); const [input, setInput] = useState(name); + const inputRef = useRef(null); const handleUpdateWorkspaceName = useCallback( (name: string) => { setName(name); @@ -51,6 +56,13 @@ export const ProfilePanel: FC<{ [setName, t] ); + if (prevName !== name) { + setPrevName(name); + if (inputRef.current) { + inputRef.current.value = name; + } + } + return (
@@ -69,6 +81,7 @@ export const ProfilePanel: FC<{
{workspaceName} - {isCurrent ?
Current
: null} + {isCurrent ? ( +
+ Current +
+ ) : null}
); }; diff --git a/tests/parallels/settings.spec.ts b/tests/parallels/settings.spec.ts index 58adfb9d4c..db903bb6ea 100644 --- a/tests/parallels/settings.spec.ts +++ b/tests/parallels/settings.spec.ts @@ -9,6 +9,7 @@ import { openSettingModal, openShortcutsPanel, } from '../libs/setting'; +import { createWorkspace } from '../libs/workspace'; test('Open settings modal', async ({ page }) => { await openHomePage(page); @@ -69,3 +70,21 @@ test('Open about panel', async ({ page }) => { const title = await page.getByTestId('about-title'); await expect(title).toBeVisible(); }); + +test('Different workspace should have different name in the setting panel', async ({ + page, +}) => { + await openHomePage(page); + await waitEditorLoad(page); + await createWorkspace({ name: 'New Workspace 2' }, page); + await createWorkspace({ name: 'New Workspace 3' }, page); + await openSettingModal(page); + await page.getByTestId('current-workspace-label').click(); + expect(await page.getByTestId('workspace-name-input').inputValue()).toBe( + 'New Workspace 3' + ); + await page.getByText('New Workspace 2').click(); + expect(await page.getByTestId('workspace-name-input').inputValue()).toBe( + 'New Workspace 2' + ); +});