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

package/src/RedactoPrivacyCenter/lib/constants.ts

@@ -0,0 +1,161 @@
+import { RequestTypeEnum } from './types';
+import { useTranslation } from 'react-i18next';
+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();
+
+  return {
+    [RequestTypeEnum.ACCESS]: t('access'),
+    [RequestTypeEnum.CORRECTION]: t('correction'),
+    [RequestTypeEnum.ERASURE]: t('erasure'),
+    [RequestTypeEnum.GRIEVANCE]: t('grievance'),
+    [RequestTypeEnum.NOMINATION]: t('nomination'),
+  } as Record<RequestTypeEnum, string>;
+};
+
+export const languageOptions = [
+  { value: 'en', label: 'English' },
+  { value: 'hi', label: 'हिन्दी (Hindi)' },
+  { value: 'te', label: 'తెలుగు (Telugu)' },
+  { value: 'mr', label: 'मराठी (Marathi)' },
+  { value: 'ta', label: 'தமிழ் (Tamil)' },
+  { value: 'ur', label: 'اردو (Urdu)' },
+  { value: 'gu', label: 'ગુજરાતી (Gujarati)' },
+  { value: 'kn', label: 'ಕನ್ನಡ (Kannada)' },
+  { value: 'ml', label: 'മലയാളം (Malayalam)' },
+  { value: 'pa', label: 'ਪੰਜਾਬੀ (Punjabi)' },
+  { value: 'or', label: 'ଓଡ଼ିଆ (Odia)' },
+  { value: 'as', label: 'অসমীয়া (Assamese)' },
+  { value: 'bn', label: 'বাংলা (Bengali)' },
+  { value: 'mai', label: 'मैथिली (Maithili)' },
+  { value: 'ne', label: 'नेपाली (Nepali)' },
+  { value: 'sd', label: 'سنڌي (Sindhi)' },
+  { value: 'doi', label: 'डोगरी (Dogri)' },
+  { 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)' },
+];
+
+export const useTimePeriodOptions = () => {
+  const { t } = useTranslation();
+
+  return [
+    { value: '1', label: t('today') },
+    { value: '7', label: t('last7Days') },
+    { value: '30', label: t('last30Days') },
+    { value: '90', label: t('last3Months') },
+  ];
+};
+
+export const useGrievanceTabs = () => {
+  const { t } = useTranslation();
+
+  return [
+    { id: GRIEVANCE_TAB_IDS.ALL, label: t('allRequests') },
+    { id: GRIEVANCE_TAB_IDS.PROCESSING, label: t('processing') },
+    { id: GRIEVANCE_TAB_IDS.COMPLETED, label: t('completed') },
+    { id: GRIEVANCE_TAB_IDS.REJECTED, label: t('rejected') },
+  ];
+};
+
+export type PageChromeConfig = {
+  titleKey: string;
+  descriptionKey: string;
+};
+
+export const PAGE_CHROME_BY_PAGE: Record<InternalPage, PageChromeConfig> = {
+  'consent-manager': {
+    titleKey: 'manageConsent',
+    descriptionKey: 'manageConsentSubtitle',
+  },
+  form: {
+    titleKey: 'grievanceRequests',
+    descriptionKey: 'grievanceSubtitle',
+  },
+  activity: {
+    titleKey: 'activities',
+    descriptionKey: 'activitiesSubtitle',
+  },
+  'case-details': {
+    titleKey: 'caseDetails',
+    descriptionKey: 'yourPrivacyCenter',
+  },
+};
+
+const HREF_TO_NAME_KEY: Record<string, string> = {
+  'consent-manager': 'consentManager',
+  form: 'grievance',
+  activity: 'activity',
+};
+
+export const useMenuItemsPC = (): MenuItem[] => {
+  const { t } = useTranslation();
+  return menuItemsPC.map((item) => ({
+    ...item,
+    name: t((item.href && HREF_TO_NAME_KEY[item.href]) ?? item.name),
+  }));
+};
+
+// ─── 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,
+  ACTIVITY_TYPE: 160,
+  DESCRIPTION: 320,
+  TIMESTAMP: 200,
+} as const;
+
+export const ACTIVITY_DESCRIPTION_TRUNCATE_LENGTH = 100;
+
+export const ACTIVITY_DATE_FORMATS = {
+  DISPLAY: 'MMM D, YYYY [at] h:mm A',
+  TOOLTIP: 'MMMM D, YYYY [at] h:mm:ss A',
+} as const;

