@dainamite/cpq 0.6.0 → 0.7.0

package/src/modules/cpq/backend/cpq/price-rules/page.tsx

@@ -9,7 +9,7 @@ import type { FilterDef, FilterValues } from '@open-mercato/ui/backend/FilterBar
 import { CpqListView, useCpqListData } from '../../../components/CpqListView'
 import {
   PriceRuleForm,
-  RULE_TYPE_LABELS,
+  buildRuleTypeLabels,
   emptyPriceRuleForm,
   priceRuleFormToPayload,
   type PriceRule,
@@ -62,18 +62,20 @@ export default function PriceRulesPage() {
       .catch(() => {})
   }, [])
 
+  const ruleTypeLabels = React.useMemo(() => buildRuleTypeLabels(t), [t])
+
   const ruleTypeOptions = React.useMemo(
-    () => Object.entries(RULE_TYPE_LABELS).map(([value, label]) => ({ value, label })),
-    [],
+    () => Object.entries(ruleTypeLabels).map(([value, label]) => ({ value, label })),
+    [ruleTypeLabels],
   )
 
   const chargeTypeOptions = React.useMemo(
     () => [
-      { value: 'nrc', label: 'NRC' },
-      { value: 'mrc', label: 'MRC' },
-      { value: 'usage', label: 'Usage' },
+      { value: 'nrc', label: t('cpq.priceRules.chargeTypes.nrc', 'NRC') },
+      { value: 'mrc', label: t('cpq.priceRules.chargeTypes.mrc', 'MRC') },
+      { value: 'usage', label: t('cpq.priceRules.chargeTypes.usage', 'Usage') },
     ],
-    [],
+    [t],
   )
 
   const filters = React.useMemo<FilterDef[]>(
@@ -122,16 +124,20 @@ export default function PriceRulesPage() {
       })
       if (!res.ok) {
         const err = await res.json()
-        throw new Error(err.details ? JSON.stringify(err.details) : err.error ?? 'Failed to create')
+        throw new Error(
+          err.details
+            ? JSON.stringify(err.details)
+            : err.error ?? t('cpq.priceRules.errors.createFailed', 'Failed to create'),
+        )
       }
       setShowForm(false)
       data.reload()
     } catch (err: unknown) {
-      setError(err instanceof Error ? err.message : 'Unknown error')
+      setError(err instanceof Error ? err.message : t('cpq.priceRules.errors.unknown', 'Unknown error'))
     } finally {
       setSaving(false)
     }
