@redacto.io/consent-sdk-react 10.0.0-beta.3 → 10.0.0-beta.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redacto.io/consent-sdk-react",
-  "version": "10.0.0-beta.3",
+  "version": "10.0.0-beta.5",
   "main": "dist/index.cjs",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",

package/src/RedactoNoticeAssisted/RedactoNoticeAssisted.test.tsx

@@ -18,6 +18,7 @@ import {
 } from "./api";
 import type { ConsentContent, TTSAudioUrlsResponse } from "./api/types";
 import { ApiError } from "../shared/api-errors";
+import { fetchNoticeConsentStatusForScope } from "../shared/notice-consent-status";
 import { makeStaticT } from "./i18n";
 
 vi.mock("./api", () => ({
@@ -28,12 +29,26 @@ vi.mock("./api", () => ({
   submitAssistedConsent: vi.fn(),
 }));
 
+// Mock only the ledger check-consent network read; keep the real
+// isNoticeFullyConsented predicate so the already-consented decision is exercised.
+vi.mock("../shared/notice-consent-status", async (importActual) => {
+  const actual =
+    await importActual<typeof import("../shared/notice-consent-status")>();
+  return {
+    ...actual,
+    fetchNoticeConsentStatusForScope: vi.fn(),
+  };
+});
+
+const LEDGER_BASE_URL = "https://ledger.example.test/consent-ledger";
+
 const otpLength = ASSISTED_CONFIG.otpLength;
 const mockedFetch = vi.mocked(fetchAssistedNotice);
 const mockedFetchTTS = vi.mocked(fetchAssistedTTSAudioUrls);
 const mockedCreateOtp = vi.mocked(createOtp);
 const mockedVerifyOtp = vi.mocked(verifyOtp);
 const mockedSubmitConsent = vi.mocked(submitAssistedConsent);
+const mockedFetchScope = vi.mocked(fetchNoticeConsentStatusForScope);
 
 const OTP_DETAIL = {
   uuid: "otp-1",
@@ -226,6 +241,9 @@ describe("RedactoNoticeAssisted", () => {
     mockedCreateOtp.mockResolvedValue(OTP_DETAIL);
     mockedVerifyOtp.mockResolvedValue(VERIFY_DETAIL);
     mockedSubmitConsent.mockResolvedValue(null);
+    // Default: ledger reports no prior full consent, so flows proceed to submit.
+    mockedFetchScope.mockReset();
+    mockedFetchScope.mockResolvedValue(null);
   });
 
   it("fetches with the public-notice props (no auth)", async () => {
@@ -604,6 +622,75 @@ describe("RedactoNoticeAssisted", () => {
     ).not.toBeInTheDocument();
   });
 
+  // ── Go ledger (ledgerBaseUrl) ─────────────────────────────────────────────
+  // Drives the full notice → OTP → Confirm flow with a notice that carries a
+  // notice_uuid (so the check-consent read runs), and returns the onComplete spy.
+  const runConfirmFlow = async (extraProps: Record<string, unknown>) => {
+    mockedFetch.mockResolvedValue(NOTICE_WITH_AUDIO);
+    const onComplete = vi.fn();
+    render(
+      <RedactoNoticeAssisted {...PROPS} onComplete={onComplete} {...extraProps} />,
+    );
+    await screen.findByRole("heading", { name: "EA Sports" });
+    selectRequired();
+    fireEvent.click(screen.getByRole("button", { name: "Agree" }));
+    fireEvent.change(screen.getByLabelText("Mobile number"), {
+      target: { value: "9876543210" },
+    });
+    fireEvent.click(screen.getByRole("button", { name: "Send OTP" }));
+    await screen.findByText(/OTP sent to/);
+    typeOtp("1".repeat(otpLength));
+    fireEvent.click(screen.getByRole("button", { name: "Confirm OTP" }));
+    return onComplete;
+  };
+
+  it("routes the write through ledgerBaseUrl and submits when not already consented", async () => {
+    const onComplete = await runConfirmFlow({ ledgerBaseUrl: LEDGER_BASE_URL });
+
+    await waitFor(() => expect(mockedSubmitConsent).toHaveBeenCalledTimes(1));
+    // The check-consent read runs with props org/workspace + the OTP token.
+    expect(mockedFetchScope).toHaveBeenCalledWith(
+      expect.objectContaining({
+        accessToken: "access-token-1",
+        ledgerBaseUrl: LEDGER_BASE_URL,
+        organisationUuid: "org-1",
+        workspaceUuid: "ws-1",
+        noticeUuid: "ntc-1",
+      }),
+    );
+    // The submit carries ledgerBaseUrl so the api layer routes it to the ledger.
+    expect(mockedSubmitConsent).toHaveBeenCalledWith(
+      expect.objectContaining({ ledgerBaseUrl: LEDGER_BASE_URL }),
+    );
+    await waitFor(() => expect(onComplete).toHaveBeenCalledTimes(1));
+  });
+
+  it("short-circuits an already fully-consented principal via the ledger (no submit)", async () => {
+    mockedFetchScope.mockResolvedValue({
+      consented: true,
+      all_mandatory_active: true,
+      purposes: [],
+    });
+    const onComplete = await runConfirmFlow({ ledgerBaseUrl: LEDGER_BASE_URL });
+
+    await waitFor(() => expect(onComplete).toHaveBeenCalledTimes(1));
+    expect(mockedSubmitConsent).not.toHaveBeenCalled();
+  });
+
+  it("skips the ledger check-consent and stays on baseUrl when ledgerBaseUrl is absent", async () => {
+    const onComplete = await runConfirmFlow({});
+
+    await waitFor(() => expect(mockedSubmitConsent).toHaveBeenCalledTimes(1));
+    expect(mockedFetchScope).not.toHaveBeenCalled();
+    expect(mockedSubmitConsent).toHaveBeenCalledWith(
+      expect.objectContaining({
+        ledgerBaseUrl: undefined,
+        baseUrl: "https://api.example.test/consent",
+      }),
+    );
+    await waitFor(() => expect(onComplete).toHaveBeenCalledTimes(1));
+  });
+
   // The verify endpoint returns English copy with no error_code, so the SDK
   // localizes by HTTP status + the `should_request_new` flag instead of echoing
   // the server message.

package/src/RedactoNoticeAssisted/RedactoNoticeAssisted.tsx

@@ -23,6 +23,10 @@ import type {
   TTSAudioUrlsResponse,
 } from "./api/types";
 import { ApiError } from "../shared/api-errors";
+import {
+  fetchNoticeConsentStatusForScope,
+  isNoticeFullyConsented,
+} from "../shared/notice-consent-status";
 import {
   toNativeLabel,
   toBcp47Code,
@@ -251,6 +255,7 @@ export const RedactoNoticeAssisted = ({
   workspaceUuid,
   noticeUuid,
   baseUrl,
+  ledgerBaseUrl,
   onDecline,
   onComplete,
 }: RedactoNoticeAssistedProps) => {
@@ -1207,6 +1212,26 @@ export const RedactoNoticeAssisted = ({
       }
       const token = verifyDetail.access_token;
 
+      // Post-cutover, consent records live in the Go ledger, so Python's 409
+      // CONSENT_ALREADY_PROVIDED can no longer be relied on. When a ledger is
+      // configured, ask it directly (org/workspace from props, OTP token as
+      // bearer) whether this principal has already fully consented and, if so,
+      // hand off without writing a duplicate consent event. Any failure returns
+      // null and falls through to the normal submit (graceful degradation).
+      if (ledgerBaseUrl) {
+        const ledgerStatus = await fetchNoticeConsentStatusForScope({
+          accessToken: token,
+          ledgerBaseUrl,
+          organisationUuid,
+          workspaceUuid,
+          noticeUuid: content.notice_uuid,
+        });
+        if (ledgerStatus && isNoticeFullyConsented(ledgerStatus)) {
+          handleSuccess();
+          return;
+        }
+      }
+
       // Map current selection onto the submit payload shape (required → selected).
       const submitPurposes = content.purposes.map((purpose) => ({
         ...purpose,
@@ -1224,6 +1249,7 @@ export const RedactoNoticeAssisted = ({
         organisationUuid,
         workspaceUuid,
         baseUrl,
+        ledgerBaseUrl,
         noticeUuid: content.notice_uuid,
         purposes: submitPurposes,
         language: toBcp47Code(selectedLanguage),
@@ -1255,6 +1281,7 @@ export const RedactoNoticeAssisted = ({
     otpUuid,
     otpValue,
     baseUrl,
+    ledgerBaseUrl,
     selectedPurposes,
     selectedDataElements,
     selectedLanguage,

package/src/RedactoNoticeAssisted/api/index.ts

@@ -160,6 +160,7 @@ export const submitAssistedConsent = async ({
   organisationUuid,
   workspaceUuid,
   baseUrl,
+  ledgerBaseUrl,
   noticeUuid,
   purposes,
   language,
@@ -196,7 +197,12 @@ export const submitAssistedConsent = async ({
     language: language || undefined,
   };
 
-  const url = `${publicScope(baseUrl, organisationUuid, workspaceUuid)}/submit-consent`;
+  // Route the write to the Go ledger when configured, else the legacy consent
+  // server. publicScope already applies `|| BASE_URL`, so this yields the
+  // standard `ledgerBaseUrl || baseUrl || BASE_URL` fallback used by the other
+  // notice components. Only submit-consent routes to the ledger; notice/OTP/TTS
+  // stay on baseUrl.
+  const url = `${publicScope(ledgerBaseUrl || baseUrl, organisationUuid, workspaceUuid)}/submit-consent`;
 
   const response = await fetch(url, {
     method: "POST",

package/src/RedactoNoticeAssisted/api/types.ts

@@ -94,6 +94,8 @@ export type SubmitAssistedConsentParams = {
   organisationUuid: string;
   workspaceUuid: string;
   baseUrl?: string;
+  /** Go ledger base URL — routes the write to the ledger; omit to use the legacy consent server. */
+  ledgerBaseUrl?: string;
   /** `notice_uuid` from the fetched active_config. */
   noticeUuid: string;
   /** Purposes carrying their current `selected` state + data elements. */

package/src/RedactoNoticeAssisted/i18n.ts

@@ -1248,60 +1248,6 @@ const as: StaticStrings = {
   close: "বন্ধ কৰক",
 };
 
-const bho: StaticStrings = {
-  useEmailInstead: "ईमेल इस्तेमाल करीं",
-  useMobileInstead: "मोबाइल इस्तेमाल करीं",
-  emailAddress: "ईमेल पता",
-  otpHelperEmail: "हमनी एह ईमेल पर एक बेर इस्तेमाल होखे वाला पासवर्ड भेजब।",
-  changeEmail: "ईमेल बदलीं",
-  expandDetails: "{name} के विवरण फैलाईं",
-  collapseDetails: "{name} के विवरण समेटीं",
-  selectAllFor: "{name} खातिर सभ डेटा तत्व चुनीं",
-  selectElement: "{name} चुनीं",
-  selectElementRequired: "{name} चुनीं (जरूरी)",
-  required: "जरूरी",
-  logoAlt: "लोगो",
-  selectLanguage: "भाषा चुनीं",
-  selectLanguageCurrent: "भाषा चुनीं. मौजूदा भाषा: {lang}",
-  opensInNewTab: "नया टैब में खुलेला",
-  audioStart: "ऑडियो प्लेबैक शुरू करीं",
-  audioPause: "ऑडियो प्लेबैक रोकीं",
-  talkbackStart: "टॉकबैक शुरू करीं",
-  talkbackPause: "टॉकबैक रोकीं",
-  mobileNumber: "मोबाइल नंबर",
-  otpHelper: "हमनी एह नंबर पर एक बेर इस्तेमाल होखे वाला पासवर्ड भेजब।",
-  otpSentTo: "ओटीपी (OTP) भेजल गइल",
-  changeMobile: "मोबाइल नंबर बदलीं",
-  enterNDigitOtp: "{count}-अंक के ओटीपी (OTP) डालीं",
-  otpDigit: "ओटीपी (OTP) अंक {index}",
-  resendIn: "{seconds} सेकंड में ओटीपी (OTP) फेर से भेजीं",
-  sending: "भेजल जा रहल बा…",
-  resendOtp: "ओटीपी (OTP) फेर से भेजीं",
-  getOtp: "ओटीपी (OTP) पाईं",
-  verifying: "सत्यापित कइल जा रहल बा…",
-  verifyOtp: "ओटीपी (OTP) सत्यापित करीं",
-  sendOtp: "ओटीपी (OTP) भेजीं",
-  confirmOtp: "ओटीपी (OTP) के पुष्टि करीं",
-  verifyWithOtp: "ओटीपी (OTP) से सत्यापित करीं",
-  editSelections: "चुनाव में बदलाव करीं",
-  otpIncorrect:
-    "रउरा डालल सत्यापन कोड गलत बा। कृपया जाँच करीं आ फेर से कोशिश करीं।",
-  otpExpired: "रउरा सत्यापन कोड के मियाद खतम हो गइल बा। कृपया नया कोड मांगीं।",
-  otpNotFound: "सत्यापन कोड ना मिलल। कृपया नया कोड मांगीं।",
-  otpVerifyFailed: "ओटीपी (OTP) के सत्यापन ना हो सकल। कृपया फेर से कोशिश करीं।",
-  otpSendFailed: "ओटीपी (OTP) ना भेजल जा सकल। कृपया फेर से कोशिश करीं।",
-  consentConfirmed: "सहमति के पुष्टि भइल",
-  recordedUnder: "ओटीपी (OTP) सत्यापित · {regulation} के तहत दर्ज भइल",
-  recordedUnderAt:
-    "ओटीपी (OTP) सत्यापित · {regulation} के तहत {time} बजे दर्ज भइल",
-  consentReferenceId: "सहमति संदर्भ आईडी",
-  proceed: "आगे बढ़ीं",
-  loadingNotice: "नोटिस लोड हो रहल बा",
-  loadFailedTitle: "सहमति नोटिस लोड ना हो सकल",
-  tryAgain: "कृपया फेर से कोसिस करीं।",
-  close: "बंद करीं",
-};
-
 const brx: StaticStrings = {
   useEmailInstead: "इमेल बाहाय",
   useMobileInstead: "मबाइल बाहाय",
@@ -1435,7 +1381,6 @@ export const STATIC_STRINGS: Record<string, StaticStrings> = {
   te,
   ur,
   as,
-  bho,
   brx,
   doi,
 };

package/src/RedactoNoticeAssisted/types.ts

@@ -17,6 +17,8 @@ export type RedactoNoticeAssistedProps = {
   noticeUuid: string;
   /** API base URL (defaults to the production consent API). */
   baseUrl?: string;
+  /** Go ledger base URL — routes the consent write to the ledger; omit to use the legacy consent server. */
+  ledgerBaseUrl?: string;
   /** Called when the agent/customer declines (host should unmount the modal). */
   onDecline?: () => void;
   /** Called when the agent clicks "Proceed" on the confirmed screen. */

package/src/RedactoNoticeConsent/api/index.ts

@@ -5,7 +5,6 @@ import type {
   ConsentEventPayload,
   DataElementSelection,
   FetchConsentContentParams,
-  FetchNoticeConsentStatusParams,
   FetchTTSAudioUrlsParams,
   InitiateGuardianVerificationParams,
   InitiateGuardianVerificationResponse,
@@ -18,6 +17,11 @@ import type {
   VerifyGuardianStatusResponse,
 } from "./types";
 
+// The ledger `check-consent` read is shared with RedactoNoticeConsentInline.
+// Re-exported through this barrel so `./api` importers (and the test mock)
+// resolve it here unchanged.
+export { fetchNoticeConsentStatus } from "../../shared/notice-consent-status";
+
 const BASE_URL = "https://api.redacto.io/consent";
 
 // Simple in-memory cache for API responses to reduce calls
@@ -216,71 +220,6 @@ export const submitConsentEvent = async ({
   apiCache.clear();
 };
 
-/**
- * Fetch the principal's current consent status for a notice from the Go
- * ledger (`check-consent`). The principal resolves from the JWT, so the body
- * is empty. Returns null on any failure so the caller can fall back to the
- * Python-provided overlay (graceful degradation). This is how the banner
- * learns prior-consent / reconsent state post-cutover, since Python's notice
- * validation reads its own (now-empty) consent DB.
- */
-export const fetchNoticeConsentStatus = async ({
-  accessToken,
-  ledgerBaseUrl,
-  noticeUuid,
-  signal,
-}: FetchNoticeConsentStatusParams): Promise<NoticeConsentStatusResponse | null> => {
-  if (!accessToken || !ledgerBaseUrl || !noticeUuid) {
-    return null;
-  }
-
-  const decodedToken = decodeTokenSafely(accessToken);
-  if (!decodedToken) {
-    return null;
-  }
-
-  const { organisation_uuid: ORGANISATION_UUID, workspace_uuid: WORKSPACE_UUID } = decodedToken;
-  if (!ORGANISATION_UUID || !WORKSPACE_UUID) {
-    return null;
-  }
-
-  try {
-    const response = await fetch(
-      `${ledgerBaseUrl}/public/organisations/${ORGANISATION_UUID}/workspaces/${WORKSPACE_UUID}/notices/${noticeUuid}/check-consent`,
-      {
-        method: "POST",
-        headers: {
-          Authorization: `Bearer ${accessToken}`,
-          "Content-Type": "application/json",
-        },
-        body: "{}",
-        signal,
-      }
-    );
-
-    if (!response.ok) {
-      return null;
-    }
-
-    const data = (await response.json()) as
-      | NoticeConsentStatusResponse
-      | { detail?: NoticeConsentStatusResponse };
-    // The ledger returns the response directly; tolerate a {detail} envelope too.
-    const body =
-      data && typeof data === "object" && "detail" in data && data.detail
-        ? data.detail
-        : (data as NoticeConsentStatusResponse);
-
-    if (!body || !Array.isArray(body.purposes)) {
-      return null;
-    }
-    return body;
-  } catch {
-    // Network / abort / parse failure — degrade to the Python overlay.
-    return null;
-  }
-};
-
 /**
  * Translate the ledger's notice consent status into the
  * `{ purpose_selections, reconsent_required }` shape the banner already

package/src/RedactoNoticeConsent/api/types.ts

@@ -20,36 +20,15 @@ export type DataElementSelection = {
 };
 
 // ─── Ledger notice check-consent ────────────────────────────────────────────
-// Mirrors the Go ledger's `NoticeConsentStatusResponse`. Used to overlay the
-// banner's prior-consent / reconsent state from the ledger, since Python's
-// notice-validation overlay is empty after the consent cutover.
-export type NoticeConsentStatusDataElement = {
-  uuid: string;
-  name: string;
-  selected: boolean;
-};
-
-export type NoticeConsentStatusPurpose = {
-  uuid: string;
-  name: string;
-  selected: boolean;
-  status: string; // ACTIVE | EXPIRED | WITHDRAW | DECLINED | INACTIVE
-  expiry_datetime?: string | null;
-  data_elements: NoticeConsentStatusDataElement[];
-};
-
-export type NoticeConsentStatusResponse = {
-  consented: boolean;
-  all_mandatory_active: boolean;
-  purposes: NoticeConsentStatusPurpose[];
-};
-
-export type FetchNoticeConsentStatusParams = {
-  accessToken: string;
-  ledgerBaseUrl?: string;
-  noticeUuid: string;
-  signal?: AbortSignal;
-};
+// These types moved to the shared module so the banner and the inline widget
+// consume one definition; re-exported here so existing `./types` importers
+// keep working unchanged.
+export type {
+  FetchNoticeConsentStatusParams,
+  NoticeConsentStatusDataElement,
+  NoticeConsentStatusPurpose,
+  NoticeConsentStatusResponse,
+} from "../../shared/notice-consent-status";
 
 export type ConsentContent = {
   code: number;

package/src/RedactoNoticeConsent/language-codes.ts

@@ -6,7 +6,6 @@ export const LANGUAGE_NATIVE_LABELS: Record<string, string> = {
   English: "English",
   Assamese: "অসমীয়া (Assamese)",
   Bengali: "বাংলা (Bengali)",
-  Bhojpuri: "भोजपुरी (Bhojpuri)",
   Bodo: "बड़ो (Bodo)",
   Dogri: "डोगरी (Dogri)",
   Gujarati: "ગુજરાતી (Gujarati)",
@@ -44,7 +43,6 @@ const LANGUAGE_NAME_TO_BCP47: Record<string, string> = {
   English: "en",
   Assamese: "as",
   Bengali: "bn",
-  Bhojpuri: "bho",
   Bodo: "brx",
   Dogri: "doi",
   Gujarati: "gu",

package/src/RedactoNoticeConsentInline/RedactoNoticeConsentInline.tsx

@@ -1,5 +1,9 @@
 import { useEffect, useMemo, useState, useRef, useCallback, memo } from "react";
 import { fetchConsentContent, submitConsentEvent } from "./api";
+import {
+  fetchNoticeConsentStatus,
+  isNoticeFullyConsented,
+} from "../shared/notice-consent-status";
 import type { ConsentContent } from "./api/types";
 import type { Props, TranslationObject } from "./types";
 import { styles } from "./styles";
@@ -36,6 +40,14 @@ const RedactoConsentInlineComponent = ({
     Record<string, boolean>
   >({});
   const [hasAlreadyConsented, setHasAlreadyConsented] = useState(false);
+  // When a ledger is configured, block the auto-submit effect until the ledger
+  // check-consent read settles, so an already-consented principal is not
+  // re-submitted. Starts true only when a ledger check will actually run
+  // (skipped for the magic-link specific_uuid flow); stays false otherwise so
+  // the legacy Python-409 path is unaffected.
+  const [isCheckingConsent, setIsCheckingConsent] = useState<boolean>(
+    Boolean(ledgerBaseUrl) && !applicationId
+  );
   const [fetchError, setFetchError] = useState<Error | null>(null);
   const [errorMessage, setErrorMessage] = useState<string | null>(null);
 
@@ -220,6 +232,45 @@ const RedactoConsentInlineComponent = ({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [org_uuid, workspace_uuid, notice_uuid, language, applicationId]);
 
+  // Post-cutover, consent records live in the Go ledger, so Python's
+  // get-notice no longer returns 409 CONSENT_ALREADY_PROVIDED. When a ledger
+  // is configured, ask it directly whether this principal has already fully
+  // consented — the same check-consent read the banner uses. Skipped for the
+  // magic-link specific_uuid flow (which always re-submits against a specific
+  // application) and when no ledger is set (the legacy 409 path governs).
+  useEffect(() => {
+    if (!ledgerBaseUrl || applicationId) {
+      return;
+    }
+    if (!accessToken || !content) {
+      return;
+    }
+    let active = true;
+    const controller = new AbortController();
+    const checkLedgerConsent = async () => {
+      try {
+        const ledgerStatus = await fetchNoticeConsentStatus({
+          accessToken,
+          ledgerBaseUrl,
+          noticeUuid: notice_uuid,
+          signal: controller.signal,
+        });
+        if (active && ledgerStatus && isNoticeFullyConsented(ledgerStatus)) {
+          setHasAlreadyConsented(true);
+        }
+      } finally {
+        if (active) {
+          setIsCheckingConsent(false);
+        }
+      }
+    };
+    checkLedgerConsent();
+    return () => {
+      active = false;
+      controller.abort();
+    };
+  }, [ledgerBaseUrl, applicationId, accessToken, content, notice_uuid]);
+
   const togglePurposeCollapse = (purposeUuid: string) => {
     setCollapsedPurposes((prev) => ({
       ...prev,
@@ -392,13 +443,18 @@ const RedactoConsentInlineComponent = ({
     ]
   );
 
-  // Auto-submit consent when all conditions are met
+  // Auto-submit consent when all conditions are met. Waits for the ledger
+  // check-consent read to settle (isCheckingConsent) and never fires for an
+  // already-consented principal, so the cutover cannot trigger a duplicate
+  // submission.
   useEffect(() => {
     if (
       accessToken &&
       content &&
       areAllRequiredElementsChecked &&
       !isSubmitting &&
+      !isCheckingConsent &&
+      !hasAlreadyConsented &&
       !hasSubmittedRef.current
     ) {
       hasSubmittedRef.current = true;
@@ -417,6 +473,8 @@ const RedactoConsentInlineComponent = ({
     content,
     areAllRequiredElementsChecked,
     isSubmitting,
+    isCheckingConsent,
+    hasAlreadyConsented,
     handleAcceptWithToken,
   ]);
 

package/src/RedactoPrivacyCenter/components/AppShell/UserMenu.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState, type CSSProperties } from 'react';
-import { ChevronDown, Users } from 'lucide-react';
+import { Users } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 import { PCAvatar, PCPopover } from '../../ui';
 import { useBranding } from '../../context/BrandingContext';
@@ -56,17 +56,11 @@ export function UserMenu({ onBack }: UserMenuProps) {
   const displayName = branding?.brand_name || organization?.name || '';
   const triggerAvatarName = email ? initialsFromEmail(email) : displayName || '?';
 
-  const triggerStyle: CSSProperties = {
-    display: 'inline-flex',
-    alignItems: 'center',
-    gap: 6,
-    padding: '4px 6px 4px 4px',
-    borderRadius: 9999,
-    background: 'transparent',
-    border: `1px solid ${getVar('--pc-border-color')}`,
-    color: getVar('--pc-text-secondary'),
-    cursor: 'pointer',
-    transition: 'background 150ms ease, border-color 150ms ease, box-shadow 150ms ease',
+  // The .pc-navbar-avatar-btn control draws the ring and surface, so the avatar fills
+  // it and draws neither (see `framed={false}` below).
+  const avatarFillStyle: CSSProperties = {
+    width: '100%',
+    height: '100%',
   };
 
   // Shared style for the popover's action rows (switch profile, back/sign out).
@@ -89,24 +83,25 @@ export function UserMenu({ onBack }: UserMenuProps) {
   };
 
   const trigger = (
-    <div
-      style={triggerStyle}
-      role="presentation"
-      onMouseEnter={(e) => {
-        (e.currentTarget as HTMLDivElement).style.boxShadow =
-          '0 0 0 2px color-mix(in srgb, var(--pc-primary) 18%, transparent)';
-      }}
-      onMouseLeave={(e) => {
-        (e.currentTarget as HTMLDivElement).style.boxShadow = 'none';
-      }}
-    >
+    <button type="button" aria-label={t('accountMenu')} className="pc-navbar-avatar-btn">
       {branding?.icon_url ? (
-        <PCAvatar src={branding.icon_url} name={triggerAvatarName} size="sm" color="info" />
+        <PCAvatar
+          src={branding.icon_url}
+          name={triggerAvatarName}
+          size="md"
+          color="info"
+          framed={false}
+          style={avatarFillStyle}
+        />
       ) : (
-        <PCAvatar name={triggerAvatarName} size="sm" color="info" />
+        <PCAvatar
+          name={triggerAvatarName}
+          size="md"
+          color="info"
+          style={avatarFillStyle}
+        />
       )}
-      <ChevronDown size={14} strokeWidth={2} />
-    </div>
+    </button>
   );
 
   const content = (

package/src/RedactoPrivacyCenter/lib/constants.ts

@@ -40,7 +40,6 @@ export const languageOptions = [
   { value: 'mni-Mtei', label: 'ꯃꯩꯇꯩꯂꯣꯟ (Manipuri)' },
   { value: 'gom', label: 'कोंकणी (Goan Konkani)' },
   { value: 'sa', label: 'संस्कृतम् (Sanskrit)' },
-  { value: 'bho', label: 'भोजपुरी (Bhojpuri)' },
   { value: 'brx', label: 'बड़ो (Bodo)' },
   { value: 'ks', label: 'كٲشُر (Kashmiri)' },
   { value: 'sat', label: 'ᱥᱟᱱᱛᱟᱲᱤ (Santali)' },

package/src/RedactoPrivacyCenter/lib/locales.ts

@@ -2,7 +2,6 @@
 import enTranslation from '../locales/en/translation.json';
 import asTranslation from '../locales/as/translation.json';
 import bnTranslation from '../locales/bn/translation.json';
-import bhoTranslation from '../locales/bho/translation.json';
 import brxTranslation from '../locales/brx/translation.json';
 import doiTranslation from '../locales/doi/translation.json';
 import gomTranslation from '../locales/gom/translation.json';
@@ -28,7 +27,6 @@ const activityFetchErrorTranslations: Record<string, string> = {
   en: 'Failed to fetch activity data',
   as: 'কাৰ্যকলাপৰ তথ্য আনিবলৈ ব্যৰ্থ',
   bn: 'কার্যকলাপের ডেটা আনতে ব্যর্থ',
-  bho: 'गतिविधि डेटा लावे में विफल',
   brx: 'खामानि डाटा लाङो दिहुनायाव असफल',
   doi: 'गतिविधि डेटा लावै मे असफल',
   gom: 'क्रियाकलाप डेटा आणपांत अयशस्वी',
@@ -68,7 +66,6 @@ const translations: Record<string, Record<string, any>> = {
   en: { translation: withSharedActivityErrors('en', enTranslation) },
   as: { translation: withSharedActivityErrors('as', asTranslation) },
   bn: { translation: withSharedActivityErrors('bn', bnTranslation) },
-  bho: { translation: withSharedActivityErrors('bho', bhoTranslation) },
   brx: { translation: withSharedActivityErrors('brx', brxTranslation) },
   doi: { translation: withSharedActivityErrors('doi', doiTranslation) },
   gom: { translation: withSharedActivityErrors('gom', gomTranslation) },

package/src/RedactoPrivacyCenter/locales/en/translation.json

@@ -353,5 +353,6 @@
   "couldNotSwitchProfile": "Could not switch to that profile. Please try again.",
   "purposeNotRevocable": "This purpose can't be withdrawn directly.",
   "purposeNotRevocableError": "This purpose can't be withdrawn directly. Please raise a request to remove it.",
-  "userIdLabel": "User ID: {{id}}"
+  "userIdLabel": "User ID: {{id}}",
+  "accountMenu": "Account menu"
 }