package/src/RedactoPrivacyCenter/lib/i18n.ts

@@ -0,0 +1,81 @@
+import dayjs from 'dayjs';
+import 'dayjs/locale/hi';
+import 'dayjs/locale/te';
+import 'dayjs/locale/mr';
+import 'dayjs/locale/ta';
+import 'dayjs/locale/ur';
+import 'dayjs/locale/gu';
+import 'dayjs/locale/kn';
+import 'dayjs/locale/ml';
+import 'dayjs/locale/pa-in';
+import 'dayjs/locale/ne';
+import 'dayjs/locale/sd';
+import 'dayjs/locale/bn';
+import 'dayjs/locale/gom-latn';
+import i18n from 'i18next';
+import LanguageDetector from 'i18next-browser-languagedetector';
+import { initReactI18next } from 'react-i18next';
+import translations from './locales';
+
+// Map app language codes to dayjs locale IDs.
+// Languages not listed here fall back to 'en'.
+const dayjsLocaleMap: Record<string, string> = {
+  hi: 'hi',
+  te: 'te',
+  mr: 'mr',
+  ta: 'ta',
+  ur: 'ur',
+  gu: 'gu',
+  kn: 'kn',
+  ml: 'ml',
+  pa: 'pa-in',
+  ne: 'ne',
+  sd: 'sd',
+  bn: 'bn',
+  gom: 'gom-latn',
+};
+
+function syncDayjsLocale(lng: string) {
+  dayjs.locale(dayjsLocaleMap[lng] || 'en');
+}
+
+// Convert translations to i18next resources format
+// i18next expects: { [language]: { [namespace]: { [key]: value } } }
+const resources: Record<string, Record<string, any>> = {};
+Object.keys(translations).forEach((lang) => {
+  resources[lang] = translations[lang];
+});
+
+i18n
+  .use(LanguageDetector)
+  .use(initReactI18next)
+  .init({
+    resources,
+    fallbackLng: 'en',
+    defaultNS: 'translation',
+    ns: ['translation'],
+    debug: false,
+    interpolation: {
+      escapeValue: false,
+    },
+    detection: {
+      order: ['sessionStorage', 'navigator', 'htmlTag'],
+      caches: ['sessionStorage'],
+      lookupSessionStorage: 'i18nextLng',
+      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];
+        if (base && resources[base]) return base;
+        return lng;
+      },
+    },
+    react: {
+      useSuspense: false,
+    },
+  });
+
+i18n.on('languageChanged', syncDayjsLocale);
+syncDayjsLocale(i18n.language);
+
+export default i18n;

package/src/RedactoPrivacyCenter/lib/locales.ts