-  }, [data, form])
+  }, [data, form, t])
 
   const columns = React.useMemo<ColumnDef<PriceRule>[]>(
     () => [
@@ -154,7 +160,7 @@ export default function PriceRulesPage() {
         accessorKey: 'ruleType',
         header: t('cpq.priceRules.table.type', 'Type'),
         cell: ({ row }) => (
-          <span>{RULE_TYPE_LABELS[row.original.ruleType] ?? row.original.ruleType}</span>
+          <span>{ruleTypeLabels[row.original.ruleType] ?? row.original.ruleType}</span>
         ),
       },
       {
@@ -168,8 +174,9 @@ export default function PriceRulesPage() {
         cell: ({ row }) => (
           <span className="text-xs">
             {row.original.productOfferingId
-              ? row.original.productOfferingName ?? 'Product-scoped'
-              : 'Global'}
+              ? row.original.productOfferingName ??
+                t('cpq.priceRules.scope.productScoped', 'Product-scoped')
+              : t('cpq.priceRules.scope.global', 'Global')}
           </span>
         ),
       },
@@ -201,12 +208,14 @@ export default function PriceRulesPage() {
         header: t('cpq.priceRules.table.status', 'Status'),
         cell: ({ row }) => (
           <Tag variant={row.original.isActive ? 'success' : 'neutral'} dot>
-            {row.original.isActive ? 'Active' : 'Inactive'}
+            {row.original.isActive
+              ? t('cpq.common.active', 'Active')
+              : t('cpq.common.inactive', 'Inactive')}
           </Tag>
         ),
       },
     ],
-    [t],
+    [ruleTypeLabels, t],
   )
 
   return (
@@ -245,7 +254,7 @@ export default function PriceRulesPage() {
       }
       emptyState={
         <div className="rounded-lg border bg-card p-6 text-center text-sm text-muted-foreground">
-          No price rules found. Click &quot;Create Rule&quot; to add one.
+          {t('cpq.priceRules.empty', 'No price rules found. Click "Create Rule" to add one.')}
         </div>
       }
     />

package/src/modules/cpq/backend/cpq/pricing/[id]/EntriesEditor.tsx

@@ -11,6 +11,7 @@ import {
   SelectValue,
 } from '@open-mercato/ui/primitives/select'
 import { Trash2 } from 'lucide-react'
+import { useT } from '@open-mercato/shared/lib/i18n/context'
 
 // ─── Types ──────────────────────────────────────────────────────
 
@@ -54,6 +55,7 @@ export function EntriesEditor({
   initialEntries: Entry[]
   onSaved: (entries: Entry[]) => void
 }) {
+  const t = useT()
   const [drafts, setDrafts] = React.useState<DraftEntry[]>(() =>
     initialEntries.map((e) => ({ ...e, _state: null, _localId: e.id })),
   )
@@ -142,7 +144,7 @@ export function EntriesEditor({
         })
         if (!res.ok) {
           const body = await res.json().catch(() => ({}))
-          return { ok: false, error: body.error ?? 'Failed to create entries' }
+          return { ok: false, error: body.error ?? t('cpq.pricing.entries.errors.createFailed', 'Failed to create entries') }
         }
       }
 
@@ -164,7 +166,7 @@ export function EntriesEditor({
         })
         if (!res.ok) {
           const body = await res.json().catch(() => ({}))
-          return { ok: false, error: body.error ?? `Failed to update entry ${d.id}` }
+          return { ok: false, error: body.error ?? t('cpq.pricing.entries.errors.updateFailed', 'Failed to update entry {id}', { id: d.id }) }
         }
       }
 
@@ -178,13 +180,13 @@ export function EntriesEditor({
         })
         if (!res.ok) {
           const body = await res.json().catch(() => ({}))
-          return { ok: false, error: body.error ?? `Failed to delete entry ${d.id}` }
+          return { ok: false, error: body.error ?? t('cpq.pricing.entries.errors.deleteFailed', 'Failed to delete entry {id}', { id: d.id }) }
         }
       }
 
       return { ok: true }
     } catch (err) {
-      return { ok: false, error: err instanceof Error ? err.message : 'Failed to save entries' }
+      return { ok: false, error: err instanceof Error ? err.message : t('cpq.pricing.entries.errors.saveFailed', 'Failed to save entries') }
     } finally {
       setSaving(false)
     }
