@redacto.io/consent-sdk-react 10.0.0-beta.8 → 10.0.0-beta.9

package/src/RedactoPrivacyCenter/context/AuthContext.tsx

@@ -1,17 +1,74 @@
-import { createContext, useContext, useState, useEffect, useCallback, useMemo, type ReactNode } from 'react';
+import { createContext, useContext, useState, useEffect, useCallback, useMemo } from 'react';
 import { setRefreshTokenCookie, decodeJwtToken, resolveContactFromJwt, setSessionExpiredListener } from '../lib/utils';
-import type { AuthContextValue } from './types';
+import { setSandboxConfig } from '../lib/sandbox';
+import type {
+  AuthContextValue,
+  AuthProviderProps,
+  SeedSessionStorageData,
+} from './types';
 
 export type { AuthContextValue } from './types';
 
 const AuthContext = createContext<AuthContextValue | null>(null);
 
-interface AuthProviderProps {
-  children: ReactNode;
-  accessToken: string;
-  refreshToken: string;
-  onError: (error: Error) => boolean;
-}
+/**
+ * Raw sessionStorage writer for the five keys the Privacy Center reads
+ * (access_token / pc_org_id / pc_workspace_id / pc_org_slug / email). Single
+ * source of truth for those key names so the JWT and sandbox seeding paths can
+ * never drift. Each key is written only when its value is a non-empty string;
+ * `accessToken` is optional because the JWT path stores it separately. The
+ * `contact` value goes under the `email` key even when it is a mobile number
+ * (matching resolveContactFromJwt, which also stores mobile/org_user_id
+ * subjects there). No-ops when `window` is unavailable (SSR).
+ */
+const seedSessionStorage = (data: SeedSessionStorageData): void => {
+  if (typeof window === 'undefined') {
+    return;
+  }
+  if (data.accessToken) sessionStorage.setItem('access_token', data.accessToken);
+  if (data.orgId) sessionStorage.setItem('pc_org_id', data.orgId);
+  if (data.workspaceId) sessionStorage.setItem('pc_workspace_id', data.workspaceId);
+  if (data.slug) sessionStorage.setItem('pc_org_slug', data.slug);
+  if (data.contact) sessionStorage.setItem('email', data.contact);
+};
+
+/**
+ * Seed the sessionStorage keys the Privacy Center reads (org/workspace/slug/
+ * email/access_token) from the sandbox props and register the module-level
+ * sandbox config, so the fetch + auth layers switch to sandbox headers and skip
+ * token refresh. Returns true when sandbox mode was configured.
+ */
+const configureSandbox = (props: AuthProviderProps): boolean => {
+  const token = props.token?.trim();
+  if (!token) {
+    setSandboxConfig(null);
+    return false;
+  }
+
+  const organisationUuid = props.organisationUuid?.trim() ?? '';
+  const workspaceUuid = props.workspaceUuid?.trim() ?? '';
+  const ucic = props.sandboxUcic?.trim() ?? '';
+  const subject = props.sandboxSubject?.trim() ?? '';
+  const slug = props.slug?.trim() ?? '';
+
+  setSandboxConfig({
+    token,
+    ucic: ucic || undefined,
+    subject,
+    organisationUuid,
+    workspaceUuid,
+    slug,
+  });
+
+  seedSessionStorage({
+    accessToken: token,
+    orgId: organisationUuid,
+    workspaceId: workspaceUuid,
+    slug,
+    contact: ucic || subject,
+  });
+  return true;
+};
 
 /**
  * Extract and store organization/auth data from JWT token to sessionStorage
@@ -31,55 +88,68 @@ const syncJwtDataToSessionStorage = (accessToken: string): void => {
   const contact = resolveContactFromJwt(decoded)
     || sessionStorage.getItem('email')
     || (typeof localStorage !== 'undefined' ? localStorage.getItem('userEmail') : null);
-  if (contact && typeof contact === 'string') {
-    sessionStorage.setItem('email', contact);
-  }
 
-  // Extract organization UUID
-  const orgUuid = decoded.organisation_uuid;
-  if (orgUuid && typeof orgUuid === 'string') {
-    sessionStorage.setItem('pc_org_id', orgUuid);
-  }
-
-  // Extract workspace UUID
-  const workspaceUuid = decoded.workspace_uuid;
-  if (workspaceUuid && typeof workspaceUuid === 'string') {
-    sessionStorage.setItem('pc_workspace_id', workspaceUuid);
-  }
-
-  // Extract organization slug
-  const orgSlug = decoded.organisation_slug;
-  if (orgSlug && typeof orgSlug === 'string') {
-    sessionStorage.setItem('pc_org_slug', orgSlug);
-  }
+  // The access_token is stored separately by the caller (state initializer /
+  // updateTokens), so it is intentionally omitted here.
+  seedSessionStorage({
+    orgId: typeof decoded.organisation_uuid === 'string' ? decoded.organisation_uuid : undefined,
+    workspaceId: typeof decoded.workspace_uuid === 'string' ? decoded.workspace_uuid : undefined,
+    slug: typeof decoded.organisation_slug === 'string' ? decoded.organisation_slug : undefined,
+    contact: typeof contact === 'string' ? contact : undefined,
+  });
 };
 
-export const AuthProvider = ({
-  children,
-  accessToken: initialAccessToken,
-  refreshToken: initialRefreshToken,
-  onError,
-}: AuthProviderProps) => {
+export const AuthProvider = (props: AuthProviderProps) => {
+  const {
+    children,
+    accessToken: initialAccessToken,
+    refreshToken: initialRefreshToken,
+    token: sandboxToken,
+    sandboxUcic,
+    sandboxSubject,
+    organisationUuid,
+    workspaceUuid,
+    slug,
+    onError,
+  } = props;
+
+  // Sandbox PoC: configure the module singleton + seed sessionStorage BEFORE any
+  // child renders (same reason the JWT sync runs in the state initializer). This
+  // MUST run during render, not in a useEffect: child effects (which fire the
+  // first data fetch and read `sandboxAuthHeaders()` synchronously) run on commit
+  // BEFORE the parent's effects, so an effect here would configure the singleton
+  // too late. A useState lazy initializer runs once on the first render, ahead of
+  // any child, and is not re-run on subsequent parent re-renders — so it sets the
+  // config before the first fetch without the every-render side effect. When
+  // active, the JWT path below is skipped entirely.
+  const [sandboxActive] = useState(() => configureSandbox(props));
+
   // Sync to sessionStorage synchronously during initialization so child
   // components (ConsentManager, SideBarPC) find the data when they mount.
   // useEffect runs AFTER children render — too late for components that
   // read sessionStorage during their render phase.
   const [accessToken, setAccessToken] = useState(() => {
+    if (sandboxActive) {
+      return sandboxToken ?? '';
+    }
     if (initialAccessToken && typeof initialAccessToken === 'string' && initialAccessToken.trim() !== '') {
       if (typeof window !== 'undefined') {
         sessionStorage.setItem('access_token', initialAccessToken);
         syncJwtDataToSessionStorage(initialAccessToken);
       }
     }
-    return initialAccessToken;
+    return initialAccessToken ?? '';
   });
   const [refreshToken, setRefreshToken] = useState(() => {
+    if (sandboxActive) {
+      return '';
+    }
     if (initialRefreshToken && typeof initialRefreshToken === 'string' && initialRefreshToken.trim() !== '') {
       if (typeof window !== 'undefined') {
         setRefreshTokenCookie(initialRefreshToken);
       }
     }
-    return initialRefreshToken;
+    return initialRefreshToken ?? '';
   });
 
   // Terminal "session expired" flag. Set by utils' refresh routines (via the
@@ -97,8 +167,12 @@ export const AuthProvider = ({
     return () => setSessionExpiredListener(null);
   }, [markSessionExpired]);
 
-  // Re-sync when props change (for token refresh scenarios)
+  // Re-sync when props change (for token refresh scenarios). Sandbox mode has no
+  // JWT and no refresh, so these are no-ops there.
   useEffect(() => {
+    if (sandboxActive) {
+      return;
+    }
     if (initialAccessToken && typeof initialAccessToken === 'string' && initialAccessToken.trim() !== '') {
       setAccessToken(initialAccessToken);
       if (typeof window !== 'undefined') {
@@ -106,9 +180,12 @@ export const AuthProvider = ({
         syncJwtDataToSessionStorage(initialAccessToken);
       }
     }
-  }, [initialAccessToken]);
+  }, [initialAccessToken, sandboxActive]);
 
   useEffect(() => {
+    if (sandboxActive) {
+      return;
+    }
     if (initialRefreshToken && typeof initialRefreshToken === 'string' && initialRefreshToken.trim() !== '') {
       setRefreshToken(initialRefreshToken);
       // A fresh refresh token means the user re-authenticated — clear the
@@ -118,7 +195,22 @@ export const AuthProvider = ({
         setRefreshTokenCookie(initialRefreshToken);
       }
     }
-  }, [initialRefreshToken]);
+  }, [initialRefreshToken, sandboxActive]);
+
+  // Sandbox PoC: re-configure the module singleton when the sandbox inputs
+  // change after mount (the lazy initializer above only runs once, on first
+  // render — this mirrors the JWT re-sync effects for prop changes). Clears the
+  // singleton on unmount so a later JWT-mode mount never inherits a stale sandbox
+  // config. First-fetch ordering is unaffected: the initializer already set the
+  // config before any child effect ran.
+  useEffect(() => {
+    if (!sandboxActive) {
+      return;
+    }
+    configureSandbox(props);
+    return () => setSandboxConfig(null);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [sandboxActive, sandboxToken, sandboxUcic, sandboxSubject, organisationUuid, workspaceUuid, slug]);
 
   // Internal method to update tokens after refresh
   const updateTokens = useCallback((newAccessToken: string, newRefreshToken?: string) => {

package/src/RedactoPrivacyCenter/context/types.ts

@@ -1,5 +1,43 @@
+import type { ReactNode } from 'react';
 import type { createConsentClient } from '../api/client';
 
+export type AuthProviderProps = Readonly<{
+  children: ReactNode;
+  accessToken?: string;
+  refreshToken?: string;
+  /**
+   * Sandbox PoC: when set, the Privacy Center skips the JWT entirely — it seeds
+   * org/workspace/subject from the props below, sends the single
+   * `X-Consent-Token` header, carries the acting identity in each request's own
+   * payload, and never calls `/otp/refresh`.
+   */
+  token?: string;
+  /** Sandbox UCIC — the client's own user id (`org_user_id`); takes precedence over the subject. */
+  sandboxUcic?: string;
+  /** Sandbox subject (email or mobile) — carried in the request payload. */
+  sandboxSubject?: string;
+  /** Sandbox org UUID (replaces the JWT-decoded org). */
+  organisationUuid?: string;
+  /** Sandbox workspace UUID (replaces the JWT-decoded workspace). */
+  workspaceUuid?: string;
+  /** Organisation slug — used to seed sandbox sessionStorage. */
+  slug?: string;
+  onError: (error: Error) => boolean;
+}>;
+
+/**
+ * The five-key sessionStorage payload the Privacy Center seeds (access_token /
+ * pc_org_id / pc_workspace_id / pc_org_slug / email). `contact` lands under the
+ * `email` key even when it is a mobile/UCIC subject.
+ */
+export type SeedSessionStorageData = {
+  accessToken?: string;
+  orgId?: string;
+  workspaceId?: string;
+  slug?: string;
+  contact?: string;
+};
+
 export type AuthContextValue = Readonly<{
   accessToken: string;
   refreshToken: string;

package/src/RedactoPrivacyCenter/lib/constants.ts

@@ -197,13 +197,20 @@ export const LEGACY_REFRESH_TOKEN_COOKIE = 'refresh_token';
 
 // ─── DSAR request form ─────────────────────────────────────────────────────
 
-// Max product groups requested from the Go ledger's user-consents when
-// sourcing the DSAR request-form product picker (Approach A). The ledger caps
-// user-consents page size at 100; the picker needs all of a principal's
-// groups, so we request the max. A principal with >100 product groups would
-// need group-level pagination (follow-up).
+// Max product groups requested from user-consents when sourcing the DSAR
+// request-form product picker (Approach A). The Go ledger caps user-consents
+// page size at 100; the picker needs all of a principal's groups, so we
+// request the max. A principal with >100 product groups would need
+// group-level pagination (follow-up).
 export const FORM_PICKER_GROUP_LIMIT = 100;
 
+// Sentinel `product_uuid` of the synthetic product group the DSAR picker
+// builds from a backend's legacy flat `purposes` list (pre-grouping Python
+// deployments, and the popup / case-management contexts that cannot read
+// user-consents). It is a client-side construct with no server counterpart,
+// so a case raised from it must be submitted without a product anchor.
+export const LEGACY_PRODUCT_GROUP_UUID = '__legacy_flat_purposes__';
+
 // ─── Notification Hub ──────────────────────────────────────────────────────
 
 export const POLL_INTERVAL = 30_000;

package/src/RedactoPrivacyCenter/lib/sandbox.ts

@@ -0,0 +1,104 @@
+/**
+ * Sandbox-mode singleton for the Privacy Center consent PoC.
+ *
+ * The Privacy Center resolves org/workspace/subject from the JWT into
+ * sessionStorage and gates every fetch behind an OTP-refresh loop. Sandbox mode
+ * bypasses all of that: a pasted static token plus an explicit test subject and
+ * org/workspace. Because the Privacy Center is a single instance per page (the
+ * same assumption the OTP refresh circuit breaker in `utils.ts` already makes),
+ * the sandbox config lives in one module-level slot that `AuthProvider`
+ * configures on mount and the fetch/auth layers read.
+ *
+ * When configured:
+ *   - `syncJwtDataToSessionStorage` seeds sessionStorage from these fields
+ *     instead of decoding the JWT,
+ *   - `ensureValidToken` / `checkAndRefreshAuth` return the static token without
+ *     ever calling `/otp/refresh`,
+ *   - `privacyCenterApiFetch` sends the single `X-Consent-Token` header instead
+ *     of `Authorization: Bearer` (its presence marks the request as
+ *     `environment=test`). There is no subject header — the acting identity
+ *     travels in the request's own payload: query params (`primary_email` /
+ *     `primary_mobile`) on GET/query reads, and the body on POSTs. See
+ *     `sandboxAuthHeaders` / `sandboxQueryIdentity` / `sandboxBodyIdentity` /
+ *     `sandboxContact`.
+ */
+
+import { SANDBOX_TOKEN_HEADER } from '../../shared/sandbox';
+import type { SandboxConfig, SandboxIdentityPayload } from './types';
+
+export { SANDBOX_TOKEN_HEADER };
+export type { SandboxConfig };
+
+let sandboxConfig: SandboxConfig | null = null;
+
+/**
+ * Set (or clear, with `null`) the active sandbox configuration. Called by
+ * `AuthProvider` when the sandbox token prop is present. Idempotent.
+ */
+export const setSandboxConfig = (config: SandboxConfig | null): void => {
+  sandboxConfig = config;
+};
+
+/** The active sandbox config, or null when sandbox mode is off. */
+export const getSandboxConfig = (): SandboxConfig | null => sandboxConfig;
+
+/** True when the Privacy Center is running in sandbox mode. */
+export const isSandboxMode = (): boolean => sandboxConfig !== null;
+
+/**
+ * Auth headers for a Privacy Center request in sandbox mode, or null when
+ * sandbox mode is off (so the caller falls back to `Authorization: Bearer`).
+ * Only the `X-Consent-Token` credential is sent; its presence marks the request
+ * as `environment=test`. There is no subject header — the acting identity
+ * travels in the request's own payload: query params on GET/query reads (see
+ * {@link sandboxQueryIdentity}) and the body on POSTs (see
+ * {@link sandboxBodyIdentity} / {@link sandboxContact}).
+ */
+export const sandboxAuthHeaders = (): Record<string, string> | null => {
+  if (!sandboxConfig) {
+    return null;
+  }
+  return {
+    [SANDBOX_TOKEN_HEADER]: sandboxConfig.token,
+  };
+};
+
+/**
+ * The identity payload fragment for the active sandbox acting principal:
+ * `{ org_user_id }` when a UCIC is set (it takes precedence), else
+ * `{ primary_email }` when the subject looks like an email (contains "@"),
+ * otherwise `{ primary_mobile }`. Null when sandbox mode is off. Merge this into
+ * a JSON request body (POST) so the server can resolve the acting test identity.
+ */
+export const sandboxBodyIdentity = (): SandboxIdentityPayload | null => {
+  if (!sandboxConfig) {
+    return null;
+  }
+  if (sandboxConfig.ucic) {
+    return { org_user_id: sandboxConfig.ucic };
+  }
+  return sandboxConfig.subject.includes('@')
+    ? { primary_email: sandboxConfig.subject }
+    : { primary_mobile: sandboxConfig.subject };
+};
+
+/**
+ * The identity query fragment for the active sandbox acting principal:
+ * `{ org_user_id }` when a UCIC is set (it takes precedence), else
+ * `{ primary_email }` when the subject looks like an email (contains "@"),
+ * otherwise `{ primary_mobile }`. Null when sandbox mode is off. Append these to
+ * a GET/query request's query string so the server can resolve the acting test
+ * identity (it reads `org_user_id` / `primary_email` / `primary_mobile` query
+ * params on sandbox reads).
+ */
+export const sandboxQueryIdentity = (): SandboxIdentityPayload | null =>
+  sandboxBodyIdentity();
+
+/**
+ * The raw sandbox contact string, for endpoints whose server field is a single
+ * `contact` (the server classifies it as email/phone/UCIC) — create-case,
+ * manage-consent. Prefers the UCIC over the email/mobile subject. Null when
+ * sandbox mode is off.
+ */
+export const sandboxContact = (): string | null =>
+  sandboxConfig ? sandboxConfig.ucic || sandboxConfig.subject : null;

package/src/RedactoPrivacyCenter/lib/types.ts

@@ -1,3 +1,19 @@
+export type SandboxConfig = Readonly<{
+  token: string;
+  /** UCIC — the client's own user id (`org_user_id`). Takes precedence over `subject`. */
+  ucic?: string;
+  subject: string;
+  organisationUuid: string;
+  workspaceUuid: string;
+  slug: string;
+}>;
+
+/** The identity payload fragment for the sandbox acting principal. */
+export type SandboxIdentityPayload =
+  | { org_user_id: string }
+  | { primary_email: string }
+  | { primary_mobile: string };
+
 export type Workspace = {
   uuid: string;
   suid: string;
@@ -248,6 +264,10 @@ export type NominatorInfo = {
 
 export type PurposeItem = {
   purpose_uuid: string;
+  // Alias emitted by the legacy Python user-consents payload, which keys some
+  // purposes as `uuid` instead of `purpose_uuid`. Optional: the Go ledger
+  // always sends `purpose_uuid`.
+  uuid?: string;
   name: string;
   description: string | null;
   status: ConsentStatusEnum | string;

package/src/RedactoPrivacyCenter/lib/utils.ts

@@ -1,5 +1,6 @@
 import { refreshOtpTokenServer } from './api';
 import { isTerminalRefreshError } from '../api/fetcher';
+import { getSandboxConfig } from './sandbox';
 import {
   MIN_REFRESH_BACKOFF_MS,
   MAX_REFRESH_BACKOFF_MS,
@@ -373,6 +374,12 @@ export const checkAndRefreshAuth = async (
 ): Promise<boolean> => {
   if (typeof window === 'undefined') return false;
 
+  // Sandbox PoC: the static token is always "valid" and there is nothing to
+  // refresh, so authentication is satisfied unconditionally.
+  if (getSandboxConfig()) {
+    return true;
+  }
+
   const accessToken = sessionStorage.getItem('access_token');
   const email = sessionStorage.getItem('email');
   const orgSlug = sessionStorage.getItem('pc_org_slug');
@@ -555,6 +562,14 @@ export const ensureValidToken = async (
 ): Promise<string | null> => {
   if (typeof window === 'undefined') return null;
 
+  // Sandbox PoC: no JWT, no expiry, no refresh — hand back the static token so
+  // callers proceed straight to the request (which carries the X-Consent-Token
+  // header instead of Authorization, and the acting identity in its payload).
+  const sandbox = getSandboxConfig();
+  if (sandbox) {
+    return sandbox.token;
+  }
+
   // Use context accessToken if provided, otherwise fall back to sessionStorage
   const accessToken = authContext?.accessToken || sessionStorage.getItem('access_token');
 

package/src/shared/sandbox.ts

@@ -0,0 +1,6 @@
+/**
+ * HTTP header carrying the static sandbox token (the credential). Its presence
+ * marks a request as `environment=test`. Shared by the Notice-consent and
+ * Privacy-Center sandbox paths so the header name is defined once.
+ */
+export const SANDBOX_TOKEN_HEADER = "X-Consent-Token";

package/tests/Form.test.tsx

@@ -524,12 +524,14 @@ describe('Form (P2-SDK-3)', () => {
     expect(submitButton.disabled).toBe(true);
   });
 
-  it('skips the ledger picker overlay when no ledgerBaseUrl is configured', async () => {
-    // Without a ledger, consents still live in Python and the form/data
-    // groups are authoritative — the overlay must not fire a user-consents
-    // read (it would hit the legacy endpoint and mis-map its shape).
+  it('runs the picker overlay against the legacy endpoint when no ledgerBaseUrl is configured', async () => {
+    // `getUserConsents` serves the same grouped payload from either backend
+    // (ledger `/public/...` or Python `/dsar/privacy-center/...`), so the
+    // overlay must run in both modes — Python's form/data no longer emits
+    // product groups, and skipping the read leaves the picker empty.
     baseUrlStub.ledgerBaseUrl = undefined;
     setupSession();
+    fetchUserConsents.mockResolvedValue(null);
     getFormData.mockResolvedValue(
       makeFormData({
         direct_groups: [
@@ -545,12 +547,12 @@ describe('Form (P2-SDK-3)', () => {
 
     render(<Form onCreateRequest={vi.fn()} />);
     await waitFor(() => expect(getFormData).toHaveBeenCalled());
+    await waitFor(() => expect(fetchUserConsents).toHaveBeenCalled());
 
     pickRequestType(RequestTypeEnum.ERASURE);
     await waitFor(() => {
       expect(screen.getByText('Acme Loyalty')).toBeInTheDocument();
     });
-    expect(fetchUserConsents).not.toHaveBeenCalled();
   });
 
   it('runs the ledger picker overlay when ledgerBaseUrl is configured', async () => {
@@ -565,6 +567,141 @@ describe('Form (P2-SDK-3)', () => {
     await waitFor(() => expect(fetchUserConsents).toHaveBeenCalled());
   });
 
+  it('keeps the form/data groups when user-consents comes back with no groups', async () => {
+    // A successful-but-empty read must never overwrite groups form/data did
+    // supply — that turned a populated picker into "No products available".
+    setupSession();
+    fetchUserConsents.mockResolvedValue({ direct: [], nominated: [] });
+    getFormData.mockResolvedValue(
+      makeFormData({
+        direct_groups: [
+          makeGroup(),
+          makeGroup({
+            product_uuid: 'prod-direct-2',
+            product_name: 'Acme Rewards',
+            purposes: [basePurpose('purp-2', 'Analytics')],
+          }),
+        ],
+      }),
+    );
+
+    render(<Form onCreateRequest={vi.fn()} />);
+    await waitFor(() => expect(fetchUserConsents).toHaveBeenCalled());
+
+    pickRequestType(RequestTypeEnum.ERASURE);
+    await waitFor(() => {
+      expect(screen.getByText('Acme Loyalty')).toBeInTheDocument();
+    });
+    expect(screen.getByText('Acme Rewards')).toBeInTheDocument();
+    expect(screen.queryByText('No products available')).not.toBeInTheDocument();
+  });
+
+  it('falls back to the legacy flat purposes list when the backend exposes no product groups', async () => {
+    // Pre-grouping backends return purposes without any product grouping.
+    // Those consents must stay reachable under one synthetic group instead
+    // of the picker claiming the principal has none.
+    setupSession();
+    fetchUserConsents.mockResolvedValue(null);
+    getFormData.mockResolvedValue(
+      makeFormData({
+        direct_groups: [],
+        nominated_groups: [],
+        purposes: [{ purpose: basePurpose('purp-flat', 'Marketing') }],
+      }),
+    );
+
+    render(<Form onCreateRequest={vi.fn()} />);
+    await waitFor(() => expect(getFormData).toHaveBeenCalled());
+
+    pickRequestType(RequestTypeEnum.ACCESS);
+
+    await waitFor(() => {
+      expect(screen.getByText('Your data')).toBeInTheDocument();
+    });
+    expect(screen.getByText('Marketing')).toBeInTheDocument();
+    expect(screen.queryByText('No products available')).not.toBeInTheDocument();
+  });
+
+  it('keeps the empty state when the flat purposes carry no data elements', async () => {
+    // Nothing selectable survives `buildGroupPurposes`, so the synthetic group
+    // would render an unusable panel — the empty state is the honest answer.
+    setupSession();
+    fetchUserConsents.mockResolvedValue(null);
+    getFormData.mockResolvedValue(
+      makeFormData({
+        direct_groups: [],
+        nominated_groups: [],
+        purposes: [{ purpose: basePurpose('purp-flat', 'Marketing', []) }],
+      }),
+    );
+
+    render(<Form onCreateRequest={vi.fn()} />);
+    await waitFor(() => expect(getFormData).toHaveBeenCalled());
+
+    pickRequestType(RequestTypeEnum.ACCESS);
+
+    await waitFor(() => {
+      expect(screen.getByText('No products available')).toBeInTheDocument();
+    });
+    expect(screen.queryByText('Your data')).not.toBeInTheDocument();
+  });
+
+  it('submits the legacy flat fallback as an org-level case without a product anchor', async () => {
+    // The synthetic group has no server-side product, so the case must go up
+    // in the pre-grouping org-level shape rather than carrying a made-up
+    // `product_uuid` the backend cannot resolve.
+    setupSession();
+    fetchUserConsents.mockResolvedValue(null);
+    getFormData.mockResolvedValue(
+      makeFormData({
+        direct_groups: [],
+        nominated_groups: [],
+        purposes: [{ purpose: basePurpose('purp-flat', 'Marketing') }],
+      }),
+    );
+    createCaseRequest.mockResolvedValueOnce({
+      case_id: 'CASE-FLAT',
+      uuid: 'uuid-flat',
+    });
+
+    render(<Form onCreateRequest={vi.fn()} />);
+    await waitFor(() => expect(getFormData).toHaveBeenCalled());
+
+    pickRequestType(RequestTypeEnum.ACCESS);
+
+    await waitFor(() => {
+      expect(screen.getByText('Marketing')).toBeInTheDocument();
+    });
+
+    const marketingCheckbox = screen
+      .getByText('Marketing')
+      .closest('label')
+      ?.querySelector('input[type="checkbox"]') as HTMLInputElement | null;
+    expect(marketingCheckbox).toBeTruthy();
+    fireEvent.click(marketingCheckbox!);
+
+    const confirmCheckbox = (
+      screen.getAllByRole('checkbox') as HTMLInputElement[]
+    ).find((c) => c.closest('label')?.textContent?.includes('I confirm'));
+    expect(confirmCheckbox).toBeTruthy();
+    fireEvent.click(confirmCheckbox!);
+
+    const submitButton = screen.getByRole('button', { name: /^submit$/i });
+    expect(submitButton).not.toBeDisabled();
+    await act(async () => {
+      fireEvent.click(submitButton);
+    });
+
+    await waitFor(() => expect(createCaseRequest).toHaveBeenCalledTimes(1));
+
+    const payload = createCaseRequest.mock.calls[0][2];
+    expect('product_uuid' in payload).toBe(false);
+    expect('data_principal_uuid' in payload).toBe(false);
+    expect(payload.request_details.purposes).toEqual([
+      { purpose_uuid: 'purp-flat', data_element_uuids: ['purp-flat-de1'] },
+    ]);
+  });
+
   it('renders the product step for DSAR types when direct_groups is present', async () => {
     setupSession();
     const direct = makeGroup({