feat: wire i18n to dashboard, settings, users — complete locale files

DashboardPage, SettingsPage, UserListPage now use useTranslation().
fr/es/pt locale files expanded with dashboard, analytics, users,
contacts, settings, crm, knowledge sections.
Sidebar was already translated; main content pages now follow.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

apps/admin/src/locales/es.json

@@ -10,20 +10,205 @@
     "cancel": "Cancelar",
     "loading": "Cargando...",
     "error": "Ocurrió un error",
-    "success": "Éxito"
+    "success": "Éxito",
+    "create": "Crear",
+    "delete": "Eliminar",
+    "edit": "Editar",
+    "search": "Buscar...",
+    "actions": "Acciones",
+    "export": "Exportar",
+    "sync": "Sincronizar",
+    "send": "Enviar",
+    "close": "Cerrar",
+    "confirm": "Confirmar",
+    "back": "Atrás",
+    "next": "Siguiente",
+    "yes": "Sí",
+    "no": "No",
+    "status": "Estado",
+    "date": "Fecha",
+    "name": "Nombre",
+    "email": "Correo",
+    "phone": "Teléfono",
+    "day": "Día",
+    "none": "Ninguno"
+  },
+  "nav": {
+    "home": "Inicio",
+    "inbox": "Bandeja de entrada",
+    "campaigns": "Campañas",
+    "templates": "Plantillas",
+    "organizations": "Organizaciones",
+    "users": "Usuarios",
+    "training": "Training Lab",
+    "moderation": "Moderación",
+    "b2b": "Clientes B2B"
+  },
+  "dashboard": {
+    "title": "Tablero",
+    "subtitle": "Estado de tu plataforma en tiempo real",
+    "select_org": "Bienvenido a EdTech Admin",
+    "select_org_hint": "Para empezar, selecciona una organización en el menú de la izquierda.",
+    "isolation_note": "El aislamiento de datos garantiza que solo ves las estadísticas de la organización activa.",
+    "loading": "Analizando datos...",
+    "no_enrollments": "Sin inscripciones",
+    "recent_enrollments": "Inscripciones recientes",
+    "export_csv": "Exportar CSV",
+    "stats": {
+      "users": "Usuarios",
+      "active": "Activos",
+      "completed": "Completados",
+      "tracks": "Cursos",
+      "revenue": "Ingresos",
+      "total_messages": "Mensajes Totales",
+      "active_users": "Usuarios Activos",
+      "completion_rate": "Tasa de Finalización",
+      "ai_cost": "Costo IA estimado"
+    },
+    "table": {
+      "phone": "Teléfono",
+      "track": "Curso",
+      "status": "Estado",
+      "day": "Día",
+      "date": "Fecha"
+    }
+  },
+  "analytics": {
+    "title": "Análisis y Rendimiento",
+    "export": "Exportar informe",
+    "explain": "Explicar",
+    "messages": {
+      "title": "Volumen de Mensajes",
+      "inbound": "Entrantes",
+      "outbound": "Salientes"
+    },
+    "completion": {
+      "title": "Tasa de Éxito",
+      "completed": "Completados",
+      "in_progress": "En progreso"
+    },
+    "performance": {
+      "title": "Rendimiento",
+      "avg_score": "Puntuación media de ejercicios"
+    },
+    "engagement": {
+      "title": "Compromiso",
+      "avg_days": "Días de formación en promedio"
+    }
+  },
+  "users": {
+    "title": "Gestión de Usuarios",
+    "subtitle": "Todos los estudiantes inscritos",
+    "no_users": "No se encontraron usuarios",
+    "invite": "Invitar",
+    "columns": {
+      "name": "Nombre",
+      "phone": "Teléfono",
+      "track": "Curso activo",
+      "day": "Día",
+      "status": "Estado",
+      "joined": "Inscripción"
+    }
+  },
+  "contacts": {
+    "title": "Contactos",
+    "subtitle": "Gestión de tu base de contactos CRM",
+    "add": "Agregar contacto",
+    "import": "Importar",
+    "no_contacts": "Sin contactos",
+    "search_placeholder": "Buscar un contacto..."
+  },
+  "settings": {
+    "title": "Configuración",
+    "profile": "Perfil de la organización",
+    "branding": "Marca y Colores",
+    "ai_config": "Configuración IA",
+    "whatsapp_config": "Configuración WhatsApp",
+    "billing": "Facturación",
+    "org_name": "Nombre de la organización",
+    "primary_color": "Color principal",
+    "logo_url": "URL del logo",
+    "save_success": "Configuración guardada con éxito.",
+    "save_error": "No se pudo guardar la configuración.",
+    "no_org_selected": "Por favor selecciona una organización."
   },
   "onboarding": {
     "title": "Bienvenido a Xamlé.Studio",
     "subtitle": "Configuremos tu escuela en unos segundos.",
+    "step_welcome": "Bienvenida",
+    "step_legal": "Contrato",
+    "step_whatsapp": "WhatsApp",
+    "step_ai": "IA",
     "connect_fb": "Conectar con Facebook",
     "fb_connected": "¡Cuenta de Facebook conectada!",
-    "setup_waba": "Configurando tu cuenta de WhatsApp Business..."
+    "setup_waba": "Configurando tu cuenta de WhatsApp Business...",
+    "cta_launch": "Lanzar mi plataforma",
+    "legal_text": "Al aceptar, aceptas nuestros términos de socio y las políticas comerciales de Meta."
   },
-  "nav": {
-    "home": "Inicio",
-    "inbox": "Bandeja de entrada",
-    "campaigns": "Campañas",
-    "templates": "Plantillas",
-    "organizations": "Organizaciones"
+  "crm": {
+    "stats": {
+      "total_contacts": "Contactos Totales",
+      "messages_sent": "Mensajes Enviados",
+      "open_rate": "Tasa de apertura",
+      "conversion": "Conversión"
+    },
+    "inbox": {
+      "title": "Conversaciones",
+      "no_messages": "No se encontraron conversaciones.",
+      "reply_placeholder": "Tu mensaje...",
+      "send": "Enviar"
+    },
+    "campaigns": {
+      "title": "Historial de Campañas",
+      "subtitle": "Sigue todas tus transmisiones y su rendimiento.",
+      "new_campaign": "Nueva Campaña",
+      "select_template": "Plantilla WhatsApp (Opcional)",
+      "choose_approved": "Selecciona una plantilla aprobada...",
+      "no_approved_templates": "No hay plantillas aprobadas. Sincroniza primero.",
+      "use_ai_text": "Usar texto generado por IA",
+      "status_sent": "Enviado",
+      "status_delivered": "Entregado",
+      "status_read": "Leído",
+      "status_failed": "Fallido"
+    }
+  },
+  "whatsapp": {
+    "templates": {
+      "title": "Plantillas de Mensajes WhatsApp",
+      "subtitle": "Gestiona y sincroniza tus plantillas aprobadas por Meta.",
+      "sync_button": "Sincronizar con Meta",
+      "create_button": "Crear plantilla",
+      "no_templates": "No hay plantillas. Sincroniza o crea una.",
+      "table": {
+        "name": "Nombre de plantilla",
+        "category": "Categoría",
+        "language": "Idioma",
+        "status": "Estado"
+      },
+      "create_modal": {
+        "title": "Crear nueva plantilla",
+        "name_label": "Nombre (minúsculas, sin espacios)",
+        "category_label": "Categoría",
+        "language_label": "Idioma",
+        "body_label": "Texto del cuerpo",
+        "submit": "Enviar para aprobación",
+        "success": "¡Plantilla enviada con éxito!",
+        "error": "Error al enviar la plantilla."
+      }
+    }
+  },
+  "knowledge": {
+    "title": "Base de Conocimiento",
+    "subtitle": "Gestiona los documentos de tu IA",
+    "upload": "Agregar documento",
+    "no_documents": "No hay documentos indexados."
+  },
+  "training": {
+    "title": "Training Lab",
+    "subtitle": "Prueba y mejora tu IA pedagógica"
+  },
+  "ai_setup": {
+    "title": "Configuración del Agente IA",
+    "save": "Guardar configuración"
   }
 }

