@nocobase/client-v2 2.3.0-beta.6 → 2.4.0-alpha.2

package/src/__tests__/settings-runtime-paths.test.ts

@@ -0,0 +1,99 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { afterEach, describe, expect, it } from 'vitest';
+import { resolveStandaloneSettingsPath } from '../settings-app/runtimePaths';
+
+const originalModernPrefix = window.__nocobase_modern_client_prefix__;
+
+const createApp = (publicPath: string, basename: string, name = 'main') =>
+  ({
+    name,
+    getPublicPath: () => publicPath,
+    router: {
+      getBasename: () => basename,
+    },
+  }) as any;
+
+describe('standalone settings runtime paths', () => {
+  afterEach(() => {
+    window.__nocobase_modern_client_prefix__ = originalModernPrefix;
+  });
+
+  it('maps legacy v2 settings paths to the root-public standalone SPA', () => {
+    const app = createApp('/nocobase/v/', '/nocobase/v');
+
+    expect(resolveStandaloneSettingsPath(app, '/nocobase/v/admin/settings/system-settings?tab=mail#smtp')).toBe(
+      '/nocobase/settings/system-settings?tab=mail#smtp',
+    );
+    expect(resolveStandaloneSettingsPath(app, '/nocobase/v/admin/workflow/workflows/42?tab=nodes#canvas')).toBe(
+      '/nocobase/settings/workflow/workflows/42?tab=nodes#canvas',
+    );
+    expect(resolveStandaloneSettingsPath(app, '/nocobase/v/admin/workflow/executions/88')).toBe(
+      '/nocobase/settings/workflow/executions/88',
+    );
+    expect(resolveStandaloneSettingsPath(app, '/nocobase/v/admin/settings/ai/knowledge-base/detail/k1/documents')).toBe(
+      '/nocobase/settings/ai/knowledge-base/detail/k1/documents',
+    );
+  });
+
+  it('preserves both supported sub-application scopes', () => {
+    const appsApp = createApp('/nocobase/v/', '/nocobase/v/apps/demo');
+    const newApp = createApp('/nocobase/v/', '/nocobase/v/_app/demo');
+
+    expect(resolveStandaloneSettingsPath(appsApp, '/nocobase/v/apps/demo/admin/settings/routes')).toBe(
+      '/nocobase/settings/apps/demo/routes',
+    );
+    expect(resolveStandaloneSettingsPath(newApp, '/nocobase/v/_app/demo/admin/settings/routes')).toBe(
+      '/nocobase/settings/_app/demo/routes',
+    );
+  });
+
+  it('supports a custom modern prefix without leaking it into settings URLs', () => {
+    window.__nocobase_modern_client_prefix__ = 'modern';
+    const app = createApp('/base/modern/', '/base/modern');
+
+    expect(resolveStandaloneSettingsPath(app, '/base/modern/admin/settings/security')).toBe('/base/settings/security');
+  });
+
+  it('does not treat an apps segment inside the main application public path as a sub-application scope', () => {
+    window.__nocobase_modern_client_prefix__ = 'modern';
+    const app = createApp('/tenant/apps/root/modern/', '/tenant/apps/root/modern');
+
+    expect(resolveStandaloneSettingsPath(app, '/tenant/apps/root/modern/admin/settings/security')).toBe(
+      '/tenant/apps/root/settings/security',
+    );
+  });
+
+  it.each(['apps', '_app'])(
+    'does not remove a matching %s segment from the root public path for a real sub-application',
+    (scope) => {
+      window.__nocobase_modern_client_prefix__ = 'modern';
+      const app = createApp(`/tenant/${scope}/demo/modern/`, `/tenant/${scope}/demo/modern/${scope}/demo`, 'demo');
+
+      expect(
+        resolveStandaloneSettingsPath(app, `/tenant/${scope}/demo/modern/${scope}/demo/admin/settings/security`),
+      ).toBe(`/tenant/${scope}/demo/settings/${scope}/demo/security`);
+      expect(
+        resolveStandaloneSettingsPath(
+          app,
+          `/tenant/${scope}/demo/modern/${scope}/demo/admin/settings/mail/oauth2?code=abc#done`,
+        ),
+      ).toBe(`/tenant/${scope}/demo/${scope}/demo/admin/settings/mail/oauth2?code=abc#done`);
+    },
+  );
+
+  it('returns the legacy V1 callback for Email OAuth', () => {
+    const app = createApp('/nocobase/v/', '/nocobase/v/apps/demo');
+
+    expect(resolveStandaloneSettingsPath(app, '/nocobase/v/apps/demo/admin/settings/mail/oauth2?code=abc#done')).toBe(
+      '/nocobase/apps/demo/admin/settings/mail/oauth2?code=abc#done',
+    );
+  });
+});