@@ -0,0 +1,105 @@
+// Static imports of all locale files for bundling
+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';
+import guTranslation from '../locales/gu/translation.json';
+import hiTranslation from '../locales/hi/translation.json';
+import knTranslation from '../locales/kn/translation.json';
+import ksTranslation from '../locales/ks/translation.json';
+import maiTranslation from '../locales/mai/translation.json';
+import mlTranslation from '../locales/ml/translation.json';
+import mniMteiTranslation from '../locales/mni-Mtei/translation.json';
+import mrTranslation from '../locales/mr/translation.json';
+import neTranslation from '../locales/ne/translation.json';
+import orTranslation from '../locales/or/translation.json';
+import paTranslation from '../locales/pa/translation.json';
+import saTranslation from '../locales/sa/translation.json';
+import satTranslation from '../locales/sat/translation.json';
+import sdTranslation from '../locales/sd/translation.json';
+import taTranslation from '../locales/ta/translation.json';
+import teTranslation from '../locales/te/translation.json';
+import urTranslation from '../locales/ur/translation.json';
+
+const activityFetchErrorTranslations: Record<string, string> = {
+  en: 'Failed to fetch activity data',
+  as: 'কাৰ্যকলাপৰ তথ্য আনিবলৈ ব্যৰ্থ',
+  bn: 'কার্যকলাপের ডেটা আনতে ব্যর্থ',
+  bho: 'गतिविधि डेटा लावे में विफल',
+  brx: 'खामानि डाटा लाङो दिहुनायाव असफल',
+  doi: 'गतिविधि डेटा लावै मे असफल',
+  gom: 'क्रियाकलाप डेटा आणपांत अयशस्वी',
+  gu: 'પ્રવૃત્તિ ડેટા મેળવવામાં નિષ્ફળ',
+  hi: 'गतिविधि डेटा लाने में विफल',
+  kn: 'ಚಟುವಟಿಕೆ ಡೇಟಾವನ್ನು ತರಲು ವಿಫಲ',
+  ks: 'سرگرمی ڈیٹا حاصل کرنے میں ناکام',
+  mai: 'गतिविधि डेटा लावै मे असफल',
+  ml: 'പ്രവർത്തന ഡാറ്റ ലഭ്യമാക്കുന്നതിൽ പരാജയപ്പെട്ടു',
+  'mni-Mtei': 'ꯈꯨꯗꯝꯕꯤꯠ ꯗꯦꯇꯥ ꯐꯪꯉꯕꯗ ꯌꯥꯝꯅꯥ ꯋꯥꯏ꯫',
+  mr: 'क्रियाकलाप डेटा आणण्यात अयशस्वी',
+  ne: 'गतिविधि डेटा ल्याउन असफल',
+  or: 'କାର୍ଯ୍ୟକଳାପ ତଥ୍ୟ ଆଣିବାରେ ବିଫଳ',
+  pa: 'ਗਤੀਵਿਧੀ ਡਾਟਾ ਲਿਆਉਣ ਵਿੱਚ ਅਸਫਲ',
+  sa: 'क्रियाकलाप-दत्तांशम् आने विफलम्',
+  sat: 'ᱠᱟᱹᱢᱤ ᱰᱟᱴᱟ ᱟᱹᱜᱩ ᱨᱮ ᱵᱤᱯᱚᱠ',
+  sd: 'سرگرمي جي ڊيٽا حاصل ڪرڻ ۾ ناڪام',
+  ta: 'செயல்பாட்டு தரவை பெற முடியவில்லை',
+  te: 'కార్యకలాప డేటాను తెచ్చుకోవడం విఫలమైంది',
+  ur: 'سرگرمی کا ڈیٹا حاصل کرنے میں ناکام',
+};
+
+function withSharedActivityErrors(
+  language: string,
+  translation: Record<string, any>
+) {
+  return {
+    ...translation,
+    failedToFetchActivityData:
+      activityFetchErrorTranslations[language] ??
+      activityFetchErrorTranslations.en,
+  };
+}
+
+// Map of language codes to translation objects
+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) },
+  gu: { translation: withSharedActivityErrors('gu', guTranslation) },
+  hi: { translation: withSharedActivityErrors('hi', hiTranslation) },
+  kn: { translation: withSharedActivityErrors('kn', knTranslation) },
+  ks: { translation: withSharedActivityErrors('ks', ksTranslation) },
+  mai: { translation: withSharedActivityErrors('mai', maiTranslation) },
+  ml: { translation: withSharedActivityErrors('ml', mlTranslation) },
+  'mni-Mtei': { translation: withSharedActivityErrors('mni-Mtei', mniMteiTranslation) },
+  mr: { translation: withSharedActivityErrors('mr', mrTranslation) },
+  ne: { translation: withSharedActivityErrors('ne', neTranslation) },
+  or: { translation: withSharedActivityErrors('or', orTranslation) },
+  pa: { translation: withSharedActivityErrors('pa', paTranslation) },
+  sa: { translation: withSharedActivityErrors('sa', saTranslation) },
+  sat: { translation: withSharedActivityErrors('sat', satTranslation) },
+  sd: { translation: withSharedActivityErrors('sd', sdTranslation) },
+  ta: { translation: withSharedActivityErrors('ta', taTranslation) },
+  te: { translation: withSharedActivityErrors('te', teTranslation) },
+  ur: { translation: withSharedActivityErrors('ur', urTranslation) },
+};
+
+export function getTranslation(language: string, namespace: string) {
+  const langTranslations = translations[language];
+  if (!langTranslations) {
+    // Fallback to English if language not found
+    const fallback = translations.en?.[namespace];
+    return fallback || {};
+  }
+  const translation = langTranslations[namespace];
+  return translation || {};
+}
+
+export default translations;

package/src/RedactoPrivacyCenter/lib/queries.ts