apps/admin/src/locales/fr.json

@@ -10,20 +10,205 @@
     "cancel": "Annuler",
     "loading": "Chargement...",
     "error": "Une erreur est survenue",
-    "success": "Succès"
+    "success": "Succès",
+    "create": "Créer",
+    "delete": "Supprimer",
+    "edit": "Modifier",
+    "search": "Rechercher...",
+    "actions": "Actions",
+    "export": "Exporter",
+    "sync": "Synchroniser",
+    "send": "Envoyer",
+    "close": "Fermer",
+    "confirm": "Confirmer",
+    "back": "Retour",
+    "next": "Suivant",
+    "yes": "Oui",
+    "no": "Non",
+    "status": "Statut",
+    "date": "Date",
+    "name": "Nom",
+    "email": "Email",
+    "phone": "Téléphone",
+    "day": "Jour",
+    "none": "Aucun"
+  },
+  "nav": {
+    "home": "Accueil",
+    "inbox": "Messagerie",
+    "campaigns": "Campagnes",
+    "templates": "Modèles",
+    "organizations": "Organisations",
+    "users": "Utilisateurs",
+    "training": "Training Lab",
+    "moderation": "Modération",
+    "b2b": "Clients B2B"
+  },
+  "dashboard": {
+    "title": "Tableau de Bord",
+    "subtitle": "Statut de votre plateforme en temps réel",
+    "select_org": "Bienvenue sur EdTech Admin",
+    "select_org_hint": "Pour commencer, veuillez sélectionner une organisation dans le menu déroulant à gauche.",
+    "isolation_note": "L'isolation des données garantit que vous ne voyez que les statistiques de l'organisation active.",
+    "loading": "Analyse des données en cours...",
+    "no_enrollments": "Aucune inscription",
+    "recent_enrollments": "Inscriptions récentes",
+    "export_csv": "Exporter CSV",
+    "stats": {
+      "users": "Utilisateurs",
+      "active": "Actifs",
+      "completed": "Complétés",
+      "tracks": "Parcours",
+      "revenue": "Revenus",
+      "total_messages": "Messages Totaux",
+      "active_users": "Utilisateurs Actifs",
+      "completion_rate": "Taux de Complétion",
+      "ai_cost": "Estimation Coût IA"
+    },
+    "table": {
+      "phone": "Téléphone",
+      "track": "Parcours",
+      "status": "Statut",
+      "day": "Jour",
+      "date": "Date"
+    }
+  },
+  "analytics": {
+    "title": "Analyses & Performance",
+    "export": "Exporter le rapport",
+    "explain": "Expliquer",
+    "messages": {
+      "title": "Volume des Messages",
+      "inbound": "Entrants",
+      "outbound": "Sortants"
+    },
+    "completion": {
+      "title": "Taux de Réussite",
+      "completed": "Complétés",
+      "in_progress": "En cours"
+    },
+    "performance": {
+      "title": "Performance",
+      "avg_score": "Score moyen des exercices"
+    },
+    "engagement": {
+      "title": "Engagement",
+      "avg_days": "Jours de formation en moyenne"
+    }
+  },
+  "users": {
+    "title": "Gestion des Utilisateurs",
+    "subtitle": "Tous les apprenants inscrits",
+    "no_users": "Aucun utilisateur trouvé",
+    "invite": "Inviter",
+    "columns": {
+      "name": "Nom",
+      "phone": "Téléphone",
+      "track": "Parcours actif",
+      "day": "Jour",
+      "status": "Statut",
+      "joined": "Inscription"
+    }
+  },
+  "contacts": {
+    "title": "Contacts",
+    "subtitle": "Gestion de votre base de contacts CRM",
+    "add": "Ajouter un contact",
+    "import": "Importer",
+    "no_contacts": "Aucun contact",
+    "search_placeholder": "Rechercher un contact..."
+  },
+  "settings": {
+    "title": "Paramètres",
+    "profile": "Profil de l'organisation",
+    "branding": "Marque & Couleurs",
+    "ai_config": "Configuration IA",
+    "whatsapp_config": "Configuration WhatsApp",
+    "billing": "Facturation",
+    "org_name": "Nom de l'organisation",
+    "primary_color": "Couleur principale",
+    "logo_url": "URL du logo",
+    "save_success": "Paramètres enregistrés avec succès.",
+    "save_error": "Impossible d'enregistrer les paramètres.",
+    "no_org_selected": "Veuillez sélectionner une organisation."
   },
   "onboarding": {
     "title": "Bienvenue sur Xamlé.Studio",
     "subtitle": "Configurons votre école en quelques secondes.",
+    "step_welcome": "Bienvenue",
+    "step_legal": "Contrat",
+    "step_whatsapp": "WhatsApp",
+    "step_ai": "IA",
     "connect_fb": "Se connecter avec Facebook",
     "fb_connected": "Compte Facebook connecté !",
-    "setup_waba": "Configuration de votre compte WhatsApp Business..."
+    "setup_waba": "Configuration de votre compte WhatsApp Business...",
+    "cta_launch": "Lancer ma plateforme",
+    "legal_text": "En acceptant, vous acceptez nos conditions de partenaire et les politiques commerciales de Meta."
   },