package/src/__tests__/settings-search-shortcut.test.tsx

@@ -0,0 +1,321 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { act, cleanup, fireEvent, render, screen } from '@testing-library/react';
+import React from 'react';
+import * as ReactRouterDOM from 'react-router-dom';
+import { afterEach, describe, expect, it, vi } from 'vitest';
+
+vi.mock('../acl/aclCheckReadiness', () => ({
+  useACLCheckReady: () => true,
+}));
+
+vi.mock('../hooks/useApp', () => ({
+  useApp: () => ({
+    router: {
+      isSkippedAuthCheckRoute: () => false,
+    },
+  }),
+}));
+
+vi.mock('../settings-center/useSettingsSearch', () => ({
+  useSettingsSearch: () => ({
+    recentItems: [],
+    search: vi.fn(() => []),
+  }),
+}));
+
+vi.mock('react-i18next', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('react-i18next')>();
+  return {
+    ...actual,
+    useTranslation: () => ({ t: (key: string) => key }),
+  };
+});
+
+const platforms: Array<{
+  acceptedModifier: KeyboardEventInit;
+  label: string;
+  name: string;
+  platform: string;
+  rejectedModifier: KeyboardEventInit;
+}> = [
+  {
+    acceptedModifier: { metaKey: true },
+    label: '⌘F',
+    name: 'macOS',
+    platform: 'MacIntel',
+    rejectedModifier: { ctrlKey: true },
+  },
+  {
+    acceptedModifier: { ctrlKey: true },
+    label: 'Ctrl F',
+    name: 'Windows',
+    platform: 'Win32',
+    rejectedModifier: { metaKey: true },
+  },
+];
+
+async function renderSettingsSearch(platform: string) {
+  Object.defineProperty(window.navigator, 'platform', {
+    configurable: true,
+    value: platform,
+  });
+  vi.resetModules();
+  vi.doMock('react', () => ({ ...React, default: React }));
+  vi.doMock('react-router-dom', () => ReactRouterDOM);
+
+  const { SettingsSearch } = await import('../settings-app/SettingsSearch');
+  return render(
+    <ReactRouterDOM.MemoryRouter initialEntries={['/settings/system-settings']}>
+      <button type="button">Outside control</button>
+      <SettingsSearch />
+    </ReactRouterDOM.MemoryRouter>,
+  );
+}
+
+function dispatchShortcut(
+  init: KeyboardEventInit,
+  options: {
+    alreadyPrevented?: boolean;
+  } = {},
+) {
+  const event = new KeyboardEvent('keydown', {
+    bubbles: true,
+    cancelable: true,
+    ...init,
+  });
+  if (options.alreadyPrevented) {
+    event.preventDefault();
+  }
+  fireEvent(window, event);
+  return event;
+}
+
+describe('SettingsSearch shortcut', () => {
+  afterEach(() => {
+    cleanup();
+    vi.doUnmock('react');
+    vi.doUnmock('react-router-dom');
+    Reflect.deleteProperty(window.navigator, 'platform');
+  });
+
+  it.each(platforms)('displays $label on $name', async ({ label, platform }) => {
+    await renderSettingsSearch(platform);
+
+    expect(screen.getByTitle('Search settings')).toHaveTextContent(label);
+  });
+
+  it.each(platforms)(
+    'opens only for the exact platform shortcut on $name',
+    async ({ acceptedModifier, platform, rejectedModifier }) => {
+      await renderSettingsSearch(platform);
+
+      const rejectedShortcuts: Array<{
+        name: string;
+        init: KeyboardEventInit;
+        alreadyPrevented?: boolean;
+      }> = [
+        { name: 'F without a modifier', init: { key: 'f' } },
+        { name: 'the other platform modifier + F', init: { key: 'f', ...rejectedModifier } },
+        { name: 'Ctrl+K', init: { key: 'k', ctrlKey: true } },
+        { name: 'Meta+K', init: { key: 'k', metaKey: true } },
+        { name: 'Alt with the platform shortcut', init: { key: 'f', ...acceptedModifier, altKey: true } },
+        { name: 'Shift with the platform shortcut', init: { key: 'f', ...acceptedModifier, shiftKey: true } },
+        { name: 'Ctrl+Meta+F', init: { key: 'f', ctrlKey: true, metaKey: true } },
+        {
+          name: 'an already handled platform shortcut',
+          init: { key: 'f', ...acceptedModifier },
+          alreadyPrevented: true,
+        },
+      ];
+
+      for (const shortcut of rejectedShortcuts) {
+        const event = dispatchShortcut(shortcut.init, { alreadyPrevented: shortcut.alreadyPrevented });
+        expect(screen.queryByRole('dialog'), shortcut.name).not.toBeInTheDocument();
+        expect(event.defaultPrevented, shortcut.name).toBe(shortcut.alreadyPrevented === true);
+      }
+
+      const repeatEvent = dispatchShortcut({ key: 'f', ...acceptedModifier, repeat: true });
+      expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
+      expect(repeatEvent.defaultPrevented).toBe(true);
+
+      const event = dispatchShortcut({ key: 'f', ...acceptedModifier });
+
+      expect(event.defaultPrevented).toBe(true);
+      expect(screen.getByRole('dialog')).toBeInTheDocument();
+    },
+  );
+
+  it.each([
+    { activation: 'click', key: null },
+    { activation: 'Enter', key: 'Enter' },
+    { activation: 'Space', key: ' ' },
+  ])('closes immediately with Escape after opening by $activation', async ({ key }) => {
+    await renderSettingsSearch('MacIntel');
+
+    const outsideControl = screen.getByRole('button', { name: 'Outside control' });
+    const trigger = screen.getByTitle('Search settings');
+    const event = new KeyboardEvent('keydown', { key: 'Escape', bubbles: true, cancelable: true });
+    if (key) {
+      trigger.focus();
+      fireEvent.keyDown(trigger, { key });
+      expect(trigger).toHaveFocus();
+      fireEvent(document.activeElement as Element, event);
+    } else {
+      outsideControl.focus();
+      trigger.focus();
+      fireEvent.click(trigger);
+      expect(trigger).toHaveFocus();
+      fireEvent(document.activeElement as Element, event);
+    }
+
+    expect(event.defaultPrevented).toBe(true);
+    expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
+    expect(trigger).toHaveFocus();
+
+    const closedEvent = new KeyboardEvent('keydown', { key: 'Escape', bubbles: true, cancelable: true });
+    fireEvent(trigger, closedEvent);
+    expect(closedEvent.defaultPrevented).toBe(false);
+  });
+
+  it('moves focus to the trigger before opening from the platform shortcut', async () => {
+    await renderSettingsSearch('MacIntel');
+
+    const outsideControl = screen.getByRole('button', { name: 'Outside control' });
+    const trigger = screen.getByTitle('Search settings');
+    outsideControl.focus();
+
+    const shortcutEvent = new KeyboardEvent('keydown', {
+      key: 'f',
+      metaKey: true,
+      bubbles: true,
+      cancelable: true,
+    });
+    fireEvent(outsideControl, shortcutEvent);
+
+    expect(shortcutEvent.defaultPrevented).toBe(true);
+    expect(screen.getByRole('dialog')).toBeInTheDocument();
+    expect(trigger).toHaveFocus();
+
+    const escapeEvent = new KeyboardEvent('keydown', { key: 'Escape', bubbles: true, cancelable: true });
+    fireEvent(document.activeElement as Element, escapeEvent);
+    expect(escapeEvent.defaultPrevented).toBe(true);
+    expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
+    expect(outsideControl).toHaveFocus();
+  });
+
+  it('keeps immediate Escape from reaching a lower overlay', async () => {
+    await renderSettingsSearch('MacIntel');
+
+    const trigger = screen.getByTitle('Search settings');
+    fireEvent.click(trigger);
+    const lowerOverlayKeyDown = vi.fn();
+    window.addEventListener('keydown', lowerOverlayKeyDown);
+
+    const event = new KeyboardEvent('keydown', { key: 'Escape', bubbles: true, cancelable: true });
+    fireEvent(trigger, event);
+    window.removeEventListener('keydown', lowerOverlayKeyDown);
+
+    expect(lowerOverlayKeyDown).not.toHaveBeenCalled();
+  });
+
+  it('closes from the dialog Escape path and restores the original focus', async () => {
+    await renderSettingsSearch('MacIntel');
+
+    const outsideControl = screen.getByRole('button', { name: 'Outside control' });
+    outsideControl.focus();
+    dispatchShortcut({ key: 'f', metaKey: true });
+    const input = screen.getByPlaceholderText('Search settings');
+    act(() => input.focus());
+    expect(input).toHaveFocus();
+
+    const escapeEvent = new KeyboardEvent('keydown', { key: 'Escape', bubbles: true, cancelable: true });
+    fireEvent(input, escapeEvent);
+
+    expect(escapeEvent.defaultPrevented).toBe(true);
+    expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
+    expect(outsideControl).toHaveFocus();
+  });
+
+  it('closes before a downstream capture handler consumes Escape', async () => {
+    await renderSettingsSearch('MacIntel');
+
+    dispatchShortcut({ key: 'f', metaKey: true });
+    const input = screen.getByPlaceholderText('Search settings');
+    act(() => input.focus());
+    const downstreamCapture = vi.fn((event: KeyboardEvent) => {
+      input.blur();
+      event.stopPropagation();
+    });
+    document.addEventListener('keydown', downstreamCapture, true);
+
+    const escapeEvent = new KeyboardEvent('keydown', { key: 'Escape', bubbles: true, cancelable: true });
+    try {
+      fireEvent(input, escapeEvent);
+    } finally {
+      document.removeEventListener('keydown', downstreamCapture, true);
+    }
+
+    expect(escapeEvent.defaultPrevented).toBe(true);
+    expect(downstreamCapture).not.toHaveBeenCalled();
+    expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
+  });
+
+  it('closes when the browser consumes Escape by blurring the input', async () => {
+    await renderSettingsSearch('MacIntel');
+
+    const outsideControl = screen.getByRole('button', { name: 'Outside control' });
+    outsideControl.focus();
+    dispatchShortcut({ key: 'f', metaKey: true });
+    const input = screen.getByPlaceholderText('Search settings');
+    act(() => input.focus());
+
+    act(() => input.blur());
+
+    expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
+    expect(outsideControl).toHaveFocus();
+  });
+
+  it('keeps the dialog open when a pointer action blurs the input', async () => {
+    await renderSettingsSearch('MacIntel');
+
+    dispatchShortcut({ key: 'f', metaKey: true });
+    const input = screen.getByPlaceholderText('Search settings');
+    act(() => input.focus());
+
+    fireEvent.pointerDown(input);
+    act(() => input.blur());
+    fireEvent.pointerUp(input);
+
+    expect(screen.getByRole('dialog')).toBeInTheDocument();
+  });
+
+  it('keeps focus inside the dialog when the platform shortcut is pressed again', async () => {
+    await renderSettingsSearch('MacIntel');
+
+    dispatchShortcut({ key: 'f', metaKey: true });
+    const input = screen.getByPlaceholderText('Search settings');
+    act(() => input.focus());
+    expect(input).toHaveFocus();
+    fireEvent.change(input, { target: { value: 'portal' } });
+
+    const shortcutEvent = new KeyboardEvent('keydown', {
+      key: 'f',
+      metaKey: true,
+      bubbles: true,
+      cancelable: true,
+    });
+    fireEvent(input, shortcutEvent);
+
+    expect(shortcutEvent.defaultPrevented).toBe(true);
+    expect(input).toHaveValue('');
+    expect(input).toHaveFocus();
+  });
+});

