@micha.bigler/ui-core-micha 3.14.4 → 4.0.0

package/src/utils/authService.js

@@ -1,223 +0,0 @@
-import { 
-  getPasskeyRegistrationOptions, 
-  completePasskeyRegistration, 
-  getPasskeyLoginOptions, 
-  completePasskeyLogin, 
-  fetchCurrentUser,
-  authenticateWithMFA 
-} from '../auth/authApi';
-
-import { 
-    ensureWebAuthnSupport, 
-    serializeCredential 
-} from '../utils/webauthn';
-import { normaliseApiError } from '../utils/auth-errors';
-import apiClient from '../auth/apiClient';
-import { HEADLESS_BASE } from '../auth/authConfig'; 
-
-// HILFSFUNKTION: Entpackt die Optionen, falls sie in 'publicKey' stecken
-function resolveWebAuthnOptions(options) {
-    if (options && options.publicKey) {
-        return options.publicKey;
-    }
-    return options;
-}
-
-export async function registerPasskey(name = 'Passkey') {
-  ensureWebAuthnSupport();
-
-  // 1. Options vom Server
-  const optionsEnvelope = await getPasskeyRegistrationOptions();
-  // optionsEnvelope ist bei dir: { publicKey: { ... } } oder { creation_options: { publicKey: {...} } }
-
-  // Extrahiere die eigentlichen publicKey-Options
-  const publicKeyJson =
-    (optionsEnvelope.creation_options && optionsEnvelope.creation_options.publicKey) ||
-    optionsEnvelope.publicKey ||
-    optionsEnvelope;
-
-  let credential;
-  try {
-    const publicKey = window.PublicKeyCredential.parseCreationOptionsFromJSON(
-      publicKeyJson,
-    );
-    // Wichtig: create({ publicKey: ... })
-    credential = await navigator.credentials.create({ publicKey });
-  } catch (err) {
-    if (err.name === 'NotAllowedError') {
-      throw normaliseApiError(
-        new Error('Auth.PASSKEY_CANCELLED'),
-        'Auth.PASSKEY_CANCELLED',
-      );
-    }
-    throw normaliseApiError(err, 'Auth.PASSKEY_CREATE_FAILED');
-  }
-
-  const credentialJson = serializeCredential(credential);
-  return completePasskeyRegistration(credentialJson, name);
-}
-
-export async function loginWithPasskey() {
-    ensureWebAuthnSupport();
-    
-    // 1. Get Challenge
-    const requestOptions = await getPasskeyLoginOptions();
-    
-    // 2. Browser Sign
-    let assertion;
-    try {
-        // FIX: Erst entpacken
-        const optionsJson = resolveWebAuthnOptions(requestOptions);
-        
-        // Dann parsen
-        const publicKeyOptions =
-          window.PublicKeyCredential.parseRequestOptionsFromJSON(optionsJson);
-        assertion = await navigator.credentials.get({ publicKey: publicKeyOptions });
-    } catch (err) {
-         if (err.name === 'NotAllowedError') {
-            throw normaliseApiError(new Error('Auth.PASSKEY_CANCELLED'), 'Auth.PASSKEY_CANCELLED');
-         }
-         throw err;
-    }
-
-    // 3. Complete
-    const credentialJson = serializeCredential(assertion);
-    await completePasskeyLogin(credentialJson);
-    
-    // 4. Reload User
-    return fetchCurrentUser();
-}
-
-/**
- * WebAuthn als 2. Faktor nutzen (wenn Passwort schon eingegeben wurde).
- */
-export async function authenticateMfaWithPasskey() {
-    ensureWebAuthnSupport();
-
-    let requestOptions;
-    try {
-        const url = typeof HEADLESS_BASE !== 'undefined' 
-            ? `${HEADLESS_BASE}/auth/2fa/authenticate`
-            : '/api/auth/browser/v1/auth/2fa/authenticate';
-
-        const res = await apiClient.get(url);
-        // Allauth liefert oft: { data: { request_options: { publicKey: ... } } }
-        const data = res.data?.data || res.data;
-        requestOptions = data.request_options || data;
-    } catch (err) {
-        throw normaliseApiError(err, 'Auth.MFA_CHALLENGE_FAILED');
-    }
-
-    if (!requestOptions) {
-        throw new Error('No WebAuthn challenge received for MFA.');
-    }
-
-    // 2. Browser Sign
-    let assertion;
-    try {
-        // FIX: Erst entpacken
-        const optionsJson = resolveWebAuthnOptions(requestOptions);
-        
-        // Dann parsen
-        const publicKeyOptions = window.PublicKeyCredential.parseRequestOptionsFromJSON(optionsJson);
-        
-        // Dann wrappen
-        assertion = await navigator.credentials.get({ publicKey: publicKeyOptions });
-    } catch (err) {
-         if (err.name === 'NotAllowedError') {
-            throw normaliseApiError(new Error('Auth.PASSKEY_CANCELLED'), 'Auth.PASSKEY_CANCELLED');
-         }
-         throw err;
-    }
-
-    // 3. Authenticate via existing API function
-    const credentialJson = serializeCredential(assertion);
-    return authenticateWithMFA({ credential: credentialJson });
-}
-
-function getCsrfTokenFromCookie() {
-  if (typeof document === 'undefined' || !document.cookie) return null;
-  const match = document.cookie.match(/(?:^|; )csrftoken=([^;]+)/);
-  return match ? decodeURIComponent(match[1]) : null;
-}
-
-function submitSocialRedirectForm({ provider, callbackUrl, csrfToken, process }) {
-  const form = document.createElement('form');
-  form.method = 'POST';
-  form.action = `${HEADLESS_BASE}/auth/provider/redirect`;
-  form.style.display = 'none';
-
-  const fields = {
-    provider,
-    process,
-    callback_url: callbackUrl,
-    csrfmiddlewaretoken: csrfToken,
-  };
-
-  Object.entries(fields).forEach(([name, value]) => {
-    const input = document.createElement('input');
-    input.type = 'hidden';
-    input.name = name;
-    input.value = String(value);
-    form.appendChild(input);
-  });
-
-  document.body.appendChild(form);
-  form.submit();
-}
-
-export async function startSocialLogin(provider, options = {}) {
-  if (typeof window === 'undefined') {
-    throw normaliseApiError(
-      new Error('Auth.SOCIAL_LOGIN_NOT_IN_BROWSER'), 
-      'Auth.SOCIAL_LOGIN_NOT_IN_BROWSER'
-    );
-  }
-
-  try {
-    // Ensures csrftoken cookie exists before form POST.
-    await apiClient.get('/api/csrf/');
-  } catch {
-    // Continue; token might already be present.
-  }
-
-  const csrfToken = getCsrfTokenFromCookie();
-  if (!csrfToken) {
-    throw normaliseApiError(
-      new Error('Auth.SOCIAL_LOGIN_FAILED'),
-      'Auth.SOCIAL_LOGIN_FAILED',
-    );
-  }
-
-  const process = options.process === 'connect' ? 'connect' : 'login';
-  const originUrl = new URL(window.location.origin);
-  if (originUrl.hostname.startsWith('www.')) {
-    originUrl.hostname = originUrl.hostname.slice(4);
-  }
-
-  // S62: Same-Origin-Validation für `callbackUrl`. Verhindert, dass künftige
-  // Konsumenten mit tainted Wert (z.B. `?next=https://evil.example/`) einen
-  // Open-Redirect via OAuth-Callback-Pfad erzeugen. Caller heute safe
-  // (`options.callbackUrl` wird nur intern gesetzt), aber defensive depth.
-  let callbackUrl = `${originUrl.origin}/login`;
-  if (options.callbackUrl) {
-    try {
-      const candidate = new URL(options.callbackUrl, window.location.origin);
-      if (candidate.origin === originUrl.origin) {
-        callbackUrl = candidate.toString();
-      } else {
-        // Cross-origin → silent fallback auf Default; OAuth-Flows laufen
-        // weiter, nur ohne tainted URL. Symptom-Diagnose via Console-Warning.
-        // eslint-disable-next-line no-console
-        console.warn(
-          `[startSocialLogin] callbackUrl cross-origin rejected: ${candidate.origin} != ${originUrl.origin}. Falling back to /login.`
-        );
-      }
-    } catch {
-      // Invalid URL → fallback, gleiche Rationale.
-      // eslint-disable-next-line no-console
-      console.warn('[startSocialLogin] callbackUrl is not a valid URL — falling back to /login.');
-    }
-  }
-  submitSocialRedirectForm({ provider, callbackUrl, csrfToken, process });
-}