-  "nav": {
-    "home": "Accueil",
-    "inbox": "Messagerie",
-    "campaigns": "Campagnes",
-    "templates": "Modèles",
-    "organizations": "Organisations"
+  "crm": {
+    "stats": {
+      "total_contacts": "Contacts Totaux",
+      "messages_sent": "Messages Envoyés",
+      "open_rate": "Taux d'ouverture",
+      "conversion": "Conversion"
+    },
+    "inbox": {
+      "title": "Conversations",
+      "no_messages": "Aucune conversation trouvée.",
+      "reply_placeholder": "Votre message...",
+      "send": "Envoyer"
+    },
+    "campaigns": {
+      "title": "Historique des Campagnes",
+      "subtitle": "Suivez toutes vos diffusions et leurs performances.",
+      "new_campaign": "Nouvelle Campagne",
+      "select_template": "Modèle WhatsApp (Optionnel)",
+      "choose_approved": "Sélectionner un modèle approuvé...",
+      "no_approved_templates": "Aucun modèle approuvé. Synchronisez d'abord.",
+      "use_ai_text": "Utiliser le texte généré par IA",
+      "status_sent": "Envoyé",
+      "status_delivered": "Livré",
+      "status_read": "Lu",
+      "status_failed": "Échec"
+    }
+  },
+  "whatsapp": {
+    "templates": {
+      "title": "Modèles de Messages WhatsApp",
+      "subtitle": "Gérez et synchronisez vos modèles approuvés par Meta.",
+      "sync_button": "Synchroniser avec Meta",
+      "create_button": "Créer un modèle",
+      "no_templates": "Aucun modèle. Synchronisez ou créez-en un.",
+      "table": {
+        "name": "Nom du modèle",
+        "category": "Catégorie",
+        "language": "Langue",
+        "status": "Statut"
+      },
+      "create_modal": {
+        "title": "Créer un nouveau modèle",
+        "name_label": "Nom du modèle (minuscules, sans espaces)",
+        "category_label": "Catégorie",
+        "language_label": "Langue",
+        "body_label": "Texte du corps",
+        "submit": "Soumettre pour approbation",
+        "success": "Modèle soumis avec succès !",
+        "error": "Échec de la soumission."
+      }
+    }
+  },
+  "knowledge": {
+    "title": "Base de Connaissances",
+    "subtitle": "Gérez les documents de votre IA",
+    "upload": "Ajouter un document",
+    "no_documents": "Aucun document indexé."
+  },
+  "training": {
+    "title": "Training Lab",
+    "subtitle": "Testez et affinez votre IA pédagogique"
+  },
+  "ai_setup": {
+    "title": "Configuration de l'Agent IA",
+    "save": "Enregistrer la configuration"
   }
 }

apps/admin/src/locales/pt.json

@@ -6,24 +6,209 @@
     "analytics": "Análises",
     "settings": "Configurações",
     "logout": "Sair",
-    "save": "Salvar",
+    "save": "Guardar",
     "cancel": "Cancelar",
     "loading": "Carregando...",
     "error": "Ocorreu um erro",
-    "success": "Sucesso"
-  },
-  "onboarding": {
-    "title": "Bem-vindo ao Xamlé.Studio",
-    "subtitle": "Vamos configurar sua escola em alguns segundos.",
-    "connect_fb": "Conectar com Facebook",
-    "fb_connected": "Conta do Facebook conectada!",
-    "setup_waba": "Configurando sua conta do WhatsApp Business..."
+    "success": "Sucesso",
+    "create": "Criar",
+    "delete": "Excluir",
+    "edit": "Editar",
+    "search": "Pesquisar...",
+    "actions": "Ações",
+    "export": "Exportar",
+    "sync": "Sincronizar",
+    "send": "Enviar",
+    "close": "Fechar",
+    "confirm": "Confirmar",
+    "back": "Voltar",
+    "next": "Próximo",
+    "yes": "Sim",
+    "no": "Não",
+    "status": "Estado",
+    "date": "Data",
+    "name": "Nome",
+    "email": "Email",
+    "phone": "Telefone",
+    "day": "Dia",
+    "none": "Nenhum"
   },
   "nav": {
     "home": "Início",
     "inbox": "Caixa de entrada",
     "campaigns": "Campanhas",
     "templates": "Modelos",
-    "organizations": "Organizações"
+    "organizations": "Organizações",
+    "users": "Utilizadores",
+    "training": "Training Lab",
+    "moderation": "Moderação",
+    "b2b": "Clientes B2B"
+  },
+  "dashboard": {
+    "title": "Painel",
+    "subtitle": "Estado da sua plataforma em tempo real",
+    "select_org": "Bem-vindo ao EdTech Admin",
+    "select_org_hint": "Para começar, selecione uma organização no menu à esquerda.",
+    "isolation_note": "O isolamento de dados garante que você veja apenas as estatísticas da organização ativa.",
+    "loading": "Analisando dados...",
+    "no_enrollments": "Sem inscrições",
+    "recent_enrollments": "Inscrições recentes",
+    "export_csv": "Exportar CSV",
+    "stats": {
+      "users": "Utilizadores",
+      "active": "Ativos",
+      "completed": "Concluídos",
+      "tracks": "Cursos",
+      "revenue": "Receita",
+      "total_messages": "Mensagens Totais",
+      "active_users": "Utilizadores Ativos",
+      "completion_rate": "Taxa de Conclusão",
+      "ai_cost": "Custo IA estimado"
+    },
+    "table": {
+      "phone": "Telefone",
+      "track": "Curso",
+      "status": "Estado",
+      "day": "Dia",
+      "date": "Data"
+    }
+  },
+  "analytics": {
+    "title": "Análises e Desempenho",
+    "export": "Exportar relatório",
+    "explain": "Explicar",
+    "messages": {
+      "title": "Volume de Mensagens",
+      "inbound": "Recebidas",
+      "outbound": "Enviadas"
+    },
+    "completion": {
+      "title": "Taxa de Sucesso",
+      "completed": "Concluídos",
+      "in_progress": "Em progresso"
+    },
+    "performance": {
+      "title": "Desempenho",
+      "avg_score": "Pontuação média dos exercícios"
+    },
+    "engagement": {
+      "title": "Envolvimento",
+      "avg_days": "Dias de formação em média"
+    }
+  },
+  "users": {
+    "title": "Gestão de Utilizadores",
+    "subtitle": "Todos os alunos inscritos",
+    "no_users": "Nenhum utilizador encontrado",
+    "invite": "Convidar",
+    "columns": {
+      "name": "Nome",
+      "phone": "Telefone",
+      "track": "Curso ativo",
+      "day": "Dia",
+      "status": "Estado",
+      "joined": "Inscrição"
+    }
+  },
+  "contacts": {
+    "title": "Contactos",
+    "subtitle": "Gestão da sua base de contactos CRM",
+    "add": "Adicionar contacto",
+    "import": "Importar",
+    "no_contacts": "Sem contactos",
+    "search_placeholder": "Procurar um contacto..."
+  },
+  "settings": {
+    "title": "Configurações",
+    "profile": "Perfil da organização",
+    "branding": "Marca e Cores",
+    "ai_config": "Configuração IA",
+    "whatsapp_config": "Configuração WhatsApp",
+    "billing": "Faturação",
+    "org_name": "Nome da organização",
+    "primary_color": "Cor principal",
+    "logo_url": "URL do logótipo",
+    "save_success": "Configurações guardadas com sucesso.",
+    "save_error": "Não foi possível guardar as configurações.",
+    "no_org_selected": "Por favor selecione uma organização."
+  },
+  "onboarding": {
+    "title": "Bem-vindo ao Xamlé.Studio",
+    "subtitle": "Vamos configurar a sua escola em segundos.",
+    "step_welcome": "Boas-vindas",
+    "step_legal": "Contrato",
+    "step_whatsapp": "WhatsApp",
+    "step_ai": "IA",
+    "connect_fb": "Ligar ao Facebook",
+    "fb_connected": "Conta Facebook ligada!",
+    "setup_waba": "A configurar a sua conta WhatsApp Business...",
+    "cta_launch": "Lançar a minha plataforma",
+    "legal_text": "Ao aceitar, concorda com os nossos termos de parceiro e as políticas comerciais da Meta."
+  },
+  "crm": {
+    "stats": {
+      "total_contacts": "Total de Contactos",
+      "messages_sent": "Mensagens Enviadas",
+      "open_rate": "Taxa de abertura",
+      "conversion": "Conversão"
+    },
+    "inbox": {
+      "title": "Conversas",
+      "no_messages": "Nenhuma conversa encontrada.",
+      "reply_placeholder": "A sua mensagem...",
+      "send": "Enviar"
+    },
+    "campaigns": {
+      "title": "Histórico de Campanhas",
+      "subtitle": "Acompanhe todas as suas transmissões e o seu desempenho.",
+      "new_campaign": "Nova Campanha",
+      "select_template": "Modelo WhatsApp (Opcional)",
+      "choose_approved": "Selecione um modelo aprovado...",
+      "no_approved_templates": "Sem modelos aprovados. Sincronize primeiro.",
+      "use_ai_text": "Usar texto gerado por IA",
+      "status_sent": "Enviado",
+      "status_delivered": "Entregue",
+      "status_read": "Lido",
+      "status_failed": "Falhou"
+    }
+  },
+  "whatsapp": {
+    "templates": {
+      "title": "Modelos de Mensagens WhatsApp",
+      "subtitle": "Gerencie e sincronize os seus modelos aprovados pela Meta.",
+      "sync_button": "Sincronizar com Meta",
+      "create_button": "Criar modelo",
+      "no_templates": "Sem modelos. Sincronize ou crie um.",
+      "table": {
+        "name": "Nome do modelo",
+        "category": "Categoria",
+        "language": "Idioma",
+        "status": "Estado"
+      },
+      "create_modal": {
+        "title": "Criar novo modelo",
+        "name_label": "Nome (minúsculas, sem espaços)",
+        "category_label": "Categoria",
+        "language_label": "Idioma",
+        "body_label": "Texto do corpo",
+        "submit": "Submeter para aprovação",
+        "success": "Modelo submetido com sucesso!",
+        "error": "Falha ao submeter o modelo."
+      }
+    }
+  },
+  "knowledge": {
+    "title": "Base de Conhecimento",
+    "subtitle": "Gerencie os documentos da sua IA",
+    "upload": "Adicionar documento",
+    "no_documents": "Nenhum documento indexado."
+  },
+  "training": {
+    "title": "Training Lab",
+    "subtitle": "Teste e melhore a sua IA pedagógica"
+  },
+  "ai_setup": {
+    "title": "Configuração do Agente IA",
+    "save": "Guardar configuração"
   }
 }