@@ -0,0 +1,134 @@
+import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
+import {
+  fetchCaseHistory,
+  getCaseMessages,
+  sendCaseMessage,
+  uploadCaseDocument,
+  submitDocumentForRequest,
+  type AuthContext,
+} from './api';
+import { useBaseUrl } from '../context/BaseUrlContext';
+import { useCurrentLanguage } from './useCurrentLanguage';
+import type { SendCaseMessageInput, SubmitDocumentForRequestInput } from './types';
+
+export const useCaseHistory = (
+  organizationId: string | undefined,
+  workspaceId: string | undefined,
+  contact: string | undefined,
+  authContext?: AuthContext
+) => {
+  const { consentClient } = useBaseUrl();
+  // Include accessToken in queryKey so queries refetch when tokens change
+  // This ensures data is refetched with new tokens after refresh
+  const accessToken = authContext?.accessToken;
+  const { currentLanguage, langParam } = useCurrentLanguage();
+
+  return useQuery({
+    queryKey: ['caseHistory', organizationId, workspaceId, contact, accessToken, currentLanguage],
+    queryFn: async () => {
+      if (!organizationId || !workspaceId || !contact) {
+        return [];
+      }
+      const response = await fetchCaseHistory(organizationId, workspaceId, contact, undefined, undefined, authContext, consentClient, langParam);
+      return response?.data || [];
+    },
+    enabled: !!organizationId && !!workspaceId && !!contact && !!consentClient,
+    retry: 1,
+  });
+};
+
+// ─── Case Communication ──────────────────────────────────────────────────────
+
+export const useCaseMessages = (
+  organizationId: string | undefined,
+  workspaceId: string | undefined,
+  caseUuid: string | undefined,
+  authContext?: AuthContext
+) => {
+  const { consentClient } = useBaseUrl();
+  const accessToken = authContext?.accessToken;
+
+  return useQuery({
+    queryKey: ['caseMessages', organizationId, workspaceId, caseUuid, accessToken],
+    queryFn: async () => {
+      if (!organizationId || !workspaceId || !caseUuid) return [];
+      const result = await getCaseMessages(organizationId, workspaceId, caseUuid, authContext, consentClient);
+      if (result === null) throw new Error('Failed to fetch case messages');
+      return result;
+    },
+    // Sort ascending (oldest → newest) regardless of server return order.
+    // ISO 8601 strings sort correctly as strings, so we fall back to that
+    // if Date parsing fails (avoids NaN comparisons leaving order undefined).
+    select: (data) =>
+      [...data].sort((a, b) => {
+        const ta = new Date(a.created_at).getTime();
+        const tb = new Date(b.created_at).getTime();
+        if (isNaN(ta) || isNaN(tb)) return a.created_at < b.created_at ? -1 : 1;
+        return ta - tb;
+      }),
+    enabled: !!organizationId && !!workspaceId && !!caseUuid && !!consentClient,
+    retry: 1,
+  });
+};
+
+export const useSendCaseMessage = (
+  organizationId: string | undefined,
+  workspaceId: string | undefined,
+  caseUuid: string | undefined,
+  authContext?: AuthContext
+) => {
+  const { consentClient } = useBaseUrl();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({ body, documentUuids }: SendCaseMessageInput) => {
+      if (!organizationId || !workspaceId || !caseUuid) throw new Error('Missing params');
+      const result = await sendCaseMessage(organizationId, workspaceId, caseUuid, body, documentUuids, authContext, consentClient);
+      if (result === null) throw new Error('Send case message failed');
+      return result;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['caseMessages', organizationId, workspaceId, caseUuid] });
+    },
+  });
+};
+
+export const useUploadCaseDocument = (
+  organizationId: string | undefined,
+  workspaceId: string | undefined,
+  caseUuid: string | undefined,
+  authContext?: AuthContext
+) => {
+  const { consentClient } = useBaseUrl();
+
+  return useMutation({
+    mutationFn: async (file: File) => {
+      if (!organizationId || !workspaceId || !caseUuid) throw new Error('Missing params');
+      const result = await uploadCaseDocument(organizationId, workspaceId, caseUuid, file, authContext, consentClient);
+      if (result === null) throw new Error('Upload case document failed');
+      return result;
+    },
+  });
+};
+
+export const useSubmitDocumentForRequest = (
+  organizationId: string | undefined,
+  workspaceId: string | undefined,
+  caseUuid: string | undefined,
+  authContext?: AuthContext
+) => {
+  const { consentClient } = useBaseUrl();
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async ({ requestEventUuid, documentUuid, body }: SubmitDocumentForRequestInput) => {
+      if (!organizationId || !workspaceId || !caseUuid) throw new Error('Missing params');
+      const result = await submitDocumentForRequest(organizationId, workspaceId, caseUuid, requestEventUuid, documentUuid, body, authContext, consentClient);
+      if (result === null) throw new Error('Submit document for request failed');
+      return result;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['caseMessages', organizationId, workspaceId, caseUuid] });
+    },
+  });
+};