package/src/utils/resolveErrorText.js

@@ -1,28 +0,0 @@
-import { extractErrorInfo } from './auth-errors';
-
-export function resolveErrorText(i18n, err, defaultKey) {
-  // API helpers normally throw normalized errors. Keeping this small boundary
-  // adapter also makes the resolver safe for callers that pass an Axios error
-  // directly (for example, an app-level wrapper around a kit API call).
-  const info = err?.response ? extractErrorInfo(err) : null;
-  const resolvedErr = info
-    ? {
-        ...err,
-        code: info.code || err.code,
-        field: info.field,
-        i18nKey: info.i18nKey,
-        backendMessage: info.message,
-      }
-    : err;
-  const exists = (key) => Boolean(key) && i18n.exists(key);
-
-  if (!resolvedErr) return i18n.t(defaultKey);
-  if (exists(resolvedErr.i18nKey)) return i18n.t(resolvedErr.i18nKey);
-  if (resolvedErr.field && resolvedErr.code) {
-    const fieldKey = `Auth.field.${resolvedErr.field}.${resolvedErr.code}`;
-    if (exists(fieldKey)) return i18n.t(fieldKey);
-  }
-  if (exists(resolvedErr.code)) return i18n.t(resolvedErr.code);
-  if (resolvedErr.backendMessage) return resolvedErr.backendMessage;
-  return i18n.t(defaultKey);
-}