apps/admin/src/pages/DashboardPage.tsx

@@ -1,10 +1,12 @@
 import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { Users, PlayCircle, CheckCircle, Lightbulb, DollarSign, Download, Building2, Loader2 } from 'lucide-react';
 import { useAuth } from '@/lib/auth';
 import { useTenant } from '@/lib/tenant';
 import { api } from '@/lib/api';
 
 export default function DashboardPage() {
+    const { t } = useTranslation();
     const { token } = useAuth();
     const { selectedOrgId } = useTenant();
     const [stats, setStats] = useState<any>(null);
@@ -37,12 +39,12 @@ export default function DashboardPage() {
     }, [token, selectedOrgId]);
 
     const exportCSV = () => {
-        if (!enrollments.length) return alert('Aucune inscription.');
+        if (!enrollments.length) return alert(t('dashboard.no_enrollments'));
         const rows = enrollments.map((e: any) => [e.id, e.user?.phone, e.track?.title, e.status, e.currentDay, e.startedAt]);
         const csv = [['ID', 'Phone', 'Track', 'Status', 'Day', 'Started'].join(','), ...rows.map(r => r.join(','))].join('\n');
-        const a = document.createElement('a'); 
+        const a = document.createElement('a');
         a.href = URL.createObjectURL(new Blob([csv], { type: 'text/csv' }));
-        a.download = `enrollments_${new Date().toISOString().slice(0, 10)}.csv`; 
+        a.download = `enrollments_${new Date().toISOString().slice(0, 10)}.csv`;
         a.click();
     };
 