package/src/__tests__/settings-shell.test.tsx

@@ -0,0 +1,261 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { render, screen } from '@testing-library/react';
+import { ConfigProvider, theme as antdTheme } from 'antd';
+import React from 'react';
+import { MemoryRouter } from 'react-router-dom';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { setCurrentUserAuthStatus } from '../nocobase-buildin-plugin/currentUserAuthStatus';
+import { SettingsShell } from '../settings-app/SettingsShell';
+import type { ThemeConfig } from '../theme';
+
+const userCenterModel = { uid: 'settings-user-center' };
+const createModel = vi.fn(() => userCenterModel);
+const matchRoutes = vi.fn(() => [{ route: { id: 'settings' } }]);
+let settingsThemeConfig: ThemeConfig | null = null;
+const mockApp = {
+  flowEngine: {
+    createModel,
+    getModel: vi.fn(() => null),
+    getModelClass: vi.fn(() => true),
+  },
+  router: {
+    matchRoutes,
+  },
+};
+
+vi.mock('../hooks/useApp', () => ({
+  useApp: () => mockApp,
+}));
+
+vi.mock('../settings-app/SettingsBrand', () => ({
+  SettingsBrand: () => <div data-testid="settings-logo">logo</div>,
+}));
+
+vi.mock('../settings-app/SettingsGroupNav', () => ({
+  SettingsGroupNav: () => <div data-testid="settings-group-nav">groups</div>,
+}));
+
+vi.mock('../settings-app/SettingsSearch', () => ({
+  SettingsSearch: () => <div data-testid="settings-search">search</div>,
+}));
+
+vi.mock('../settings-app/useSettingsThemeConfig', () => ({
+  useSettingsThemeConfig: () => settingsThemeConfig,
+}));
+
+vi.mock('../flow/admin-shell/admin-layout/HelpLite', () => ({
+  HelpLite: () => <div data-testid="settings-help">help</div>,
+}));
+
+vi.mock('@nocobase/flow-engine', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('@nocobase/flow-engine')>();
+  return {
+    ...actual,
+    FlowModelRenderer: ({ model }: { model: { uid: string } }) => (
+      <div data-testid="settings-user-center">{model.uid}</div>
+    ),
+  };
+});
+
+const TokenProbe = () => {
+  const { token } = antdTheme.useToken();
+
+  return <div data-testid="settings-theme-token">{`${token.marginBlock}:${token.sizeLG}`}</div>;
+};
+
+describe('SettingsShell', () => {
+  beforeEach(() => {
+    settingsThemeConfig = null;
+    createModel.mockClear();
+    matchRoutes.mockReset();
+    matchRoutes.mockReturnValue([{ route: { id: 'settings' } }]);
+    setCurrentUserAuthStatus(mockApp, 'authenticated');
+  });
+
+  it('renders only the settings brand, group nav, help and user center around its content', () => {
+    render(
+      <MemoryRouter initialEntries={['/settings/system-settings']}>
+        <SettingsShell>
+          <div>settings content</div>
+        </SettingsShell>
+      </MemoryRouter>,
+    );
+
+    expect(screen.getByTestId('settings-logo')).toBeInTheDocument();
+    expect(screen.getByTestId('settings-group-nav')).toBeInTheDocument();
+    expect(screen.getByTestId('settings-search')).toBeInTheDocument();
+    expect(screen.getByTestId('settings-help')).toBeInTheDocument();
+    expect(screen.getByTestId('settings-user-center')).toHaveTextContent('settings-user-center');
+    expect(screen.getByText('settings content')).toBeInTheDocument();
+    expect(screen.queryByTestId('plugin-settings-button')).not.toBeInTheDocument();
+    expect(screen.queryByTestId('notifications-button')).not.toBeInTheDocument();
+  });
+
+  it('keeps its neutral header instead of following the business-side header color', () => {
+    render(
+      <ConfigProvider
+        theme={
+          {
+            token: {
+              colorBgHeader: '#001529',
+              colorPrimary: '#1777FF',
+            },
+          } as ThemeConfig
+        }
+      >
+        <MemoryRouter initialEntries={['/settings/system-settings']}>
+          <SettingsShell>
+            <div>settings content</div>
+          </SettingsShell>
+        </MemoryRouter>
+      </ConfigProvider>,
+    );
+
+    // 主题编辑器里的深色顶栏只作用于业务端；设置中心固定用容器底色。
+    expect(screen.getByRole('banner')).toHaveStyle({ background: '#ffffff' });
+  });
+
+  it('preserves NocoBase custom tokens in the stored compact theme', () => {
+    settingsThemeConfig = { algorithm: antdTheme.compactAlgorithm };
+
+    render(
+      <MemoryRouter initialEntries={['/settings/system-settings']}>
+        <SettingsShell>
+          <TokenProbe />
+        </SettingsShell>
+      </MemoryRouter>,
+    );
+
+    expect(screen.getByTestId('settings-theme-token')).toHaveTextContent('16:16');
+  });
+
+  it('places the settings content and embed container side by side below the header', () => {
+    const { container } = render(
+      <MemoryRouter initialEntries={['/settings/theme-editor']}>
+        <SettingsShell>
+          <div>settings content</div>
+        </SettingsShell>
+      </MemoryRouter>,
+    );
+
+    const header = screen.getByRole('banner');
+    const content = screen.getByRole('main');
+    const embedContainer = container.querySelector<HTMLElement>('#nocobase-embed-container');
+    const workspace = content.parentElement;
+
+    expect(embedContainer).not.toBeNull();
+    if (!embedContainer) {
+      throw new Error('Expected the Settings shell to render the global embed container');
+    }
+    expect(header.nextElementSibling).toBe(workspace);
+    expect(workspace).toHaveStyle({
+      display: 'flex',
+      flex: '1',
+      minWidth: '0',
+      minHeight: '0',
+      overflow: 'hidden',
+    });
+    expect(workspace?.children).toHaveLength(2);
+    expect(workspace?.firstElementChild).toBe(content);
+    expect(workspace?.lastElementChild).toBe(embedContainer);
+    expect(content).toHaveStyle({
+      flex: '1',
+      minWidth: '0',
+      minHeight: '0',
+      overflow: 'hidden',
+    });
+    expect(embedContainer).toHaveStyle({
+      flexShrink: '0',
+      height: '100%',
+      position: 'relative',
+    });
+
+    embedContainer.style.width = '33.3%';
+    embedContainer.style.maxWidth = '800px';
+    expect(workspace?.lastElementChild).toBe(embedContainer);
+    expect(embedContainer).toHaveStyle({ width: '33.3%', maxWidth: '800px' });
+
+    embedContainer.style.width = 'auto';
+    embedContainer.style.maxWidth = 'none';
+    expect(content).toHaveStyle({ flex: '1' });
+    expect(embedContainer).toHaveStyle({ width: 'auto', maxWidth: 'none' });
+  });
+
+  it.each(['auth.signin', '2fa.verify'])('does not render the settings shell for %s', (routeId) => {
+    matchRoutes.mockReturnValue([{ route: { id: routeId } }]);
+
+    render(
+      <MemoryRouter initialEntries={[routeId === 'auth.signin' ? '/settings/signin' : '/settings/2fa']}>
+        <SettingsShell>
+          <div>authentication content</div>
+        </SettingsShell>
+      </MemoryRouter>,
+    );
+
+    expect(screen.getByText('authentication content')).toBeInTheDocument();
+    expect(screen.queryByRole('banner')).not.toBeInTheDocument();
+    expect(screen.queryByTestId('settings-logo')).not.toBeInTheDocument();
+    expect(screen.queryByTestId('settings-help')).not.toBeInTheDocument();
+    expect(screen.queryByTestId('settings-user-center')).not.toBeInTheDocument();
+    expect(document.querySelector('#nocobase-embed-container')).not.toBeInTheDocument();
+  });
+
+  it('does not display the Settings header on the OAuth device verification route', () => {
+    matchRoutes.mockReturnValue([
+      { route: { id: 'settingsDetails' } },
+      { route: { id: 'settingsDetails.idpOAuth.device' } },
+    ]);
+
+    render(
+      <MemoryRouter initialEntries={['/settings/idpOAuth/device?user_code=TKHX-NNCC']}>
+        <SettingsShell>
+          <div>device verification content</div>
+        </SettingsShell>
+      </MemoryRouter>,
+    );
+
+    expect(screen.getByText('device verification content')).toBeInTheDocument();
+    expect(document.querySelector('header')).toHaveStyle({ display: 'none' });
+  });
+
+  it('continues to display the Settings header on other details routes', () => {
+    matchRoutes.mockReturnValue([
+      { route: { id: 'settingsDetails' } },
+      { route: { id: 'settingsDetails.workflow.workflows.id' } },
+    ]);
+
+    render(
+      <MemoryRouter initialEntries={['/settings/workflow/workflows/1']}>
+        <SettingsShell>
+          <div>workflow details content</div>
+        </SettingsShell>
+      </MemoryRouter>,
+    );
+
+    expect(screen.getByRole('banner')).toBeVisible();
+  });
+
+  it('does not render the Settings header before authentication completes', () => {
+    setCurrentUserAuthStatus(mockApp, 'unknown');
+
+    render(
+      <MemoryRouter initialEntries={['/settings/system-settings']}>
+        <SettingsShell>
+          <div>settings content</div>
+        </SettingsShell>
+      </MemoryRouter>,
+    );
+
+    expect(screen.getByText('settings content')).toBeInTheDocument();
+    expect(document.querySelector('header')).toHaveStyle({ display: 'none' });
+    expect(screen.queryByTestId('settings-logo')).not.toBeVisible();
+  });
+});