feat(i18n): internationalize status and target type keywords across plans, goals, simulations, and approvals views

src/app/goals/page.tsx

@@ -7,6 +7,7 @@ import { useRouter } from 'next/navigation';
 import styles from './page.module.css';
 import Header from '@/components/Header';
 import { getRoleBilingualLabel } from '@/lib/roles';
+import { useLocale } from '@/lib/i18n/LocaleContext';
 
 interface User {
   id: number;
@@ -31,6 +32,7 @@ interface Goal {
 
 export default function GoalsPage() {
   const router = useRouter();
+  const { t } = useLocale();
   const [users, setUsers] = useState<User[]>([]);
   const [goals, setGoals] = useState<Goal[]>([]);
   const [isLoading, setIsLoading] = useState(true);
@@ -265,7 +267,7 @@ export default function GoalsPage() {
                         <td className={styles.td}>{g.period}</td>
                         <td className={styles.td}>
                           <span className={`${styles.badge} ${styles['badge' + g.targetType]}`}>
-                            {g.targetType}
+                            {t('targetType.' + g.targetType)}
                           </span>
                         </td>
                         <td className={styles.td} style={{ fontWeight: 'bold' }}>

src/app/plans/page.tsx

@@ -6,6 +6,7 @@ import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 import styles from './page.module.css';
 import Header from '@/components/Header';
+import { useLocale } from '@/lib/i18n/LocaleContext';
 
 interface Plan {
   id: number;
@@ -25,6 +26,7 @@ interface Plan {
 
 export default function PlansPage() {
   const router = useRouter();
+  const { t } = useLocale();
   const [plans, setPlans] = useState<Plan[]>([]);
   const [showModal, setShowModal] = useState(false);
   const [isLoading, setIsLoading] = useState(true);
@@ -159,7 +161,7 @@ export default function PlansPage() {
                   <div className={styles.cardHeader}>
                     <span className={styles.cardCode}>{plan.code}</span>
                     <span className={`${styles.badge} ${styles['badge' + plan.status]}`}>
-                      {plan.status}
+                      {t('status.' + plan.status)}
                     </span>
                   </div>
                   <h2 className={styles.cardTitle}>{plan.name}</h2>
@@ -310,8 +312,8 @@ export default function PlansPage() {
                   value={status}
                   onChange={(e) => setStatus(e.target.value)}
                 >
-                  <option value="DRAFT">Borrador (DRAFT)</option>
-                  <option value="ACTIVE">Activo (ACTIVE)</option>
+                  <option value="DRAFT">{t('status.DRAFT')}</option>
+                  <option value="ACTIVE">{t('status.ACTIVE')}</option>
                 </select>
               </div>
 

src/app/sales/simulation/page.tsx

@@ -347,7 +347,7 @@ export default function SimulationPage() {
                                 : styles.badgeRejected
                             }`}
                           >
-                            {item.main.status}
+                             {t('status.' + item.main.status)}
                           </span>
                         </td>
                       </tr>

src/app/settlements/approvals/page.tsx

@@ -5,6 +5,7 @@ import React, { useState, useEffect } from 'react';
 import styles from './page.module.css';
 import Header from '@/components/Header';
 import { useRouter } from 'next/navigation';
+import { useLocale } from '@/lib/i18n/LocaleContext';
 
 interface Settlement {
   id: number;
@@ -38,6 +39,7 @@ interface Settlement {
 
 export default function ApprovalsPage() {
   const router = useRouter();
+  const { t } = useLocale();
   const [role, setRole] = useState<string | null>(null);
   const [isLoading, setIsLoading] = useState(true);
   const [settlements, setSettlements] = useState<Settlement[]>([]);
@@ -258,7 +260,7 @@ export default function ApprovalsPage() {
                                 : styles.badgeRejected
                             }`}
                           >
-                            {s.status}
+                            {t('status.' + s.status)}
                           </span>
                           {s.rejectionReason && (
                             <div style={{ fontSize: '0.75rem', color: '#f87171', marginTop: '0.25rem' }}>

src/lib/i18n/dictionaries/en.json

@@ -29,5 +29,19 @@
     "thPayout": "Total Payout",
     "thStatus": "Status",
     "thAiAudit": "AI Audit"
+  },
+  "status": {
+    "ACTIVE": "Active",
+    "INACTIVE": "Inactive",
+    "PENDING": "Pending",
+    "SIMULATED": "Simulated",
+    "APPROVED": "Approved",
+    "REJECTED": "Rejected",
+    "DRAFT": "Draft"
+  },
+  "targetType": {
+    "INDIVIDUAL": "Individual",
+    "TEAM": "Team",
+    "HOTEL": "Hotel"
   }
 }

src/lib/i18n/dictionaries/es.json

@@ -29,5 +29,19 @@
     "thPayout": "Pago Total",
     "thStatus": "Estado",
     "thAiAudit": "Auditoría AI"
+  },
+  "status": {
+    "ACTIVE": "Activo",
+    "INACTIVE": "Inactivo",
+    "PENDING": "Pendiente",
+    "SIMULATED": "Simulado",
+    "APPROVED": "Aprobado",
+    "REJECTED": "Rechazado",
+    "DRAFT": "Borrador"
+  },
+  "targetType": {
+    "INDIVIDUAL": "Individual",
+    "TEAM": "Equipo",
+    "HOTEL": "Hotel"
   }
 }