@@ -50,12 +52,10 @@ export default function DashboardPage() {
         return (
             <div className="flex flex-col items-center justify-center min-h-[80vh] text-slate-400">
                 <Building2 className="w-16 h-16 mb-6 opacity-20" />
-                <h2 className="text-2xl font-bold text-slate-900">Bienvenue sur EdTech Admin</h2>
-                <p className="max-w-md text-center mt-3 text-lg">
-                    Pour commencer, veuillez sélectionner une **organisation** dans le menu déroulant à gauche.
-                </p>
+                <h2 className="text-2xl font-bold text-slate-900">{t('dashboard.select_org')}</h2>
+                <p className="max-w-md text-center mt-3 text-lg">{t('dashboard.select_org_hint')}</p>
                 <div className="mt-8 p-4 bg-blue-50 text-blue-700 rounded-2xl text-sm font-medium border border-blue-100">
-                    💡 L'isolation des données garantit que vous ne voyez que les statistiques de l'organisation active.
+                    💡 {t('dashboard.isolation_note')}
                 </div>
             </div>
         );
@@ -65,40 +65,49 @@ export default function DashboardPage() {
         return (
             <div className="flex flex-col items-center justify-center min-h-[80vh] text-slate-400">
                 <Loader2 className="w-10 h-10 animate-spin mb-4 text-slate-900" />
-                <p className="text-lg font-medium">Analyse des données en cours...</p>
+                <p className="text-lg font-medium">{t('dashboard.loading')}</p>
             </div>
         );
     }
 
     const statCards = [
-        { icon: <Users className="w-6 h-6 text-slate-400" />, label: 'Utilisateurs', value: stats?.totalUsers || 0, color: 'text-slate-900' },
-        { icon: <PlayCircle className="w-6 h-6 text-blue-400" />, label: 'Actifs', value: stats?.activeEnrollments || 0, color: 'text-blue-600' },
-        { icon: <CheckCircle className="w-6 h-6 text-green-400" />, label: 'Complétés', value: stats?.completedEnrollments || 0, color: 'text-green-600' },
-        { icon: <Lightbulb className="w-6 h-6 text-purple-400" />, label: 'Parcours', value: stats?.totalTracks || 0, color: 'text-purple-600' },
-        { icon: <DollarSign className="w-6 h-6 text-emerald-400" />, label: 'Revenus', value: `${(stats?.totalRevenue || 0).toLocaleString()} XOF`, color: 'text-emerald-600' },
+        { icon: <Users className="w-6 h-6 text-slate-400" />, label: t('dashboard.stats.users'), value: stats?.totalUsers || 0, color: 'text-slate-900' },
+        { icon: <PlayCircle className="w-6 h-6 text-blue-400" />, label: t('dashboard.stats.active'), value: stats?.activeEnrollments || 0, color: 'text-blue-600' },
+        { icon: <CheckCircle className="w-6 h-6 text-green-400" />, label: t('dashboard.stats.completed'), value: stats?.completedEnrollments || 0, color: 'text-green-600' },
+        { icon: <Lightbulb className="w-6 h-6 text-purple-400" />, label: t('dashboard.stats.tracks'), value: stats?.totalTracks || 0, color: 'text-purple-600' },
+        { icon: <DollarSign className="w-6 h-6 text-emerald-400" />, label: t('dashboard.stats.revenue'), value: `${(stats?.totalRevenue || 0).toLocaleString()} XOF`, color: 'text-emerald-600' },
+    ];
+
+    const tableHeaders = [
+        t('dashboard.table.phone'),
+        t('dashboard.table.track'),
+        t('dashboard.table.status'),
+        t('dashboard.table.day'),
+        t('dashboard.table.date'),
     ];
 
     return (
         <div className="p-8">
-            <h1 className="text-3xl font-bold mb-8 text-slate-800">Dashboard</h1>
+            <h1 className="text-3xl font-bold mb-8 text-slate-800">{t('dashboard.title')}</h1>
             <div className="grid grid-cols-2 lg:grid-cols-5 gap-4 mb-8">
                 {statCards.map((s, i) => (
                     <div key={i} className="bg-white p-5 rounded-xl shadow-sm border border-slate-100 flex flex-col items-center gap-2">
-                        {s.icon}<p className="text-xs font-semibold text-slate-500 uppercase tracking-wider">{s.label}</p>
+                        {s.icon}
+                        <p className="text-xs font-semibold text-slate-500 uppercase tracking-wider">{s.label}</p>
                         <p className={`text-2xl font-bold ${s.color}`}>{s.value}</p>
                     </div>
                 ))}
             </div>
             <div className="bg-white rounded-xl shadow-sm border border-slate-100 overflow-hidden">
                 <div className="px-6 py-4 border-b border-slate-100 flex justify-between items-center">
-                    <h2 className="text-lg font-semibold text-slate-800">Inscriptions récentes</h2>
+                    <h2 className="text-lg font-semibold text-slate-800">{t('dashboard.recent_enrollments')}</h2>
                     <button onClick={exportCSV} className="flex items-center gap-2 bg-emerald-600 hover:bg-emerald-700 text-white px-4 py-2 rounded-lg text-sm font-medium">
-                        <Download className="w-4 h-4" /><span>Export CSV</span>
+                        <Download className="w-4 h-4" /><span>{t('dashboard.export_csv')}</span>
                     </button>
                 </div>
                 <table className="w-full text-sm">
                     <thead className="bg-slate-50 text-xs text-slate-500 uppercase">
-                        <tr>{['Téléphone', 'Parcours', 'Statut', 'Jour', 'Date'].map(h => <th key={h} className="px-6 py-3 text-left">{h}</th>)}</tr>
+                        <tr>{tableHeaders.map(h => <th key={h} className="px-6 py-3 text-left">{h}</th>)}</tr>
                     </thead>
                     <tbody>
                         {enrollments.map((e: any) => (
@@ -110,11 +119,13 @@ export default function DashboardPage() {
                                         {e.status}
                                     </span>
                                 </td>
-                                <td className="px-6 py-4">Jour {e.currentDay}</td>
-                                <td className="px-6 py-4 text-slate-500">{new Date(e.startedAt).toLocaleDateString('fr-FR')}</td>
+                                <td className="px-6 py-4">{t('common.day')} {e.currentDay}</td>
+                                <td className="px-6 py-4 text-slate-500">{new Date(e.startedAt).toLocaleDateString()}</td>
                             </tr>
                         ))}
-                        {!enrollments.length && <tr><td colSpan={5} className="px-6 py-8 text-center text-slate-400">Aucune inscription</td></tr>}
+                        {!enrollments.length && (
+                            <tr><td colSpan={5} className="px-6 py-8 text-center text-slate-400">{t('dashboard.no_enrollments')}</td></tr>
+                        )}
                     </tbody>
                 </table>
             </div>

apps/admin/src/pages/SettingsPage.tsx

@@ -1,10 +1,12 @@
 
 import React, { useState, useEffect } from 'react';
+import { useTranslation } from 'react-i18next';
 import { api } from '../lib/api';
 import { useTenant } from '../lib/tenant';
 import { useAuth } from '../lib/auth';
 
 export default function SettingsPage() {
+    const { t } = useTranslation();
     const { token } = useAuth();
     const { selectedOrgId } = useTenant();
     const [org, setOrg] = useState<any>(null);
@@ -12,7 +14,7 @@ export default function SettingsPage() {
     const [saving, setSaving] = useState(false);
     const [message, setMessage] = useState<{ type: 'success' | 'error', text: string } | null>(null);
 
-    const isValidId = selectedOrgId && selectedOrgId !== 'default-org-id';
+    const isValidId = !!selectedOrgId;
 
     useEffect(() => {
         if (isValidId && token) {
@@ -41,9 +43,9 @@ export default function SettingsPage() {
         setMessage(null);
         try {
             await api.put(`/v1/organizations/${selectedOrgId}`, org, token);
-            setMessage({ type: 'success', text: 'Configuration enregistrée !' });
+            setMessage({ type: 'success', text: t('settings.save_success') });
         } catch (err) {
-            setMessage({ type: 'error', text: 'Erreur lors de l\'enregistrement.' });
+            setMessage({ type: 'error', text: t('settings.save_error') });
         } finally {
             setSaving(false);
         }
@@ -52,24 +54,24 @@ export default function SettingsPage() {
     if (!isValidId) {
         return (
             <div className="p-12 text-center text-slate-400">
-                <p className="text-lg font-medium">Veuillez sélectionner une organisation pour modifier ses paramètres.</p>
+                <p className="text-lg font-medium">{t('settings.no_org_selected')}</p>
             </div>
         );
     }
 
-    if (loading) return <div className="p-12 text-slate-500 animate-pulse">Chargement des paramètres...</div>;
-    if (!org) return <div className="p-12 text-red-500">Organisation non trouvée.</div>;
+    if (loading) return <div className="p-12 text-slate-500 animate-pulse">{t('common.loading')}</div>;
+    if (!org) return <div className="p-12 text-red-500">{t('common.error')}</div>;
 
     return (
         <div className="p-8 max-w-4xl mx-auto">
             <div className="flex justify-between items-center mb-8">
-                <h1 className="text-3xl font-bold text-slate-800">Configuration de l'Organisation</h1>
-                <button 
+                <h1 className="text-3xl font-bold text-slate-800">{t('settings.title')}</h1>
+                <button
                     onClick={handleSave}
                     disabled={saving}
                     className="px-6 py-2 bg-emerald-600 text-white rounded-xl font-medium hover:bg-emerald-700 disabled:opacity-50 transition-all shadow-lg shadow-emerald-200"
                 >
-                    {saving ? 'Enregistrement...' : 'Enregistrer'}
+                    {saving ? t('common.loading') : t('common.save')}
                 </button>
             </div>
 
@@ -81,32 +83,31 @@ export default function SettingsPage() {
             )}
 
             <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
-                {/* General Settings */}
                 <div className="space-y-6">
                     <section className="bg-white p-6 rounded-2xl border border-slate-100 shadow-sm">
                         <h2 className="text-lg font-semibold text-slate-800 mb-4 flex items-center gap-2">
-                            <span>🏢</span> Profil Général
+                            <span>🏢</span> {t('settings.profile')}
                         </h2>
                         <div className="space-y-4">
                             <div>
-                                <label className="block text-sm font-medium text-slate-600 mb-1">Nom de l'organisation</label>
-                                <input 
-                                    type="text" 
-                                    value={org.name || ''} 
+                                <label className="block text-sm font-medium text-slate-600 mb-1">{t('settings.org_name')}</label>
+                                <input
+                                    type="text"
+                                    value={org.name || ''}
                                     onChange={e => setOrg({...org, name: e.target.value})}
                                     className="w-full px-4 py-2 border border-slate-200 rounded-xl focus:ring-2 focus:ring-emerald-500 outline-none"
                                 />
                             </div>
                             <div>
-                                <label className="block text-sm font-medium text-slate-600 mb-1">Mode de fonctionnement</label>
-                                <select 
+                                <label className="block text-sm font-medium text-slate-600 mb-1">{t('settings.ai_config')}</label>
+                                <select
                                     value={org.mode || 'EDTECH'}
                                     onChange={e => setOrg({...org, mode: e.target.value})}
                                     className="w-full px-4 py-2 border border-slate-200 rounded-xl focus:ring-2 focus:ring-emerald-500 outline-none bg-white"
                                 >
-                                    <option value="EDTECH">EdTech (Apprentissage & Leçons)</option>
-                                    <option value="WEBHOOK">Webhook (Routage externe)</option>
-                                    <option value="AI_AGENT">Agent IA (Conseiller autonome)</option>
+                                    <option value="EDTECH">EdTech</option>
+                                    <option value="WEBHOOK">Webhook</option>
+                                    <option value="AI_AGENT">Agent IA</option>
                                 </select>
                             </div>
                         </div>
@@ -115,25 +116,25 @@ export default function SettingsPage() {
                     {org.mode === 'WEBHOOK' && (
                         <section className="bg-white p-6 rounded-2xl border border-slate-100 shadow-sm animate-in fade-in slide-in-from-top-4">
                             <h2 className="text-lg font-semibold text-slate-800 mb-4 flex items-center gap-2">
-                                <span>🔗</span> Configuration Webhook
+                                <span>🔗</span> {t('settings.whatsapp_config')}
                             </h2>
                             <div className="space-y-4">
                                 <div>
-                                    <label className="block text-sm font-medium text-slate-600 mb-1">URL de destination</label>
-                                    <input 
-                                        type="url" 
+                                    <label className="block text-sm font-medium text-slate-600 mb-1">URL</label>
+                                    <input
+                                        type="url"
                                         placeholder="https://votre-api.com/webhook"
-                                        value={org.webhookUrl || ''} 
+                                        value={org.webhookUrl || ''}
                                         onChange={e => setOrg({...org, webhookUrl: e.target.value})}
                                         className="w-full px-4 py-2 border border-slate-200 rounded-xl focus:ring-2 focus:ring-emerald-500 outline-none"
                                     />
                                 </div>
                                 <div>
-                                    <label className="block text-sm font-medium text-slate-600 mb-1">Secret (X-Hub-Signature)</label>
-                                    <input 
-                                        type="password" 
+                                    <label className="block text-sm font-medium text-slate-600 mb-1">Secret</label>
+                                    <input
+                                        type="password"
                                         placeholder="••••••••"
-                                        value={org.webhookSecret || ''} 
+                                        value={org.webhookSecret || ''}
                                         onChange={e => setOrg({...org, webhookSecret: e.target.value})}
                                         className="w-full px-4 py-2 border border-slate-200 rounded-xl focus:ring-2 focus:ring-emerald-500 outline-none"
                                     />
@@ -145,25 +146,25 @@ export default function SettingsPage() {
                     {org.mode === 'AI_AGENT' && (
                         <section className="bg-white p-6 rounded-2xl border border-slate-100 shadow-sm animate-in fade-in slide-in-from-top-4">
                             <h2 className="text-lg font-semibold text-slate-800 mb-4 flex items-center gap-2">
-                                <span>🤖</span> Paramètres Agent IA
+                                <span>🤖</span> {t('ai_setup.title')}
                             </h2>
                             <div className="space-y-4">
                                 <div>
-                                    <label className="block text-sm font-medium text-slate-600 mb-1">Base de connaissances (URL PDF)</label>
-                                    <input 
-                                        type="url" 
+                                    <label className="block text-sm font-medium text-slate-600 mb-1">{t('knowledge.title')} (URL PDF)</label>
+                                    <input
+                                        type="url"
                                         placeholder="https://storage.com/catalogue.pdf"
-                                        value={org.knowledgeBaseUrl || ''} 
+                                        value={org.knowledgeBaseUrl || ''}
                                         onChange={e => setOrg({...org, knowledgeBaseUrl: e.target.value})}
                                         className="w-full px-4 py-2 border border-slate-200 rounded-xl focus:ring-2 focus:ring-emerald-500 outline-none"
                                     />
                                 </div>
                                 <div>
-                                    <label className="block text-sm font-medium text-slate-600 mb-1">Prompt Système (Instructions)</label>
-                                    <textarea 
+                                    <label className="block text-sm font-medium text-slate-600 mb-1">Prompt</label>
+                                    <textarea
                                         rows={4}
                                         placeholder="Tu es un conseiller expert en..."
-                                        value={org.customPrompt || ''} 
+                                        value={org.customPrompt || ''}
                                         onChange={e => setOrg({...org, customPrompt: e.target.value})}
                                         className="w-full px-4 py-2 border border-slate-200 rounded-xl focus:ring-2 focus:ring-emerald-500 outline-none resize-none"
                                     />
@@ -173,32 +174,22 @@ export default function SettingsPage() {
                     )}
                 </div>
 
-                {/* EdTech / Flow Config */}
                 <div className="space-y-6">
                     <section className="bg-white p-6 rounded-2xl border border-slate-100 shadow-sm">
                         <h2 className="text-lg font-semibold text-slate-800 mb-4 flex items-center gap-2">
-                            <span>⚙️</span> Configuration des Flux (JSON)
+                            <span>⚙️</span> Flow Config (JSON)
                         </h2>
-                        <p className="text-xs text-slate-500 mb-4">
-                            Définissez ici vos secteurs et vos parcours par défaut.
-                        </p>
-                        <textarea 
+                        <textarea
                             rows={12}
-                            value={typeof org.flowConfig === 'string' ? org.flowConfig : JSON.stringify(org.flowConfig, null, 2)} 
-                            onChange={e => {
-                                try {
-                                    // We keep it as string while editing
-                                    setOrg({...org, flowConfig: e.target.value});
-                                } catch(e) {}
-                            }}
+                            value={typeof org.flowConfig === 'string' ? org.flowConfig : JSON.stringify(org.flowConfig, null, 2)}
+                            onChange={e => setOrg({...org, flowConfig: e.target.value})}
                             onBlur={() => {
                                 try {
-                                    // Parse back to object on blur to validate
                                     if (typeof org.flowConfig === 'string') {
                                         setOrg({...org, flowConfig: JSON.parse(org.flowConfig)});
                                     }
-                                } catch(e) {
-                                    setMessage({ type: 'error', text: 'Format JSON invalide dans Flow Config.' });
+                                } catch {
+                                    setMessage({ type: 'error', text: 'Format JSON invalide.' });
                                 }
                             }}
                             className="w-full px-4 py-2 font-mono text-xs border border-slate-200 rounded-xl focus:ring-2 focus:ring-slate-500 outline-none bg-slate-50"
@@ -206,23 +197,23 @@ export default function SettingsPage() {
                     </section>
 
                     <section className="bg-slate-800 p-6 rounded-2xl text-white">
-                        <h2 className="text-lg font-semibold mb-2">État Technique</h2>
+                        <h2 className="text-lg font-semibold mb-2">{t('settings.whatsapp_config')}</h2>
                         <div className="space-y-2 opacity-80 text-sm">
-                            <p>WABA ID: <span className="font-mono text-emerald-400">{org.wabaId || 'Non lié'}</span></p>
-                            <p>Système: <span className="font-mono text-emerald-400">{org.systemUserToken ? 'Connecté ✅' : 'Déconnecté ❌'}</span></p>
+                            <p>WABA ID: <span className="font-mono text-emerald-400">{org.wabaId || '—'}</span></p>
+                            <p>Token: <span className="font-mono text-emerald-400">{org.systemUserToken ? '✅' : '❌'}</span></p>
                         </div>
                     </section>
 
                     <section className="bg-white p-6 rounded-2xl border border-indigo-100 shadow-sm shadow-indigo-50">
                         <h2 className="text-lg font-semibold text-slate-800 mb-4 flex items-center gap-2">
-                            <span>💳</span> Facturation & Abonnement
+                            <span>💳</span> {t('settings.billing')}
                         </h2>
                         <div className="p-4 bg-indigo-50 rounded-xl mb-4 border border-indigo-100">
-                            <div className="text-xs font-bold text-indigo-600 uppercase mb-1">Statut Actuel</div>
+                            <div className="text-xs font-bold text-indigo-600 uppercase mb-1">{t('common.status')}</div>
                             <div className="text-lg font-bold text-indigo-900">{org.subscriptionStatus || 'INACTIF'}</div>
                         </div>
                         <p className="text-xs text-slate-500">
-                            Paiement via Orange Money et Wave — portail de gestion disponible prochainement.
+                            Orange Money / Wave — {t('common.loading').toLowerCase()}
                         </p>
                     </section>
                 </div>

apps/admin/src/pages/UserListPage.tsx

@@ -1,46 +1,39 @@
 import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { X, Building2, Loader2 } from 'lucide-react';
 import { useAuth } from '../lib/auth';
 import { useTenant } from '../lib/tenant';
 import { API_URL, ah } from '../lib/api';
 
 export default function UserListPage() {
+    const { t } = useTranslation();
     const { token } = useAuth();
     const { selectedOrgId } = useTenant();
-    const [users, setUsers] = useState<any[]>([]); 
-    const [total, setTotal] = useState(0); 
+    const [users, setUsers] = useState<any[]>([]);
+    const [total, setTotal] = useState(0);
     const [loading, setLoading] = useState(true);
-    const [selectedUser, setSelectedUser] = useState<any>(null); 
-    const [messages, setMessages] = useState<any[]>([]); 
+    const [selectedUser, setSelectedUser] = useState<any>(null);
+    const [messages, setMessages] = useState<any[]>([]);
     const [loadingMsg, setLoadingMsg] = useState(false);
 
-
-
-    useEffect(() => { 
-        if (!selectedOrgId) {
-            setLoading(false);
-            return;
-        }
+    useEffect(() => {
+        if (!selectedOrgId) { setLoading(false); return; }
         setLoading(true);
         fetch(`${API_URL}/v1/admin/users`, { headers: ah(token!, selectedOrgId) })
             .then(r => r.json())
-            .then(d => { 
-                setUsers(d.users || d); 
-                setTotal(d.total || 0); 
-                setLoading(false); 
-            }); 
+            .then(d => { setUsers(d.users || d); setTotal(d.total || 0); setLoading(false); });
     }, [token, selectedOrgId]);
 
     const viewMessages = async (userId: string) => {
-        setLoadingMsg(true); 
+        setLoadingMsg(true);
         setSelectedUser({ id: userId });
         try {
             const res = await fetch(`${API_URL}/v1/admin/users/${userId}/messages`, { headers: ah(token!, selectedOrgId) });
             const data = await res.json();
             setSelectedUser(data.user);
             setMessages(data.messages || []);
-        } catch (e) {
-            alert("Erreur lors du chargement des messages.");
+        } catch {
+            alert(t('common.error'));
         } finally {
             setLoadingMsg(false);
         }
@@ -50,8 +43,7 @@ export default function UserListPage() {
         return (
             <div className="flex flex-col items-center justify-center min-h-[60vh] text-slate-400">
                 <Building2 className="w-12 h-12 mb-4 opacity-20" />
-                <h3 className="text-lg font-bold text-slate-900">Aucune organisation sélectionnée</h3>
-                <p className="max-w-xs text-center mt-2">Sélectionnez une organisation pour gérer ses utilisateurs.</p>
+                <h3 className="text-lg font-bold text-slate-900">{t('settings.no_org_selected')}</h3>
             </div>
         );
     }
@@ -60,18 +52,25 @@ export default function UserListPage() {
         return (
             <div className="flex flex-col items-center justify-center min-h-[60vh] text-slate-400">
                 <Loader2 className="w-8 h-8 animate-spin mb-4 text-slate-900" />
-                <p>Chargement des utilisateurs...</p>
+                <p>{t('common.loading')}</p>
             </div>
         );
     }
 
+    const tableHeaders = [
+        t('common.phone'), t('common.name'), 'Langue', 'Secteur',
+        t('nav.organizations'), t('users.columns.status'), t('common.date'), t('common.actions')
+    ];
+
     return (
         <div className="p-8">
-            <h1 className="text-3xl font-bold mb-6 text-slate-800">Utilisateurs <span className="text-lg font-normal text-slate-400">({total})</span></h1>
+            <h1 className="text-3xl font-bold mb-6 text-slate-800">
+                {t('users.title')} <span className="text-lg font-normal text-slate-400">({total})</span>
+            </h1>
             <div className="bg-white rounded-xl shadow-sm border border-slate-100 overflow-hidden">
                 <table className="w-full text-sm">
                     <thead className="bg-slate-50 text-xs text-slate-500 uppercase">
-                        <tr>{['Téléphone', 'Nom', 'Langue', 'Secteur', 'Inscrip.', 'Réponses', 'Date', 'Actions'].map(h => <th key={h} className="px-5 py-3 text-left">{h}</th>)}</tr>
+                        <tr>{tableHeaders.map(h => <th key={h} className="px-5 py-3 text-left">{h}</th>)}</tr>
                     </thead>
                     <tbody>
                         {users.map((u: any) => (
@@ -82,13 +81,17 @@ export default function UserListPage() {
                                 <td className="px-5 py-3 text-slate-500 text-xs">{u.activity || '—'}</td>
                                 <td className="px-5 py-3 text-center">{u._count?.enrollments || 0}</td>
                                 <td className="px-5 py-3 text-center">{u._count?.responses || 0}</td>
-                                <td className="px-5 py-3 text-slate-400 text-xs">{new Date(u.createdAt).toLocaleDateString('fr-FR')}</td>
+                                <td className="px-5 py-3 text-slate-400 text-xs">{new Date(u.createdAt).toLocaleDateString()}</td>
                                 <td className="px-5 py-3 text-right">
-                                    <button onClick={() => viewMessages(u.id)} className="text-xs bg-slate-100 hover:bg-slate-200 text-slate-700 px-3 py-1.5 rounded-lg font-medium transition-colors">Conversation</button>
+                                    <button onClick={() => viewMessages(u.id)} className="text-xs bg-slate-100 hover:bg-slate-200 text-slate-700 px-3 py-1.5 rounded-lg font-medium transition-colors">
+                                        Conversation
+                                    </button>
                                 </td>
                             </tr>
                         ))}
-                        {!users.length && <tr><td colSpan={8} className="px-5 py-8 text-center text-slate-400">Aucun utilisateur</td></tr>}
+                        {!users.length && (
+                            <tr><td colSpan={8} className="px-5 py-8 text-center text-slate-400">{t('users.no_users')}</td></tr>
+                        )}
                     </tbody>
                 </table>
             </div>
@@ -98,16 +101,18 @@ export default function UserListPage() {
                     <div className="bg-slate-50 rounded-2xl shadow-2xl w-full max-w-2xl max-h-[90vh] flex flex-col overflow-hidden">
                         <div className="bg-white px-6 py-4 flex items-center justify-between border-b border-slate-200">
                             <div>
-                                <h3 className="font-bold text-slate-800">{selectedUser.name || 'Chat Utilisateur'}</h3>
+                                <h3 className="font-bold text-slate-800">{selectedUser.name || 'Chat'}</h3>
                                 <p className="text-xs text-slate-500">{selectedUser.phone}</p>
                             </div>
-                            <button onClick={() => { setSelectedUser(null); setMessages([]); }} className="p-2 hover:bg-slate-100 rounded-full"><X className="w-5 h-5 text-slate-500" /></button>
+                            <button onClick={() => { setSelectedUser(null); setMessages([]); }} className="p-2 hover:bg-slate-100 rounded-full">
+                                <X className="w-5 h-5 text-slate-500" />
+                            </button>
                         </div>
                         <div className="flex-1 overflow-y-auto p-6 space-y-4 bg-[#e5ddd5]">
                             {loadingMsg ? (
-                                <div className="text-center text-slate-500 py-10">Chargement de l'historique...</div>
+                                <div className="text-center text-slate-500 py-10">{t('common.loading')}</div>
                             ) : messages.length === 0 ? (
-                                <div className="text-center text-slate-500 py-10 bg-white/50 rounded-xl">Aucun message pour cet utilisateur.</div>
+                                <div className="text-center text-slate-500 py-10 bg-white/50 rounded-xl">{t('crm.inbox.no_messages')}</div>
                             ) : (
                                 messages.map((m: any) => {
                                     const isBot = m.direction === 'OUTBOUND';
@@ -116,15 +121,15 @@ export default function UserListPage() {
                                             <div className={`max-w-[80%] rounded-2xl px-4 py-2.5 shadow-sm text-sm ${isBot ? 'bg-white text-slate-800 rounded-tl-none' : 'bg-[#dcf8c6] text-slate-900 rounded-tr-none'}`}>
                                                 {m.mediaUrl && (
                                                     <div className="mb-2">
-                                                        {m.mediaUrl.endsWith('.mp3') || m.mediaUrl.endsWith('.ogg') || m.mediaUrl.endsWith('.webm') ?
-                                                            <audio src={m.mediaUrl} controls className="h-10 max-w-full" /> :
-                                                            <a href={m.mediaUrl} target="_blank" rel="noreferrer" className="text-blue-600 underline">Voir Media</a>
+                                                        {m.mediaUrl.endsWith('.mp3') || m.mediaUrl.endsWith('.ogg') || m.mediaUrl.endsWith('.webm')
+                                                            ? <audio src={m.mediaUrl} controls className="h-10 max-w-full" />
+                                                            : <a href={m.mediaUrl} target="_blank" rel="noreferrer" className="text-blue-600 underline">Media</a>
                                                         }
                                                     </div>
                                                 )}
                                                 {m.content && <p className="whitespace-pre-wrap">{m.content}</p>}
                                                 <p className={`text-[10px] mt-1 text-right ${isBot ? 'text-slate-400' : 'text-slate-500'}`}>
-                                                    {new Date(m.createdAt).toLocaleTimeString('fr-FR', { hour: '2-digit', minute: '2-digit' })}
+                                                    {new Date(m.createdAt).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}
                                                 </p>
                                             </div>
                                         </div>