diff --git a/frontend/components/tabs/RoadmapTab.tsx b/frontend/components/tabs/RoadmapTab.tsx index 669010c..133ba08 100644 --- a/frontend/components/tabs/RoadmapTab.tsx +++ b/frontend/components/tabs/RoadmapTab.tsx @@ -195,7 +195,7 @@ const calcularPaybackCompleto = ( meses: -1, mesesImplementacion: calcularMesesImplementacion(waves, incluyeQuickWin), mesesRecuperacion: -1, - texto: 'Ver Wave 3-4', + texto: t('roadmap.payback.seeWave34'), clase: 'text-blue-600', esRecuperable: false, tooltip: 'Esta inversión se recupera con las waves de automatización (W3-W4). ' + @@ -212,7 +212,7 @@ const calcularPaybackCompleto = ( meses: -1, mesesImplementacion: 0, mesesRecuperacion: -1, - texto: 'No recuperable', + texto: t('roadmap.payback.notRecoverable'), clase: 'text-red-600', esRecuperable: false, tooltip: 'El ahorro anual no supera los costes recurrentes. ' + @@ -251,7 +251,7 @@ const formatearPaybackResult = ( meses: 0, mesesImplementacion: mesesImpl, mesesRecuperacion: mesesRec, - texto: 'Inmediato', + texto: t('roadmap.payback.immediate'), clase: 'text-emerald-600', esRecuperable: true, tooltip: tooltipBase @@ -393,11 +393,12 @@ interface BubbleDataPoint { } // v3.5: Colores por Tier +// Note: labels are now set dynamically using t() in the component const TIER_COLORS: Record = { - 'AUTOMATE': { fill: '#059669', stroke: '#047857', label: 'Automatizar' }, - 'ASSIST': { fill: '#3B82F6', stroke: '#2563EB', label: 'Asistir' }, - 'AUGMENT': { fill: '#F59E0B', stroke: '#D97706', label: 'Optimizar' }, - 'HUMAN-ONLY': { fill: '#EF4444', stroke: '#DC2626', label: 'Humano' } + 'AUTOMATE': { fill: '#059669', stroke: '#047857', label: '' }, + 'ASSIST': { fill: '#3B82F6', stroke: '#2563EB', label: '' }, + 'AUGMENT': { fill: '#F59E0B', stroke: '#D97706', label: '' }, + 'HUMAN-ONLY': { fill: '#EF4444', stroke: '#DC2626', label: '' } }; // v3.6: Constantes CPI para cálculo de ahorro TCO @@ -1761,9 +1762,9 @@ export function RoadmapTab({ data }: RoadmapTabProps) { const waves: WaveData[] = [ { id: 'wave1', - nombre: 'Wave 1', - titulo: 'FOUNDATION', - trimestre: 'Q1-Q2 2026', + nombre: t('roadmap.waves.wave1Name'), + titulo: t('roadmap.waves.wave1Title'), + trimestre: t('roadmap.waves.wave1Quarter'), tipo: 'consulting', icon: , color: 'text-gray-600', @@ -1773,30 +1774,34 @@ export function RoadmapTab({ data }: RoadmapTabProps) { costoRecurrenteAnual: 0, ahorroAnual: 0, // Wave habilitadora esCondicional: false, - porQueNecesario: `${tierCounts['HUMAN-ONLY'].length + tierCounts.AUGMENT.length} de ${allQueues.length} colas están en Tier 3-4 (${Math.round((wave1Volume / totalVolume) * 100)}% del volumen). Red flags: CV >75%, Transfer >20%. Automatizar sin estandarizar = fracaso garantizado.`, + porQueNecesario: t('roadmap.porQueNecesarioTemplates.wave1', { + count: tierCounts['HUMAN-ONLY'].length + tierCounts.AUGMENT.length, + total: allQueues.length, + pct: Math.round((wave1Volume / totalVolume) * 100) + }), skills: wave1Queues.length > 0 ? [...new Set(drilldownData.filter(s => s.originalQueues.some(q => q.tier === 'HUMAN-ONLY' || q.tier === 'AUGMENT')).map(s => s.skill))].slice(0, 5) : skillsNeedStandardization.map(s => s.skill).slice(0, 5), iniciativas: [ - { nombre: 'Análisis de variabilidad y red flags', setup: 15000, recurrente: 0, kpi: 'Mapear causas de CV >75% y Transfer >20%' }, - { nombre: 'Rediseño y documentación de procesos', setup: 20000, recurrente: 0, kpi: 'Scripts estandarizados para 80% casuística' }, - { nombre: 'Training y certificación de agentes', setup: 12000, recurrente: 0, kpi: 'Certificación 90% agentes, adherencia >85%' } + { nombre: t('roadmap.initiatives.wave1Init1'), setup: 15000, recurrente: 0, kpi: t('roadmap.initiatives.wave1Init1Kpi') }, + { nombre: t('roadmap.initiatives.wave1Init2'), setup: 20000, recurrente: 0, kpi: t('roadmap.initiatives.wave1Init2Kpi') }, + { nombre: t('roadmap.initiatives.wave1Init3'), setup: 12000, recurrente: 0, kpi: t('roadmap.initiatives.wave1Init3Kpi') } ], criteriosExito: [ - `CV AHT ≤75% en al menos ${Math.max(3, Math.ceil(wave1Queues.length * 0.3))} colas de alto volumen`, - 'Transfer ≤20% global', - 'Red flags eliminados en colas prioritarias', - `Al menos ${Math.ceil(wave1Queues.length * 0.2)} colas migran de Tier 4 → Tier 3` + t('roadmap.successCriteriaTemplates.wave1Criterion1', { count: Math.max(3, Math.ceil(wave1Queues.length * 0.3)) }), + t('roadmap.successCriteriaTemplates.wave1Criterion2'), + t('roadmap.successCriteriaTemplates.wave1Criterion3'), + t('roadmap.successCriteriaTemplates.wave1Criterion4', { count: Math.ceil(wave1Queues.length * 0.2) }) ], riesgo: 'bajo', - riesgoDescripcion: 'Consultoría con entregables tangibles. No requiere tecnología.', - proveedor: 'Beyond Consulting o tercero especializado' + riesgoDescripcion: t('roadmap.waves.wave1RiskDescription'), + proveedor: t('roadmap.waves.wave1Provider') }, { id: 'wave2', - nombre: 'Wave 2', - titulo: 'AUGMENT', - trimestre: 'Q3 2026', + nombre: t('roadmap.waves.wave2Name'), + titulo: t('roadmap.waves.wave2Title'), + trimestre: t('roadmap.waves.wave2Quarter'), tipo: 'beyond_consulting', icon: , color: 'text-amber-600', @@ -1806,30 +1811,33 @@ export function RoadmapTab({ data }: RoadmapTabProps) { costoRecurrenteAnual: 40000, ahorroAnual: potentialSavings.AUGMENT, // 15% efficiency - calculado desde datos reales esCondicional: true, - condicion: 'Requiere CV ≤75% post-Wave 1 en colas target', - porQueNecesario: `Implementar herramientas de soporte para colas Tier 3 (Score 3.5-5.5). Objetivo: elevar score a ≥5.5 para habilitar Wave 3. Foco en ${tierCounts.AUGMENT.length} colas con ${tierVolumes.AUGMENT.toLocaleString()} int/mes.`, + condicion: t('roadmap.waves.wave2Condition'), + porQueNecesario: t('roadmap.porQueNecesarioTemplates.wave2', { + count: tierCounts.AUGMENT.length, + volume: tierVolumes.AUGMENT.toLocaleString() + }), skills: tierCounts.AUGMENT.length > 0 ? [...new Set(drilldownData.filter(s => s.originalQueues.some(q => q.tier === 'AUGMENT')).map(s => s.skill))].slice(0, 4) - : ['Colas que alcancen Score 3.5-5.5 post Wave 1'], + : [t('roadmap.fallbackSkills.wave1')], iniciativas: [ - { nombre: 'Knowledge Base contextual', setup: 20000, recurrente: 2000, kpi: 'Hold time -25%, uso KB +40%' }, - { nombre: 'Scripts dinámicos con IA', setup: 15000, recurrente: 1500, kpi: 'Adherencia scripts +30%' } + { nombre: t('roadmap.initiatives.wave2Init1'), setup: 20000, recurrente: 2000, kpi: t('roadmap.initiatives.wave2Init1Kpi') }, + { nombre: t('roadmap.initiatives.wave2Init2'), setup: 15000, recurrente: 1500, kpi: t('roadmap.initiatives.wave2Init2Kpi') } ], criteriosExito: [ - 'Score promedio sube de 3.5-5.5 → ≥5.5', - 'AHT -15% vs baseline', - 'CV ≤90% en colas target', - `${Math.ceil(tierCounts.AUGMENT.length * 0.5)} colas migran de Tier 3 → Tier 2` + t('roadmap.successCriteriaTemplates.wave2Criterion1'), + t('roadmap.successCriteriaTemplates.wave2Criterion2'), + t('roadmap.successCriteriaTemplates.wave2Criterion3'), + t('roadmap.successCriteriaTemplates.wave2Criterion4', { count: Math.ceil(tierCounts.AUGMENT.length * 0.5) }) ], riesgo: 'bajo', - riesgoDescripcion: 'Herramientas de soporte, bajo riesgo de integración.', - proveedor: 'BEYOND (KB + Scripts IA)' + riesgoDescripcion: t('roadmap.waves.wave2RiskDescription'), + proveedor: t('roadmap.waves.wave2Provider') }, { id: 'wave3', - nombre: 'Wave 3', - titulo: 'ASSIST', - trimestre: 'Q4 2026', + nombre: t('roadmap.waves.wave3Name'), + titulo: t('roadmap.waves.wave3Title'), + trimestre: t('roadmap.waves.wave3Quarter'), tipo: 'beyond', icon: , color: 'text-blue-600', @@ -1839,31 +1847,34 @@ export function RoadmapTab({ data }: RoadmapTabProps) { costoRecurrenteAnual: 78000, ahorroAnual: potentialSavings.ASSIST, // 30% efficiency - calculado desde datos reales esCondicional: true, - condicion: 'Requiere Score ≥5.5 Y CV ≤90% Y Transfer ≤30%', - porQueNecesario: `Copilot IA para agentes en colas Tier 2. Sugerencias en tiempo real, autocompletado, next-best-action. Objetivo: elevar score a ≥7.5 para Wave 4. Target: ${tierCounts.ASSIST.length} colas con ${tierVolumes.ASSIST.toLocaleString()} int/mes.`, + condicion: t('roadmap.waves.wave3Condition'), + porQueNecesario: t('roadmap.porQueNecesarioTemplates.wave3', { + count: tierCounts.ASSIST.length, + volume: tierVolumes.ASSIST.toLocaleString() + }), skills: tierCounts.ASSIST.length > 0 ? [...new Set(drilldownData.filter(s => s.originalQueues.some(q => q.tier === 'ASSIST')).map(s => s.skill))].slice(0, 4) - : ['Colas que alcancen Score ≥5.5 post Wave 2'], + : [t('roadmap.fallbackSkills.wave2')], iniciativas: [ - { nombre: 'Agent Assist / Copilot IA', setup: 45000, recurrente: 4500, kpi: 'AHT -30%, sugerencias aceptadas >60%' }, - { nombre: 'Automatización parcial (FAQs, routing)', setup: 25000, recurrente: 3000, kpi: 'Deflection rate 15%' } + { nombre: t('roadmap.initiatives.wave3Init1'), setup: 45000, recurrente: 4500, kpi: t('roadmap.initiatives.wave3Init1Kpi') }, + { nombre: t('roadmap.initiatives.wave3Init2'), setup: 25000, recurrente: 3000, kpi: t('roadmap.initiatives.wave3Init2Kpi') } ], criteriosExito: [ - 'Score promedio sube de 5.5-7.5 → ≥7.5', - 'AHT -30% vs baseline Wave 2', - 'CV ≤75% en colas target', - 'Transfer ≤20%', - `${Math.ceil(tierCounts.ASSIST.length * 0.4)} colas migran de Tier 2 → Tier 1` + t('roadmap.successCriteriaTemplates.wave3Criterion1'), + t('roadmap.successCriteriaTemplates.wave3Criterion2'), + t('roadmap.successCriteriaTemplates.wave3Criterion3'), + t('roadmap.successCriteriaTemplates.wave3Criterion4'), + t('roadmap.successCriteriaTemplates.wave3Criterion5', { count: Math.ceil(tierCounts.ASSIST.length * 0.4) }) ], riesgo: 'medio', - riesgoDescripcion: 'Integración con plataforma contact center. Piloto 4 semanas mitiga.', - proveedor: 'BEYOND (Copilot + Routing IA)' + riesgoDescripcion: t('roadmap.waves.wave3RiskDescription'), + proveedor: t('roadmap.waves.wave3Provider') }, { id: 'wave4', - nombre: 'Wave 4', - titulo: 'AUTOMATE', - trimestre: 'Q1-Q2 2027', + nombre: t('roadmap.waves.wave4Name'), + titulo: t('roadmap.waves.wave4Title'), + trimestre: t('roadmap.waves.wave4Quarter'), tipo: 'beyond', icon: , color: 'text-emerald-600', @@ -1873,24 +1884,27 @@ export function RoadmapTab({ data }: RoadmapTabProps) { costoRecurrenteAnual: 108000, ahorroAnual: potentialSavings.AUTOMATE, // 70% containment - calculado desde datos reales esCondicional: true, - condicion: 'Requiere Score ≥7.5 Y CV ≤75% Y Transfer ≤20% Y FCR ≥50%', - porQueNecesario: `Automatización end-to-end para colas Tier 1. Voicebot/Chatbot transaccional con 70% contención. Solo viable con procesos maduros. Target actual: ${tierCounts.AUTOMATE.length} colas con ${tierVolumes.AUTOMATE.toLocaleString()} int/mes.`, + condicion: t('roadmap.waves.wave4Condition'), + porQueNecesario: t('roadmap.porQueNecesarioTemplates.wave4', { + count: tierCounts.AUTOMATE.length, + volume: tierVolumes.AUTOMATE.toLocaleString() + }), skills: tierCounts.AUTOMATE.length > 0 ? [...new Set(drilldownData.filter(s => s.originalQueues.some(q => q.tier === 'AUTOMATE')).map(s => s.skill))].slice(0, 4) - : ['Colas que alcancen Score ≥7.5 post Wave 3'], + : [t('roadmap.fallbackSkills.wave3')], iniciativas: [ - { nombre: 'Voicebot/Chatbot transaccional', setup: 55000, recurrente: 6000, kpi: 'Contención 70%+, CSAT ≥4/5' }, - { nombre: 'IVR inteligente con NLU', setup: 30000, recurrente: 3000, kpi: 'Pre-calificación 80%+, transferencia warm' } + { nombre: t('roadmap.initiatives.wave4Init1'), setup: 55000, recurrente: 6000, kpi: t('roadmap.initiatives.wave4Init1Kpi') }, + { nombre: t('roadmap.initiatives.wave4Init2'), setup: 30000, recurrente: 3000, kpi: t('roadmap.initiatives.wave4Init2Kpi') } ], criteriosExito: [ - 'Contención ≥70% en colas automatizadas', - 'CSAT se mantiene o mejora (≥4/5)', - 'Escalado a humano <30%', - 'ROI acumulado >300%' + t('roadmap.successCriteriaTemplates.wave4Criterion1'), + t('roadmap.successCriteriaTemplates.wave4Criterion2'), + t('roadmap.successCriteriaTemplates.wave4Criterion3'), + t('roadmap.successCriteriaTemplates.wave4Criterion4') ], riesgo: 'alto', - riesgoDescripcion: 'Muy condicional. Requiere éxito demostrado en Waves 1-3.', - proveedor: 'BEYOND (Voicebot + IVR + Chatbot)' + riesgoDescripcion: t('roadmap.waves.wave4RiskDescription'), + proveedor: t('roadmap.waves.wave4Provider') } ]; @@ -1968,8 +1982,8 @@ export function RoadmapTab({ data }: RoadmapTabProps) { const escenarios: EscenarioData[] = [ { id: 'conservador', - nombre: 'Conservador', - descripcion: 'FOUNDATION + AUGMENT (Wave 1-2)', + nombre: t('roadmap.scenarios.conservativeName'), + descripcion: t('roadmap.scenarios.conservativeDesc'), waves: ['wave1', 'wave2'], inversionTotal: consInversion, costoRecurrenteAnual: consRec, @@ -1993,8 +2007,8 @@ export function RoadmapTab({ data }: RoadmapTabProps) { }, { id: 'moderado', - nombre: 'Moderado', - descripcion: 'FOUNDATION + AUGMENT + ASSIST (Wave 1-3)', + nombre: t('roadmap.scenarios.moderateName'), + descripcion: t('roadmap.scenarios.moderateDesc'), waves: ['wave1', 'wave2', 'wave3'], inversionTotal: modInversion, costoRecurrenteAnual: modRec, @@ -2018,8 +2032,8 @@ export function RoadmapTab({ data }: RoadmapTabProps) { }, { id: 'agresivo', - nombre: 'Agresivo', - descripcion: 'Roadmap completo (Wave 1-4)', + nombre: t('roadmap.scenarios.aggressiveName'), + descripcion: t('roadmap.scenarios.aggressiveDesc'), waves: ['wave1', 'wave2', 'wave3', 'wave4'], inversionTotal: agrInversion, costoRecurrenteAnual: agrRec,