@@ -208,26 +210,26 @@ export function EntriesEditor({
     <div className="space-y-3">
       <div className="flex items-center justify-between">
         <h2 className="text-lg font-semibold">
-          Entries ({visibleDrafts.length})
+          {t('cpq.pricing.entries.title', 'Entries ({count})', { count: visibleDrafts.length })}
         </h2>
         <div className="flex items-center gap-2">
           {mode === 'view' ? (
             <Button type="button" variant="outline" size="sm" onClick={() => setMode('edit')}>
-              Edit Entries
+              {t('cpq.pricing.entries.edit', 'Edit Entries')}
             </Button>
           ) : (
             <>
               <Button type="button" variant="outline" size="sm" onClick={() => addRow(false)}>
-                + Add Row
+                {t('cpq.pricing.entries.addRow', '+ Add Row')}
               </Button>
               <Button type="button" variant="outline" size="sm" onClick={() => addRow(true)}>
-                + Add Tier
+                {t('cpq.pricing.entries.addTier', '+ Add Tier')}
               </Button>
               <Button type="button" size="sm" onClick={handleSave} disabled={saving || !dirty}>
-                {saving ? 'Saving...' : 'Save'}
+                {saving ? t('cpq.common.saving', 'Saving...') : t('cpq.common.save', 'Save')}
               </Button>
               <Button type="button" variant="outline" size="sm" onClick={cancelEdit} disabled={saving}>
-                Cancel
+                {t('cpq.common.cancel', 'Cancel')}
               </Button>
             </>
           )}
@@ -239,8 +241,11 @@ export function EntriesEditor({
       {visibleDrafts.length === 0 ? (
         <div className="rounded-lg border bg-card p-6 text-center text-sm text-muted-foreground">
           {mode === 'edit'
-            ? 'No entries yet — use "+ Add Row" (dimensions lookup) or "+ Add Tier" (range lookup).'
-            : 'No entries in this pricing table.'}
+            ? t(
+                'cpq.pricing.entries.emptyEditing',
+                'No entries yet — use "+ Add Row" (dimensions lookup) or "+ Add Tier" (range lookup).',
+              )
+            : t('cpq.pricing.entries.empty', 'No entries in this pricing table.')}
         </div>
       ) : (
         <div className="rounded-lg border overflow-x-auto">
@@ -256,9 +261,9 @@ export function EntriesEditor({
                     prices they qualify, so the row reads "what → how much". */}
                 {hasTieredEntries && (
                   <>
-                    <th className="px-3 py-3 text-left font-medium whitespace-nowrap">Tier #</th>
-                    <th className="px-3 py-3 text-left font-medium whitespace-nowrap">Range From</th>
-                    <th className="px-3 py-3 text-left font-medium whitespace-nowrap">Range To</th>
+                    <th className="px-3 py-3 text-left font-medium whitespace-nowrap">{t('cpq.pricing.entries.tierNumber', 'Tier #')}</th>
+                    <th className="px-3 py-3 text-left font-medium whitespace-nowrap">{t('cpq.pricing.entries.rangeFrom', 'Range From')}</th>
+                    <th className="px-3 py-3 text-left font-medium whitespace-nowrap">{t('cpq.pricing.entries.rangeTo', 'Range To')}</th>
                   </>
                 )}
                 {table.priceColumns.map((col) => (
@@ -266,8 +271,8 @@ export function EntriesEditor({
                     {col.label}
                   </th>
                 ))}
-                <th className="px-3 py-3 text-left font-medium">Currency</th>
-                {mode === 'edit' && <th className="px-3 py-3 w-8" aria-label="Actions" />}
+                <th className="px-3 py-3 text-left font-medium">{t('cpq.pricing.entries.currency', 'Currency')}</th>
+                {mode === 'edit' && <th className="px-3 py-3 w-8" aria-label={t('cpq.pricing.entries.actions', 'Actions')} />}
               </tr>
             </thead>
             <tbody>
@@ -307,6 +312,7 @@ function EntryRow({
   onChange: (patch: Partial<DraftEntry>) => void
   onDelete: () => void
 }) {
+  const t = useT()
   const readOnly = mode === 'view'
   const rowBg = entry._state === 'new'
     ? 'bg-success/5'
@@ -421,7 +427,7 @@ function EntryRow({
             type="button"
             onClick={onDelete}
             className="text-destructive hover:bg-destructive/10 rounded p-1"
-            aria-label="Delete row"
+            aria-label={t('cpq.pricing.entries.deleteRow', 'Delete row')}
           >
             <Trash2 className="h-4 w-4" />
           </button>

package/src/modules/cpq/backend/cpq/pricing/[id]/ImportPreview.tsx

@@ -3,6 +3,7 @@ import * as React from 'react'
 import { Alert } from '@open-mercato/ui/primitives/alert'
 import { Button } from '@open-mercato/ui/primitives/button'
 import { Tag } from '@open-mercato/ui/primitives/tag'
+import { useT, type TranslateFn } from '@open-mercato/shared/lib/i18n/context'
 import type { ImportDiff } from './xlsxImport'
 
 export function ImportPreview({
@@ -16,22 +17,23 @@ export function ImportPreview({
   onConfirm: () => void
   onCancel: () => void
 }) {
+  const t = useT()
   const total = diff.inserts.length + diff.updates.length + diff.deletes.length
   return (
     <div className="rounded-lg border bg-card p-5 space-y-4">
       <div className="flex items-center justify-between">
-        <h3 className="font-semibold">Import preview</h3>
+        <h3 className="font-semibold">{t('cpq.pricing.import.preview.title', 'Import preview')}</h3>
         <div className="flex gap-2 items-center text-sm">
-          <Tag variant="success" dot>{diff.inserts.length} new</Tag>
-          <Tag variant="warning" dot>{diff.updates.length} updated</Tag>
-          <Tag variant="error" dot>{diff.deletes.length} deleted</Tag>
-          <span className="text-muted-foreground">({diff.unchanged.length} unchanged)</span>
+          <Tag variant="success" dot>{t('cpq.pricing.import.preview.newCount', '{count} new', { count: diff.inserts.length })}</Tag>
+          <Tag variant="warning" dot>{t('cpq.pricing.import.preview.updatedCount', '{count} updated', { count: diff.updates.length })}</Tag>
+          <Tag variant="error" dot>{t('cpq.pricing.import.preview.deletedCount', '{count} deleted', { count: diff.deletes.length })}</Tag>
+          <span className="text-muted-foreground">{t('cpq.pricing.import.preview.unchangedCount', '({count} unchanged)', { count: diff.unchanged.length })}</span>
         </div>
       </div>
 
       {diff.warnings.length > 0 && (
         <Alert variant="default">
-          <div className="font-medium mb-1">Warnings</div>
+          <div className="font-medium mb-1">{t('cpq.pricing.import.preview.warnings', 'Warnings')}</div>
           <ul className="list-disc pl-5 text-xs space-y-0.5">
             {diff.warnings.map((w, i) => <li key={i}>{w}</li>)}
           </ul>
@@ -40,19 +42,19 @@ export function ImportPreview({
 
       {total === 0 ? (
         <Alert>
-          The file contains no changes — every row matches an existing entry.
+          {t('cpq.pricing.import.preview.noChanges', 'The file contains no changes — every row matches an existing entry.')}
         </Alert>
       ) : (
         <div className="space-y-2 text-xs">
           {diff.inserts.length > 0 && (
             <details className="rounded border p-2">
               <summary className="cursor-pointer font-medium text-success">
-                {diff.inserts.length} new entries will be created
+                {t('cpq.pricing.import.preview.insertsSummary', '{count} new entries will be created', { count: diff.inserts.length })}
               </summary>
               <ul className="mt-2 pl-5 list-disc space-y-0.5 max-h-40 overflow-y-auto">
                 {diff.inserts.map((r) => (
                   <li key={r.rowNumber}>
-                    Row {r.rowNumber}: {summarizeRow(r)}
+                    {t('cpq.pricing.import.preview.insertRow', 'Row {row}: {summary}', { row: r.rowNumber, summary: summarizeRow(r, t) })}
                   </li>
                 ))}
               </ul>
@@ -61,12 +63,15 @@ export function ImportPreview({
           {diff.updates.length > 0 && (
             <details className="rounded border p-2">
               <summary className="cursor-pointer font-medium text-warning">
-                {diff.updates.length} entries will be updated
+                {t('cpq.pricing.import.preview.updatesSummary', '{count} entries will be updated', { count: diff.updates.length })}
               </summary>
               <ul className="mt-2 pl-5 list-disc space-y-0.5 max-h-40 overflow-y-auto">
                 {diff.updates.map((u) => (
                   <li key={u.before.id}>
-                    Row {u.after.rowNumber} (id <code className="font-mono">{u.before.id.slice(0, 8)}…</code>): {summarizeRow(u.after)}
+                    {/* The truncated id renders as <code> between prefix and suffix. */}
+                    {t('cpq.pricing.import.preview.updateRowPrefix', 'Row {row} (id ', { row: u.after.rowNumber })}
+                    <code className="font-mono">{u.before.id.slice(0, 8)}…</code>
+                    {t('cpq.pricing.import.preview.updateRowSuffix', '): {summary}', { summary: summarizeRow(u.after, t) })}
                   </li>
                 ))}
               </ul>
@@ -75,12 +80,12 @@ export function ImportPreview({
           {diff.deletes.length > 0 && (
             <details className="rounded border p-2">
               <summary className="cursor-pointer font-medium text-destructive">
-                {diff.deletes.length} entries will be deleted
+                {t('cpq.pricing.import.preview.deletesSummary', '{count} entries will be deleted', { count: diff.deletes.length })}
               </summary>
               <ul className="mt-2 pl-5 list-disc space-y-0.5 max-h-40 overflow-y-auto">
                 {diff.deletes.map((e) => (
                   <li key={e.id}>
-                    <code className="font-mono">{e.id.slice(0, 8)}…</code>: {summarizeEntry(e)}
+                    <code className="font-mono">{e.id.slice(0, 8)}…</code>: {summarizeEntry(e, t)}
                   </li>
                 ))}
               </ul>
@@ -91,19 +96,24 @@ export function ImportPreview({
 
       <div className="flex gap-2 pt-2 border-t">
         <Button type="button" onClick={onConfirm} disabled={saving || total === 0}>
-          {saving ? 'Applying...' : `Apply changes (${total})`}
+          {saving
+            ? t('cpq.pricing.import.preview.applying', 'Applying...')
+            : t('cpq.pricing.import.preview.apply', 'Apply changes ({count})', { count: total })}
         </Button>
         <Button type="button" variant="outline" onClick={onCancel} disabled={saving}>
-          Cancel
+          {t('cpq.common.cancel', 'Cancel')}
         </Button>
       </div>
     </div>
   )
 }
 
-function summarizeRow(r: ImportDiff['inserts'][number] | ImportDiff['updates'][number]['after']): string {
+function summarizeRow(
+  r: ImportDiff['inserts'][number] | ImportDiff['updates'][number]['after'],
+  t: TranslateFn,
+): string {
   const bits: string[] = []
-  if (r.tierNumber != null) bits.push(`tier ${r.tierNumber}`)
+  if (r.tierNumber != null) bits.push(t('cpq.pricing.import.preview.tier', 'tier {tier}', { tier: r.tierNumber }))
   if (r.rangeFrom != null || r.rangeTo != null) bits.push(`[${r.rangeFrom ?? '0'}..${r.rangeTo ?? '∞'}]`)
   for (const [k, v] of Object.entries(r.dimensionValues)) if (v) bits.push(`${k}=${v}`)
   bits.push(r.currencyCode)
@@ -112,9 +122,9 @@ function summarizeRow(r: ImportDiff['inserts'][number] | ImportDiff['updates'][n
   return bits.join(' · ')
 }
 
-function summarizeEntry(e: ImportDiff['deletes'][number]): string {
+function summarizeEntry(e: ImportDiff['deletes'][number], t: TranslateFn): string {
   const bits: string[] = []
-  if (e.tierNumber != null) bits.push(`tier ${e.tierNumber}`)
+  if (e.tierNumber != null) bits.push(t('cpq.pricing.import.preview.tier', 'tier {tier}', { tier: e.tierNumber }))
   if (e.rangeFrom != null || e.rangeTo != null) bits.push(`[${e.rangeFrom ?? '0'}..${e.rangeTo ?? '∞'}]`)
   for (const [k, v] of Object.entries(e.dimensionValues)) if (v) bits.push(`${k}=${v}`)
   bits.push(e.currencyCode)