Merge pull request #9 from sujucu70/claude/check-agent-readiness-status-Exnpc

Claude/check agent readiness status exnpc

frontend/components/tabs/AgenticReadinessTab.tsx

@@ -2163,7 +2163,7 @@ function ExpandableSkillRow({
                     {dataPoint.originalQueues.map((queue, queueIdx) => {
                       const queueMonthlySavings = queue.annualCost ? Math.round(queue.annualCost * 0.35 / 12) : 0;
                       const tierStyle = getTierStyle(queue.tier);
-                      const redFlags = detectRedFlags(queue);
+                      const redFlags = detectRedFlags(queue, redFlagConfigs);
 
                       return (
                         <tr
@@ -2555,7 +2555,7 @@ function HumanOnlyByReasonSection({ drilldownData }: { drilldownData: DrilldownD
   const queuesByReason: Record<string, typeof allHumanOnlyQueues> = {};
 
   allHumanOnlyQueues.forEach(queue => {
-    const flags = detectRedFlags(queue);
+    const flags = detectRedFlags(queue, redFlagConfigs);
     // Determinar razón principal (prioridad: cv_high > transfer_high > volume_low > valid_low)
     let reason = 'Sin Red Flags específicos';
     let reasonId = 'no_flags';
@@ -2579,7 +2579,7 @@ function HumanOnlyByReasonSection({ drilldownData }: { drilldownData: DrilldownD
   // Convertir a array y ordenar por volumen
   const reasonGroups = Object.entries(queuesByReason)
     .map(([reasonId, queues]) => {
-      const flagConfig = RED_FLAG_CONFIGS.find(c => c.id === reasonId);
+      const flagConfig = redFlagConfigs.find(c => c.id === reasonId);
       return {
         reasonId,
         reason: flagConfig?.label || 'Sin Red Flags específicos',
@@ -2719,7 +2719,7 @@ function HumanOnlyByReasonSection({ drilldownData }: { drilldownData: DrilldownD
                             </thead>
                             <tbody className="divide-y divide-gray-100 bg-white">
                               {group.queues.slice(0, 20).map((queue) => {
-                                const flags = detectRedFlags(queue);
+                                const flags = detectRedFlags(queue, redFlagConfigs);
                                 return (
                                   <tr key={queue.original_queue_id} className="hover:bg-gray-50">
                                     <td className="px-4 py-2 font-medium text-gray-700 truncate max-w-[180px]" title={queue.original_queue_id}>
@@ -2947,7 +2947,7 @@ function HumanOnlyRedFlagsSection({ drilldownData }: { drilldownData: DrilldownD
   // Colas con red flags (la mayoría de HUMAN-ONLY tendrán red flags por definición)
   const queuesWithFlags = humanOnlyQueues.map(q => ({
     queue: q,
-    flags: detectRedFlags(q)
+    flags: detectRedFlags(q, redFlagConfigs)
   })).filter(qf => qf.flags.length > 0);
 
   // Ordenar por volumen (mayor primero para priorizar)
@@ -2970,7 +2970,7 @@ function HumanOnlyRedFlagsSection({ drilldownData }: { drilldownData: DrilldownD
   const pctCosteRedFlags = costeAnualTotal > 0 ? (costeAnualRedFlags / costeAnualTotal) * 100 : 0;
 
   // Estadísticas detalladas por tipo de red flag
-  const flagStats = RED_FLAG_CONFIGS.map(config => {
+  const flagStats = redFlagConfigs.map(config => {
     const matchingQueues = queuesWithFlags.filter(qf =>
       qf.flags.some(f => f.config.id === config.id)
     );
@@ -3625,6 +3625,9 @@ function RoadmapConnectionSection({ drilldownData }: { drilldownData: DrilldownD
 }
 
 export function AgenticReadinessTab({ data, onTabChange }: AgenticReadinessTabProps) {
+  const { t } = useTranslation();
+  const redFlagConfigs = getRedFlagConfigs(t);
+
   // Debug: Log drilldown data status
   console.log('🔍 AgenticReadinessTab - drilldownData:', {
     exists: !!data.drilldownData,

frontend/components/tabs/RoadmapTab.tsx

@@ -187,7 +187,8 @@ const calcularPaybackCompleto = (
   ahorroAnual: number,
   waves: string[],
   esHabilitador: boolean,
-  incluyeQuickWin: boolean
+  incluyeQuickWin: boolean,
+  t: any
 ): PaybackInfo => {
   // 1. Caso especial: escenario habilitador con poco ahorro directo
   if (esHabilitador || ahorroAnual < inversion * 0.1) {
@@ -230,7 +231,7 @@ const calcularPaybackCompleto = (
   const paybackTotal = mesesImplementacion + mesesRecuperacion;
 
   // 7. Formatear resultado según duración
-  return formatearPaybackResult(paybackTotal, mesesImplementacion, mesesRecuperacion, margenMensual, inversion);
+  return formatearPaybackResult(paybackTotal, mesesImplementacion, mesesRecuperacion, margenMensual, inversion, t);
 };
 
 /**
@@ -241,7 +242,8 @@ const formatearPaybackResult = (
   mesesImpl: number,
   mesesRec: number,
   margenMensual: number,
-  inversion: number
+  inversion: number,
+  t: any
 ): PaybackInfo => {
   const tooltipBase = `Implementación: ${mesesImpl} meses → Recuperación: ${mesesRec} meses. ` +
                      `Margen: ${formatCurrency(margenMensual * 12)}/año.`;
@@ -1966,17 +1968,17 @@ export function RoadmapTab({ data }: RoadmapTabProps) {
   // v3.9: Calcular payback completo para cada escenario
   const consPaybackInfo = calcularPaybackCompleto(
     consInversion, consMargen, consSavings,
-    ['wave1', 'wave2'], consEsHabilitador, false
+    ['wave1', 'wave2'], consEsHabilitador, false, t
   );
   const modPaybackInfo = calcularPaybackCompleto(
     modInversion, modMargen, modSavings,
-    ['wave1', 'wave2', 'wave3'], modEsHabilitador, false
+    ['wave1', 'wave2', 'wave3'], modEsHabilitador, false, t
   );
   // Agresivo incluye Wave 4 (Quick Wins potenciales si hay AUTOMATE queues)
   const agrIncluyeQuickWin = tierCounts.AUTOMATE.length >= 3;
   const agrPaybackInfo = calcularPaybackCompleto(
     agrInversion, agrMargen, agrSavings,
-    ['wave1', 'wave2', 'wave3', 'wave4'], agrEsHabilitador, agrIncluyeQuickWin
+    ['wave1', 'wave2', 'wave3', 'wave4'], agrEsHabilitador, agrIncluyeQuickWin, t
   );
 
   const escenarios: EscenarioData[] = [