@redacto.io/consent-sdk-react 3.6.0 → 5.0.0

package/src/RedactoPrivacyCenter/components/SideMenuBarPC/SideMenuPC.tsx

@@ -1,7 +1,5 @@
-import { useState } from 'react';
 import { PCTitle, PCCollapse, PCTooltip } from '../../ui';
 import { pcStyles } from '../../styles/pcStyles';
-import { cn } from '../../utils/cn';
 import { PiCaretDownBold } from 'react-icons/pi';
 import { MdLineWeight } from 'react-icons/md';
 
@@ -9,11 +7,9 @@ const getVar = (varName: string): string => `var(${varName})`;
 import StatusBadge from '../../ui/StatusBadge';
 import { useInternalNavigation, type InternalPage } from '../../context/NavigationContext';
 import { useTranslation } from 'react-i18next';
-import type { BadgeType, MenuBadgeProps, SideMenuPCProps } from './types';
+import type { MenuBadgeProps, SideMenuPCProps } from './types';
 import { badges } from './constants';
 
-export type { DropdownItem, MenuItem, SideMenuPCProps } from './types';
-
 const MenuBadge = ({ type, isDisabled }: MenuBadgeProps) => {
   const { t } = useTranslation();
   const badge = badges[type];
@@ -25,7 +21,7 @@ const MenuBadge = ({ type, isDisabled }: MenuBadgeProps) => {
   return (
     <span
       style={{
-        marginLeft: pcStyles.mSm.marginLeft,
+        marginLeft: getVar('--pc-spacing-sm'),
         borderRadius: '9999px',
         paddingLeft: '0.5rem',
         paddingRight: '0.5rem',
@@ -150,7 +146,7 @@ export function SideMenuPC({ menuItems, isCollapsed, onItemSelect }: SideMenuPCP
                                 {item?.icon && (
                                   <span
                                     style={{
-                                      marginRight: isCollapsed ? 0 : pcStyles.mSm.marginRight,
+                                      marginRight: isCollapsed ? 0 : getVar('--pc-spacing-sm'),
                                       display: 'inline-flex',
                                       height: '1.25rem',
                                       width: '1.25rem',
@@ -242,7 +238,7 @@ export function SideMenuPC({ menuItems, isCollapsed, onItemSelect }: SideMenuPCP
                                       {dropdownItem?.icon && (
                                         <span
                                           style={{
-                                            marginRight: pcStyles.mSm.marginRight,
+                                            marginRight: getVar('--pc-spacing-sm'),
                                             display: 'inline-flex',
                                         height: '1.125rem',
                                         width: '1.125rem',
@@ -265,7 +261,7 @@ export function SideMenuPC({ menuItems, isCollapsed, onItemSelect }: SideMenuPCP
                                         />
                                       )}
                                     </div>
-                                    <div style={{ marginLeft: pcStyles.mMd.marginLeft, ...pcStyles.flex, ...pcStyles.itemsCenter }}>
+                                    <div style={{ marginLeft: getVar('--pc-spacing-md'), ...pcStyles.flex, ...pcStyles.itemsCenter }}>
                                       {dropdownItem?.badge?.length ? (
                                         <StatusBadge status={dropdownItem?.badge} className="pc-status-badge" />
                                       ) : (
@@ -284,7 +280,7 @@ export function SideMenuPC({ menuItems, isCollapsed, onItemSelect }: SideMenuPCP
                   renderItemWithTooltip(
                     <div
                       key={item.name + '-' + index}
-                      onClick={() => handleNavigate(item.href)}
+                      onClick={() => item.href && handleNavigate(item.href)}
                       style={{
                         position: 'relative',
                         marginTop: isCollapsed ? 0 : index === 0 ? 0 : '0.1875rem',
@@ -317,7 +313,7 @@ export function SideMenuPC({ menuItems, isCollapsed, onItemSelect }: SideMenuPCP
                         {item?.icon && (
                           <span
                             style={{
-                              marginRight: isCollapsed ? 0 : pcStyles.mSm.marginRight,
+                              marginRight: isCollapsed ? 0 : getVar('--pc-spacing-sm'),
                               display: 'inline-flex',
                               height: '1.25rem',
                               width: '1.25rem',

package/src/RedactoPrivacyCenter/components/SideMenuBarPC/types.ts

@@ -1,4 +1,4 @@
-import { ReactElement } from 'react';
+import type { ReactElement } from 'react';
 
 export type BadgeType = 'new' | 'coming';
 

package/src/RedactoPrivacyCenter/components/activitiesColumns.tsx

@@ -52,7 +52,7 @@ export const useActivitiesColumns = () => {
 
       return (
         <div style={{ paddingTop: pcStyles.pySm.paddingTop, paddingBottom: pcStyles.pySm.paddingBottom }}>
-          <StatusBadge status={status} variant="filled" className="pc-status-badge">
+          <StatusBadge status={status} className="pc-status-badge">
             {displayType}
           </StatusBadge>
         </div>

package/src/RedactoPrivacyCenter/components/caseHistoryColumns.tsx

@@ -2,7 +2,7 @@ import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { PCText, PCActionIcon, PCTooltip, PCBadge } from '../ui';
 import { pcStyles } from '../styles/pcStyles';
-import { FiEye, FiDownload } from 'react-icons/fi';
+import { FiDownload } from 'react-icons/fi';
 import { createColumnHelper } from '@tanstack/react-table';
 import type { CaseRequest } from '../lib/types';
 import { formatDate } from './utils';
@@ -21,13 +21,7 @@ const getCaseStatusVariant = (status: string): 'success' | 'error' | 'warning' |
 const formatCaseStatus = (s: string) =>
   s.replace(/_/g, ' ').replace(/\b\w/g, (c) => c.toUpperCase());
 
-export type UseCaseHistoryColumnsProps = {
-  onViewDetails: (caseRequest: CaseRequest) => void;
-};
-
-export const useCaseHistoryColumns = ({
-  onViewDetails,
-}: UseCaseHistoryColumnsProps) => {
+export const useCaseHistoryColumns = () => {
   const { t } = useTranslation();
   return useMemo(
     () => [
@@ -133,7 +127,7 @@ export const useCaseHistoryColumns = ({
         meta: { align: 'right' },
         enableSorting: false,
         enableColumnFilter: false,
-        cell: ({ row }) => {
+        cell: () => {
           return (
             <div style={{
               ...pcStyles.flex,
@@ -141,20 +135,6 @@ export const useCaseHistoryColumns = ({
               ...pcStyles.gapXs,
               width: '100%',
             }}>
-              <PCTooltip content={t('viewDetails')}>
-                <PCActionIcon
-                  variant="outline"
-                  size="sm"
-                  style={{
-                    color: getVar('--pc-text-secondary'),
-                    transition: 'color 0.2s ease',
-                  }}
-                  onClick={() => onViewDetails(row.original)}
-                  aria-label={t('viewDetails')}
-                >
-                  <FiEye size={16} />
-                </PCActionIcon>
-              </PCTooltip>
               <PCTooltip content={t('downloadResponse')}>
                 <PCActionIcon
                   variant="outline"
@@ -174,6 +154,6 @@ export const useCaseHistoryColumns = ({
         },
       }),
     ],
-    [onViewDetails, t]
+    [t]
   );
 };

package/src/RedactoPrivacyCenter/components/constant.ts

@@ -1,10 +1,3 @@
-export const TABS = {
-  ALL: 'All Requests',
-  PROCESSING: 'Processing',
-  COMPLETED: 'Completed',
-  REJECTED: 'Rejected',
-};
-
 export const GRIEVANCE_TAB_IDS = {
   ALL: 'all',
   PROCESSING: 'processing',
@@ -18,3 +11,6 @@ export {
   INITIAL_PAGE,
   INITIAL_PAGE_SIZE,
 } from '../config/table';
+
+
+export const MAX_DISPLAYED_PURPOSE_NAMES_IN_ERASURE_MODAL = 3;

package/src/RedactoPrivacyCenter/components/types.ts

@@ -1,6 +1,12 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 import type { CaseRequest, UserConsent } from '../lib/types';
 
+export type TableColumnAlign = 'left' | 'center' | 'right';
+
+export type TableColumnMeta = {
+  align?: TableColumnAlign;
+};
+
 export type PrivacyCenterLayoutProps = {
   children: ReactNode;
   sidebarClassName?: string;
@@ -20,11 +26,13 @@ export type CaseDetailsModalProps = {
   selectedCase: CaseRequest | null;
 };
 
-export type RequestSubmitProps = {
+export type RequestSubmitProps = Readonly<{
   caseId: string;
   contact: string;
   onCreateRequest: () => void;
-};
+  revokeConsentOnFulfilment?: boolean;
+  revokedPurposeNames?: string;
+}>;
 
 export type PaginationProps = {
   currentPage: number;
@@ -47,7 +55,7 @@ export type ProductFilterOption = {
 };
 
 export type ConsentManagerProps = {
-  variant?: import('rizzui').TableVariantProps;
+  variant?: 'modern' | 'minimal';
 };
 
 export type ModifyConsentModalProps = {

package/src/RedactoPrivacyCenter/context/AuthContext.tsx

@@ -1,13 +1,8 @@
-import React, { createContext, useContext, ReactNode, useState, useEffect, useCallback, useMemo } from 'react';
-import { setRefreshTokenCookie, getCookieValue, decodeJwtToken } from '../lib/utils';
+import { createContext, useContext, useState, useEffect, useCallback, useMemo, type ReactNode } from 'react';
+import { setRefreshTokenCookie, decodeJwtToken } from '../lib/utils';
+import type { AuthContextValue } from './types';
 
-export interface AuthContextValue {
-  accessToken: string;
-  refreshToken: string;
-  onError: (error: Error) => boolean;
-  // Internal: updates tokens after refresh
-  updateTokens: (accessToken: string, refreshToken?: string) => void;
-}
+export type { AuthContextValue } from './types';
 
 const AuthContext = createContext<AuthContextValue | null>(null);
 
@@ -30,8 +25,10 @@ const syncJwtDataToSessionStorage = (accessToken: string): void => {
     return;
   }
 
-  // Extract email from JWT (contact or primary_email)
-  const email = decoded.contact || decoded.primary_email;
+  // Extract email from JWT (contact or primary_email), fall back to existing sources
+  const email = decoded.contact || decoded.primary_email
+    || sessionStorage.getItem('email')
+    || (typeof localStorage !== 'undefined' ? localStorage.getItem('userEmail') : null);
   if (email && typeof email === 'string') {
     sessionStorage.setItem('email', email);
   }
@@ -61,17 +58,34 @@ export const AuthProvider = ({
   refreshToken: initialRefreshToken,
   onError,
 }: AuthProviderProps) => {
-  const [accessToken, setAccessToken] = useState(initialAccessToken);
-  const [refreshToken, setRefreshToken] = useState(initialRefreshToken);
+  // 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 (initialAccessToken && typeof initialAccessToken === 'string' && initialAccessToken.trim() !== '') {
+      if (typeof window !== 'undefined') {
+        sessionStorage.setItem('access_token', initialAccessToken);
+        syncJwtDataToSessionStorage(initialAccessToken);
+      }
+    }
+    return initialAccessToken;
+  });
+  const [refreshToken, setRefreshToken] = useState(() => {
+    if (initialRefreshToken && typeof initialRefreshToken === 'string' && initialRefreshToken.trim() !== '') {
+      if (typeof window !== 'undefined') {
+        setRefreshTokenCookie(initialRefreshToken);
+      }
+    }
+    return initialRefreshToken;
+  });
 
-  // Sync props to state and storage when they change
-  // Only sync if tokens are valid non-empty strings
+  // Re-sync when props change (for token refresh scenarios)
   useEffect(() => {
     if (initialAccessToken && typeof initialAccessToken === 'string' && initialAccessToken.trim() !== '') {
       setAccessToken(initialAccessToken);
       if (typeof window !== 'undefined') {
         sessionStorage.setItem('access_token', initialAccessToken);
-        // Extract and store org/auth data from JWT
         syncJwtDataToSessionStorage(initialAccessToken);
       }
     }

package/src/RedactoPrivacyCenter/context/BaseUrlContext.tsx

@@ -1,11 +1,8 @@
-import React, { createContext, useContext, ReactNode, useMemo } from 'react';
+import { createContext, useContext, useMemo, type ReactNode } from 'react';
 import { createConsentClient } from '../api/client';
-import type { BaseRequest } from '../api/client';
+import type { BaseUrlContextValue } from './types';
 
-export interface BaseUrlContextValue {
-  baseUrl: string;
-  consentClient: ReturnType<typeof createConsentClient>;
-}
+export type { BaseUrlContextValue } from './types';
 
 export const BaseUrlContext = createContext<BaseUrlContextValue | null>(null);
 

package/src/RedactoPrivacyCenter/context/NavigationContext.tsx

@@ -1,11 +1,13 @@
 import { createContext, useContext, useState, useCallback, type ReactNode } from 'react';
+import type { CaseRequest } from '../lib/types';
 
-export type InternalPage = 'consent-manager' | 'form' | 'activity';
+export type InternalPage = 'consent-manager' | 'form' | 'activity' | 'case-details';
 
 const NAV_STORAGE_KEY = 'pc_current_page';
+const CASE_UUID_STORAGE_KEY = 'pc_selected_case_uuid';
 
 const VALID_PAGES: ReadonlySet<string> = new Set<InternalPage>([
-  'consent-manager', 'form', 'activity',
+  'consent-manager', 'form', 'activity', 'case-details',
 ]);
 
 function getStoredPage(fallback: InternalPage): InternalPage {
@@ -21,9 +23,21 @@ function getStoredPage(fallback: InternalPage): InternalPage {
   return fallback;
 }
 
+function getStoredCaseUuid(): string | null {
+  if (typeof window === 'undefined') return null;
+  try {
+    return sessionStorage.getItem(CASE_UUID_STORAGE_KEY);
+  } catch {
+    return null;
+  }
+}
+
 interface NavigationContextType {
   currentPage: InternalPage;
   navigateTo: (page: InternalPage) => void;
+  selectedCase: CaseRequest | null;
+  setSelectedCase: (c: CaseRequest | null) => void;
+  pendingCaseUuid: string | null;
 }
 
 const NavigationContext = createContext<NavigationContextType | null>(null);
@@ -38,9 +52,27 @@ export const NavigationProvider = ({
   const [currentPage, setCurrentPage] = useState<InternalPage>(
     () => getStoredPage(initialPage)
   );
+  const [selectedCase, setSelectedCaseState] = useState<CaseRequest | null>(null);
+  const [pendingCaseUuid] = useState<string | null>(() => getStoredCaseUuid());
+
+  const setSelectedCase = useCallback((c: CaseRequest | null) => {
+    setSelectedCaseState(c);
+    try {
+      if (c?.uuid) {
+        sessionStorage.setItem(CASE_UUID_STORAGE_KEY, c.uuid);
+      } else {
+        sessionStorage.removeItem(CASE_UUID_STORAGE_KEY);
+      }
+    } catch {
+      // sessionStorage unavailable
+    }
+  }, []);
 
   const navigateTo = useCallback((page: InternalPage) => {
     setCurrentPage(page);
+    if (page !== 'case-details') {
+      setSelectedCaseState(null);
+    }
     try {
       sessionStorage.setItem(NAV_STORAGE_KEY, page);
     } catch {
@@ -49,7 +81,7 @@ export const NavigationProvider = ({
   }, []);
 
   return (
-    <NavigationContext.Provider value={{ currentPage, navigateTo }}>
+    <NavigationContext.Provider value={{ currentPage, navigateTo, selectedCase, setSelectedCase, pendingCaseUuid }}>
       {children}
     </NavigationContext.Provider>
   );

package/src/RedactoPrivacyCenter/context/OrganizationContext.tsx

@@ -1,4 +1,4 @@
-import React, { createContext, useContext, ReactNode } from 'react';
+import { createContext, useContext, type ReactNode } from 'react';
 import type { OrganizationDetail } from '../lib/types';
 
 export const OrganizationContext = createContext<{

package/src/RedactoPrivacyCenter/context/types.ts

@@ -0,0 +1,14 @@
+import type { createConsentClient } from '../api/client';
+
+export type AuthContextValue = Readonly<{
+  accessToken: string;
+  refreshToken: string;
+  onError: (error: Error) => boolean;
+  // Internal: updates tokens after refresh
+  updateTokens: (accessToken: string, refreshToken?: string) => void;
+}>;
+
+export type BaseUrlContextValue = Readonly<{
+  baseUrl: string;
+  consentClient: ReturnType<typeof createConsentClient>;
+}>;

package/src/RedactoPrivacyCenter/lib/api.ts

@@ -6,16 +6,21 @@ import {
   fetchUserConsentsServer,
   getFormDataServer,
   manageConsentServer,
-  createOtpServer,
-  verifyOtpServer,
+  getCaseMessagesServer,
+  sendCaseMessageServer,
+  uploadCaseDocumentServer,
+  submitDocumentForRequestServer,
+  getCaseDocumentServer,
 } from '../api/actions';
 import type { BaseUrlContextValue } from '../context/BaseUrlContext';
 import type {
   ActivityDetail,
   CaseHistoryDetail,
+  CaseMessage,
   CreateCaseResponse,
   FormData,
-  OrganizationResponse,
+  MessageDocument,
+  UploadDocumentResponse,
   UserConsentDetail,
   UserDataRequest,
 } from './types';
@@ -466,3 +471,96 @@ export const fetchCaseHistory = async (
     return null;
   }
 };
+
+// ─── Auth-retry helper ──────────────────────────────────────────────────────
+
+/**
+ * Wraps an API call with token acquisition and single-retry-on-auth-error logic.
+ * `fn` receives a valid access token and returns the API result.
+ */
+async function withAuthRetry<T>(
+  organizationId: string,
+  workspaceId: string,
+  authContext: AuthContext | undefined,
+  consentClient: BaseUrlContextValue['consentClient'] | undefined,
+  errorLabel: string,
+  fn: (token: string) => Promise<T>
+): Promise<T | null> {
+  try {
+    const accessToken = await ensureValidToken(organizationId, workspaceId, undefined, authContext, consentClient);
+    if (!accessToken) return null;
+    return await fn(accessToken);
+  } catch (error: any) {
+    const shouldRetry = await handleClientAuthError(error, organizationId, workspaceId, authContext, consentClient);
+    if (shouldRetry) {
+      const token = sessionStorage.getItem('access_token') || authContext?.accessToken || '';
+      return await fn(token);
+    }
+    console.error(errorLabel, error);
+    return null;
+  }
+}
+
+// ─── Case Communication ──────────────────────────────────────────────────────
+
+export const getCaseMessages = async (
+  organizationId: string,
+  workspaceId: string,
+  caseUuid: string,
+  authContext?: AuthContext,
+  consentClient?: BaseUrlContextValue['consentClient']
+): Promise<CaseMessage[] | null> =>
+  withAuthRetry(organizationId, workspaceId, authContext, consentClient, 'Error fetching case messages:', (token) =>
+    getCaseMessagesServer({ organizationId, workspaceId, caseUuid, authToken: token, consentClient })
+  );
+
+export const sendCaseMessage = async (
+  organizationId: string,
+  workspaceId: string,
+  caseUuid: string,
+  body: string,
+  documentUuids: string[],
+  authContext?: AuthContext,
+  consentClient?: BaseUrlContextValue['consentClient']
+): Promise<CaseMessage | null> =>
+  withAuthRetry(organizationId, workspaceId, authContext, consentClient, 'Error sending case message:', (token) =>
+    sendCaseMessageServer({ organizationId, workspaceId, caseUuid, body, documentUuids, authToken: token, consentClient })
+  );
+
+export const uploadCaseDocument = async (
+  organizationId: string,
+  workspaceId: string,
+  caseUuid: string,
+  file: File,
+  authContext?: AuthContext,
+  consentClient?: BaseUrlContextValue['consentClient']
+): Promise<UploadDocumentResponse | null> =>
+  withAuthRetry(organizationId, workspaceId, authContext, consentClient, 'Error uploading case document:', (token) =>
+    uploadCaseDocumentServer({ organizationId, workspaceId, caseUuid, file, authToken: token, consentClient })
+  );
+
+export const submitDocumentForRequest = async (
+  organizationId: string,
+  workspaceId: string,
+  caseUuid: string,
+  requestEventUuid: string,
+  documentUuid: string,
+  body: string,
+  authContext?: AuthContext,
+  consentClient?: BaseUrlContextValue['consentClient']
+): Promise<CaseMessage | null> =>
+  withAuthRetry(organizationId, workspaceId, authContext, consentClient, 'Error submitting document for request:', (token) =>
+    submitDocumentForRequestServer({ organizationId, workspaceId, caseUuid, requestEventUuid, documentUuid, body, authToken: token, consentClient })
+  );
+
+export const getCaseDocument = async (
+  organizationId: string,
+  workspaceId: string,
+  caseUuid: string,
+  documentUuid: string,
+  authContext?: AuthContext,
+  consentClient?: BaseUrlContextValue['consentClient']
+): Promise<MessageDocument | null> =>
+  withAuthRetry(organizationId, workspaceId, authContext, consentClient, 'Error fetching case document:', (token) =>
+    getCaseDocumentServer({ organizationId, workspaceId, caseUuid, documentUuid, authToken: token, consentClient })
+  );

package/src/RedactoPrivacyCenter/lib/constants.ts

@@ -4,6 +4,7 @@ import { GRIEVANCE_TAB_IDS } from '../components/constant';
 import { menuItemsPC } from '../components/SideMenuBarPC/constants';
 import type { MenuItem } from '../components/SideMenuBarPC/types';
 import type { InternalPage } from '../context/NavigationContext';
+import type { DocumentRequestStatus, DocumentRequestStatusInfo } from './types';
 
 export const useRequestTypeLabels = () => {
   const { t } = useTranslation();
@@ -36,7 +37,7 @@ export const languageOptions = [
   { value: 'sd', label: 'سنڌي (Sindhi)' },
   { value: 'doi', label: 'डोगरी (Dogri)' },
   { value: 'mni-Mtei', label: 'ꯃꯩꯇꯩꯂꯣꯟ (Manipuri)' },
-  { value: 'gom', label: 'कोंकणी (Konkani)' },
+  { value: 'gom', label: 'कोंकणी (Goan Konkani)' },
   { value: 'sa', label: 'संस्कृतम् (Sanskrit)' },
   { value: 'bho', label: 'भोजपुरी (Bhojpuri)' },
   { value: 'brx', label: 'बड़ो (Bodo)' },
@@ -84,6 +85,10 @@ export const PAGE_CHROME_BY_PAGE: Record<InternalPage, PageChromeConfig> = {
     titleKey: 'activities',
     descriptionKey: 'activitiesSubtitle',
   },
+  'case-details': {
+    titleKey: 'caseDetails',
+    descriptionKey: 'yourPrivacyCenter',
+  },
 };
 
 const HREF_TO_NAME_KEY: Record<string, string> = {
@@ -100,6 +105,46 @@ export const useMenuItemsPC = (): MenuItem[] => {
   }));
 };
 
+// ─── Upload validation ────────────────────────────────────────────────────────
+
+export const MAX_FILE_SIZE = 10 * 1024 * 1024; // 10 MB
+
+export const ALLOWED_MIME_TYPES = [
+  'application/pdf',
+  'image/jpeg',
+  'image/png',
+  'image/webp',
+  'application/msword',
+  'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+  'application/vnd.ms-excel',
+  'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+  'text/plain',
+  'text/csv',
+];
+
+// ─── Status colors ───────────────────────────────────────────────────────────
+
+export const STATUS_COLORS = {
+  success: { color: '#16a34a', bg: '#f0fdf4', border: '#bbf7d0' },
+  error: { color: '#dc2626', bg: '#fef2f2', border: '#fecaca' },
+  warning: { color: '#d97706', bg: '#fffbeb', border: '#fde68a' },
+  info: { color: '#2563eb', bg: '#f8fbff', border: '#93c5fd' },
+  infoDark: '#1d4ed8',
+  infoBanner: { color: '#1d4ed8', bg: '#eff6ff', border: '#bfdbfe' },
+} as const;
+
+// ─── Document request ─────────────────────────────────────────────────────────
+
+export const UPLOAD_ACTIVE_STATUSES: DocumentRequestStatus[] = ['pending', 'replacement_requested'];
+
+export const DOCUMENT_REQUEST_STATUS_LABEL: Record<DocumentRequestStatus, DocumentRequestStatusInfo> = {
+  pending: { labelKey: 'docStatusPending', color: STATUS_COLORS.warning.color },
+  under_review: { labelKey: 'docStatusUnderReview', color: STATUS_COLORS.info.color },
+  approved: { labelKey: 'docStatusApproved', color: STATUS_COLORS.success.color },
+  rejected: { labelKey: 'docStatusRejected', color: STATUS_COLORS.error.color },
+  replacement_requested: { labelKey: 'docStatusReplacementRequested', color: STATUS_COLORS.warning.color },
+};
+
 // Activity columns constants
 export const ACTIVITY_COLUMN_SIZES = {
   TITLE: 220,

package/src/RedactoPrivacyCenter/lib/i18n.ts

@@ -62,7 +62,7 @@ i18n
       order: ['sessionStorage', 'navigator', 'htmlTag'],
       caches: ['sessionStorage'],
       lookupSessionStorage: 'i18nextLng',
-      convertDetectedLanguage: (lng) => {
+      convertDetectedLanguage: (lng: string) => {
         // Extract base language code (e.g. 'en-US' -> 'en') so it matches
         // our supported language keys, but preserve script subtags like 'mni-Mtei'.
         const base = lng.split('-')[0];