package/src/utils/webauthn.js

@@ -1,51 +0,0 @@
-// src/utils/webauthn.js
-export function bufferToBase64URL(buffer) {
-  const bytes = new Uint8Array(buffer);
-  let str = '';
-  for (const char of bytes) {
-    str += String.fromCharCode(char);
-  }
-  const base64 = btoa(str);
-  return base64.replace(/\+/g, '-').replace(/\//g, '_').replace(/=/g, '');
-}
-
-export function serializeCredential(credential) {
-  const p = {
-    id: credential.id,
-    rawId: bufferToBase64URL(credential.rawId),
-    type: credential.type,
-    response: {
-      clientDataJSON: bufferToBase64URL(credential.response.clientDataJSON),
-    },
-  };
-
-  if (credential.response.attestationObject) {
-    p.response.attestationObject = bufferToBase64URL(credential.response.attestationObject);
-  }
-  if (credential.response.authenticatorData) {
-    p.response.authenticatorData = bufferToBase64URL(credential.response.authenticatorData);
-  }
-  if (credential.response.signature) {
-    p.response.signature = bufferToBase64URL(credential.response.signature);
-  }
-  if (credential.response.userHandle) {
-    p.response.userHandle = bufferToBase64URL(credential.response.userHandle);
-  }
-  
-  if (typeof credential.getClientExtensionResults === 'function') {
-    p.clientExtensionResults = credential.getClientExtensionResults();
-  }
-
-  return p;
-}
-
-export function ensureWebAuthnSupport() {
-  if (
-    typeof window === 'undefined' ||
-    typeof navigator === 'undefined' ||
-    !window.PublicKeyCredential ||
-    !navigator.credentials
-  ) {
-    throw new Error('Auth.PASSKEY_NOT_SUPPORTED');
-  }
-}

package/tests/AccountPage.profileStatements.test.jsx

@@ -1,162 +0,0 @@
-// @vitest-environment jsdom
-import React from 'react';
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
-import { cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { ThemeProvider, createTheme } from '@mui/material/styles';
-import { MemoryRouter, Route, Routes } from 'react-router-dom';
-
-vi.mock('react-i18next', () => {
-  const KEYS = {
-    'Account.TITLE': 'Account & Administration',
-    'Account.PAGE_TITLE': 'Account',
-    'Account.TAB_PROFILE': 'Profile',
-    'Account.TAB_SECURITY': 'Security',
-    'Account.GROUP_MY_ACCOUNT': 'My account',
-    'Profile.ACCEPT_PRIVACY_LABEL': 'Accept privacy statement',
-    'Profile.ACCEPT_COOKIES_LABEL': 'Accept convenience cookies',
-    'Profile.PRIVACY_STATEMENT_TITLE': 'Privacy statement',
-    'Profile.COOKIES_STATEMENT_TITLE': 'Cookie statement',
-    'Profile.SAVE_BUTTON': 'Save',
-    'Profile.PRIVACY_SECTION_TITLE': 'Privacy and cookies',
-    'Profile.USERNAME_LABEL': 'Username',
-    'Profile.EMAIL_LABEL': 'Email',
-    'Profile.FIRST_NAME_LABEL': 'First name',
-    'Profile.LAST_NAME_LABEL': 'Last name',
-  };
-  const t = (key, fallback) => KEYS[key] ?? fallback ?? key;
-  return {
-    useTranslation: () => ({
-      t,
-      i18n: { exists: (key) => Object.hasOwn(KEYS, key), t },
-    }),
-  };
-});
-
-vi.mock('../src/auth/authApi', () => ({
-  fetchAuthPolicy: vi.fn(),
-  fetchPrivacyStatement: vi.fn(),
-  fetchCookieStatement: vi.fn(),
-  updateUserProfile: vi.fn(),
-}));
-
-vi.mock('../src/components/SecurityComponent', () => ({ SecurityComponent: () => null }));
-vi.mock('../src/components/UserListComponent', () => ({ UserListComponent: () => null }));
-vi.mock('../src/components/UserInviteComponent', () => ({ UserInviteComponent: () => null }));
-vi.mock('../src/components/AccessCodeManager', () => ({ AccessCodeManager: () => null }));
-vi.mock('../src/components/AllowedEmailDomainsManager', () => ({ AllowedEmailDomainsManager: () => null }));
-vi.mock('../src/components/RegistrationMethodsManager', () => ({ RegistrationMethodsManager: () => null }));
-vi.mock('../src/components/AuthFactorRequirementCard', () => ({ AuthFactorRequirementCard: () => null }));
-vi.mock('../src/components/AccessCodeSingleUseToggle', () => ({ AccessCodeSingleUseToggle: () => null }));
-vi.mock('../src/components/QrSignupManager', () => ({ QrSignupManager: () => null }));
-vi.mock('../src/components/QrSignupValidityManager', () => ({ QrSignupValidityManager: () => null }));
-vi.mock('../src/components/SupportRecoveryRequestsTab', () => ({ SupportRecoveryRequestsTab: () => null }));
-vi.mock('../src/components/BulkInviteCsvTab', () => ({ BulkInviteCsvTab: () => null }));
-
-import { AuthContext } from '../src/auth/AuthContext';
-import {
-  fetchCookieStatement,
-  fetchPrivacyStatement,
-  updateUserProfile,
-} from '../src/auth/authApi';
-import { AccountPage } from '../src/pages/AccountPage';
-
-const theme = createTheme();
-const user = {
-  email: 'person@example.com',
-  username: 'person',
-  first_name: 'Pat',
-  last_name: 'Example',
-  accepted_privacy_statement: false,
-  accepted_convenience_cookies: true,
-  is_superuser: false,
-  ui_permissions: {},
-  available_roles: [],
-};
-
-function setViewportWidth(width) {
-  window.matchMedia = vi.fn().mockImplementation((query) => ({
-    matches: query.includes('max-width') ? width <= 900 : width > 900,
-    media: query,
-    onchange: null,
-    addEventListener: vi.fn(),
-    removeEventListener: vi.fn(),
-    addListener: vi.fn(),
-    removeListener: vi.fn(),
-    dispatchEvent: vi.fn(),
-  }));
-}
-
-function renderAccount({ showProfileStatements } = {}) {
-  const login = vi.fn();
-  return {
-    login,
-    ...render(
-      <ThemeProvider theme={theme}>
-        <AuthContext.Provider value={{ user, login, loading: false }}>
-          <MemoryRouter initialEntries={['/account']}>
-            <Routes>
-              <Route
-                path="/account"
-                element={<AccountPage showProfileStatements={showProfileStatements} />}
-              />
-            </Routes>
-          </MemoryRouter>
-        </AuthContext.Provider>
-      </ThemeProvider>,
-    ),
-  };
-}
-
-describe('AccountPage profile statements', () => {
-  beforeEach(() => {
-    setViewportWidth(1280);
-    vi.mocked(fetchPrivacyStatement).mockResolvedValue('Privacy text');
-    vi.mocked(fetchCookieStatement).mockResolvedValue('Cookie text');
-    vi.mocked(updateUserProfile).mockResolvedValue({ ...user, accepted_privacy_statement: true });
-  });
-
-  afterEach(() => {
-    cleanup();
-    vi.clearAllMocks();
-  });
-
-  it('fetches and presents both statement panels when the prop is omitted', async () => {
-    renderAccount();
-
-    expect(await screen.findByText('Privacy statement')).toBeTruthy();
-    expect(screen.getByText('Cookie statement')).toBeTruthy();
-    await waitFor(() => {
-      expect(fetchPrivacyStatement).toHaveBeenCalledOnce();
-      expect(fetchCookieStatement).toHaveBeenCalledOnce();
-    });
-    expect(await screen.findByText('Privacy text')).toBeTruthy();
-    expect(screen.getByText('Cookie text')).toBeTruthy();
-  });
-
-  it('hides statements and skips requests while retaining editable consent submission', async () => {
-    const { login } = renderAccount({ showProfileStatements: false });
-
-    expect(screen.queryByText('Privacy statement')).toBeNull();
-    expect(screen.queryByText('Cookie statement')).toBeNull();
-    expect(fetchPrivacyStatement).not.toHaveBeenCalled();
-    expect(fetchCookieStatement).not.toHaveBeenCalled();
-
-    const privacyConsent = screen.getByRole('checkbox', { name: 'Accept privacy statement' });
-    const cookieConsent = screen.getByRole('checkbox', { name: 'Accept convenience cookies' });
-    expect(privacyConsent.checked).toBe(false);
-    expect(cookieConsent.checked).toBe(true);
-    fireEvent.click(privacyConsent);
-    fireEvent.click(cookieConsent);
-    fireEvent.click(screen.getByRole('button', { name: 'Save' }));
-
-    await waitFor(() => {
-      expect(updateUserProfile).toHaveBeenCalledWith({
-        first_name: 'Pat',
-        last_name: 'Example',
-        accepted_privacy_statement: true,
-        accepted_convenience_cookies: false,
-      });
-    });
-    expect(login).toHaveBeenCalledOnce();
-  });
-});

package/tests/AccountPage.test.jsx

@@ -1,200 +0,0 @@
-// @vitest-environment jsdom
-import React from 'react';
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
-import { cleanup, fireEvent, render, screen } from '@testing-library/react';
-import { ThemeProvider, createTheme } from '@mui/material/styles';
-import { MemoryRouter, Route, Routes, useLocation } from 'react-router-dom';
-
-vi.mock('react-i18next', () => {
-  const KEYS = {
-    'Account.TITLE': 'Account & Administration',
-    'Account.PAGE_TITLE': 'Account',
-    'Account.TAB_PROFILE': 'Profile',
-    'Account.TAB_SECURITY': 'Security',
-    'Account.TAB_USERS': 'Users',
-    'Account.TAB_INVITE': 'Invite',
-    'Account.TAB_SUPPORT': 'Support',
-    'Account.GROUP_MY_ACCOUNT': 'My account',
-    'Account.GROUP_MANAGEMENT': 'Management',
-    'Account.GROUP_HELP': 'Help',
-    'Account.GROUP_MORE': 'More',
-    'SectionNav.TITLE': 'Switch section',
-    'SectionNav.TRIGGER_EYEBROW': 'Section',
-    'SectionNav.LAST_OPENED': 'Last opened',
-  };
-  const t = (key, fallback) => KEYS[key] ?? fallback ?? key;
-  return {
-    useTranslation: () => ({
-      t,
-      // resolveErrorText (AUTH-10) reads i18n.exists/i18n.t off the object
-      // useTranslation() returns — this mock must carry both, not just `t`.
-      i18n: { exists: (key) => Object.hasOwn(KEYS, key), t },
-    }),
-  };
-});
-
-vi.mock('../src/auth/authApi', () => ({
-  fetchAuthPolicy: vi.fn(() => new Promise(() => {})),
-  updateUserProfile: vi.fn(),
-}));
-
-vi.mock('../src/components/ProfileComponent', () => ({
-  ProfileComponent: () => <div>Profile content</div>,
-}));
-vi.mock('../src/components/SecurityComponent', () => ({
-  SecurityComponent: () => <div>Security content</div>,
-}));
-vi.mock('../src/components/UserListComponent', () => ({
-  UserListComponent: () => <div>Users content</div>,
-}));
-vi.mock('../src/components/UserInviteComponent', () => ({ UserInviteComponent: () => null }));
-vi.mock('../src/components/AccessCodeManager', () => ({ AccessCodeManager: () => null }));
-vi.mock('../src/components/AllowedEmailDomainsManager', () => ({ AllowedEmailDomainsManager: () => null }));
-vi.mock('../src/components/RegistrationMethodsManager', () => ({ RegistrationMethodsManager: () => null }));
-vi.mock('../src/components/AuthFactorRequirementCard', () => ({ AuthFactorRequirementCard: () => null }));
-vi.mock('../src/components/AccessCodeSingleUseToggle', () => ({ AccessCodeSingleUseToggle: () => null }));
-vi.mock('../src/components/QrSignupManager', () => ({ QrSignupManager: () => null }));
-vi.mock('../src/components/QrSignupValidityManager', () => ({ QrSignupValidityManager: () => null }));
-vi.mock('../src/components/SupportRecoveryRequestsTab', () => ({
-  SupportRecoveryRequestsTab: () => <div>Support content</div>,
-}));
-vi.mock('../src/components/BulkInviteCsvTab', () => ({ BulkInviteCsvTab: () => null }));
-
-import { AuthContext } from '../src/auth/AuthContext';
-import { AccountPage } from '../src/pages/AccountPage';
-
-const theme = createTheme();
-const superuser = {
-  email: 'admin@example.com',
-  is_superuser: true,
-  ui_permissions: {},
-  available_roles: [],
-};
-const notificationsTab = {
-  value: 'notifications',
-  label: 'Notifications',
-  render: () => <div>Notifications content</div>,
-};
-
-function setViewportWidth(width) {
-  window.matchMedia = vi.fn().mockImplementation((query) => {
-    const maxWidth = query.match(/max-width:(\d+(?:\.\d+)?)px/)?.[1];
-    const minWidth = query.match(/min-width:(\d+(?:\.\d+)?)px/)?.[1];
-    const matches = maxWidth
-      ? width <= Number(maxWidth)
-      : minWidth
-        ? width >= Number(minWidth)
-        : false;
-    return {
-      matches,
-      media: query,
-      onchange: null,
-      addEventListener: vi.fn(),
-      removeEventListener: vi.fn(),
-      addListener: vi.fn(),
-      removeListener: vi.fn(),
-      dispatchEvent: vi.fn(),
-    };
-  });
-}
-
-function LocationProbe() {
-  const location = useLocation();
-  return <output data-testid="location-search">{location.search}</output>;
-}
-
-function renderAccount({ user = superuser, route = '/account', extraTabs = [notificationsTab] } = {}) {
-  return render(
-    <ThemeProvider theme={theme}>
-      <AuthContext.Provider value={{ user, login: vi.fn(), loading: false }}>
-        <MemoryRouter initialEntries={[route]}>
-          <Routes>
-            <Route
-              path="/account"
-              element={(
-                <>
-                  <AccountPage extraTabs={extraTabs} />
-                  <LocationProbe />
-                </>
-              )}
-            />
-          </Routes>
-        </MemoryRouter>
-      </AuthContext.Provider>
-    </ThemeProvider>,
-  );
-}
-
-describe('AccountPage section navigation', () => {
-  beforeEach(() => setViewportWidth(375));
-
-  afterEach(() => {
-    cleanup();
-    vi.restoreAllMocks();
-  });
-
-  it('makes all six cockpit-shaped sections reachable at 375px without a horizontal strip', () => {
-    const { container } = renderAccount();
-    const trigger = screen.getByRole('button', { name: /Section Profile/i });
-
-    expect(container.querySelector('.MuiTabs-root')).toBeNull();
-    expect(getComputedStyle(trigger).width).toBe('100%');
-    fireEvent.click(trigger);
-
-    const sectionButtons = ['Profile', 'Security', 'Users', 'Invite', 'Support', 'Notifications']
-      .map((label) => screen.getByRole('button', { name: label }));
-    expect(sectionButtons).toHaveLength(6);
-    sectionButtons.forEach((item) => {
-      expect(getComputedStyle(item).position).not.toBe('absolute');
-    });
-    expect(document.documentElement.scrollWidth - document.documentElement.clientWidth).toBe(0);
-  });
-
-  it('keeps the ?tab= contract and updates it when a drawer item is selected', () => {
-    renderAccount({ route: '/account?tab=notifications' });
-
-    expect(screen.getByText('Notifications content')).toBeTruthy();
-    const trigger = screen.getByRole('button', { name: /Section Notifications/i });
-    fireEvent.click(trigger);
-    fireEvent.click(screen.getByRole('button', { name: 'Security' }));
-
-    expect(screen.getByText('Security content')).toBeTruthy();
-    expect(screen.getByTestId('location-search').textContent).toBe('?tab=security');
-  });
-
-  it('keeps permission-gated sections absent and falls an unpermitted query back to profile', () => {
-    renderAccount({
-      user: {
-        email: 'person@example.com',
-        is_superuser: false,
-        ui_permissions: {},
-        available_roles: [],
-      },
-      route: '/account?tab=users',
-      extraTabs: [],
-    });
-
-    expect(screen.getByText('Profile content')).toBeTruthy();
-    const trigger = screen.getByRole('button', { name: /Section Profile/i });
-    fireEvent.click(trigger);
-    expect(screen.getByRole('button', { name: 'Profile' })).toBeTruthy();
-    expect(screen.getByRole('button', { name: 'Security' })).toBeTruthy();
-    expect(screen.queryByRole('button', { name: 'Users' })).toBeNull();
-    expect(screen.queryByRole('button', { name: 'Invite' })).toBeNull();
-    expect(screen.queryByRole('button', { name: 'Support' })).toBeNull();
-    expect(screen.queryByText('Management')).toBeNull();
-    expect(screen.queryByText('Help')).toBeNull();
-    expect(screen.queryByText('More')).toBeNull();
-  });
-
-  it('uses the desktop grouped grid at 1280px with no tab strip left behind', () => {
-    setViewportWidth(1280);
-    const { container } = renderAccount();
-    const grid = container.querySelector('[data-section-nav-mode="desktop"]');
-
-    expect(grid).toBeTruthy();
-    expect(getComputedStyle(grid).gridTemplateColumns).toBe('280px minmax(0, 1fr)');
-    expect(container.querySelector('.MuiTabs-root')).toBeNull();
-    expect(container.querySelector('nav')).toBeTruthy();
-  });
-});