# Prompts de Regeneration des Fonctionnalites SecuBox > **Languages:** [English](../docs/feature-regeneration-prompts.md) | Francais | [中文](../docs-zh/feature-regeneration-prompts.md) **Version :** 1.0.0 **Derniere mise a jour :** 2025-12-28 **Statut :** Actif **Objectif :** Prompts complets pour Claude.ai afin de regenerer toutes les fonctionnalites des modules SecuBox correspondant a la demo en ligne sur secubox.cybermood.eu --- ## Voir Aussi - **Workflow d'Implementation :** [MODULE-IMPLEMENTATION-GUIDE.md](module-implementation-guide.md) - **Modeles de Code :** [CODE-TEMPLATES.md](code-templates.md) - **Commandes Rapides :** [QUICK-START.md](quick-start.md) - **Garde-fous d'Automatisation :** [CODEX.md](codex.md) --- ## Table des Matieres 1. [Reference du Systeme de Design](#reference-du-systeme-de-design) 2. [Prompts des Modules Principaux](#prompts-des-modules-principaux) 3. [Modules de Securite et Surveillance](#modules-de-securite-et-surveillance) 4. [Modules d'Intelligence Reseau](#modules-dintelligence-reseau) 5. [Modules VPN et Controle d'Acces](#modules-vpn-et-controle-dacces) 6. [Modules de Bande Passante et Trafic](#modules-de-bande-passante-et-trafic) 7. [Modules de Performance et Services](#modules-de-performance-et-services) --- ## Reference du Systeme de Design ### Palette de Couleurs et Variables Tous les modules DOIVENT utiliser les variables CSS de `system-hub/common.css` : **Mode Sombre (Principal) :** ```css --sh-bg-primary: #0a0a0f; /* Fond noir profond */ --sh-bg-secondary: #12121a; /* Fonds de cartes */ --sh-bg-tertiary: #1a1a24; /* Etats survol/actif */ --sh-primary: #6366f1; /* Indigo principal */ --sh-primary-end: #8b5cf6; /* Violet (degrades) */ --sh-success: #22c55e; /* Vert */ --sh-danger: #ef4444; /* Rouge */ --sh-warning: #f59e0b; /* Orange */ --sh-text-primary: #fafafa; /* Texte principal */ --sh-text-secondary: #a0a0b0; /* Texte secondaire */ ``` ### Standards Typographiques ```css /* Polices */ Inter: Corps de texte, labels, elements d'interface JetBrains Mono: Nombres, identifiants, code, metriques /* Tailles */ --sh-title-xl: 28px; /* Titres de page */ --sh-title-lg: 20px; /* Titres de carte */ --sh-value-xl: 40px; /* Grandes metriques */ --sh-value-lg: 32px; /* Apercu des statistiques */ ``` ### Patterns de Composants 1. **En-tete de Page** : Icone + Titre + Sous-titre + Grille de Stats 2. **Badges de Stats** : Valeurs en police monospace, largeur minimale de 130px 3. **Cartes** : Bordure superieure de 3px (degrade ou couleur unie) 4. **Boutons** : Fonds en degrade, effets d'ombre, transitions fluides 5. **Onglets de Filtre** : Degrade pour l'actif, pattern icone + label --- ## Prompts des Modules Principaux ### 1. Hub Central SecuBox (luci-app-secubox) **Objectif du Module :** Tableau de bord principal et panneau de controle central **Prompt pour Claude.ai :** ``` Creez un module de tableau de bord LuCI pour le Hub Central SecuBox avec ces fonctionnalites : EXIGENCES DE DESIGN : - Theme sombre avec fonds en degrade (#0a0a0f vers #12121a) - En-tete de page avec icone fusee et titre "Centre de Controle SecuBox" - Grille de statistiques affichant : Total des Modules (badge), Services Actifs, Sante du Systeme, Nombre d'Alertes - Utiliser les variables CSS --sh-* (ne jamais coder les couleurs en dur) FONCTIONNALITES PRINCIPALES : 1. Grille d'Apercu des Modules - Afficher les 15 modules SecuBox installes sous forme de cartes - Chaque carte : Icone du module, nom, badge de statut (actif/inactif), version - Bordures par couleur : vert (en cours), orange (avertissement), rouge (arrete) - Boutons "Configurer" et "Voir les Details" par carte - Onglets de filtre : Tous | Securite | Reseau | Services 2. Tableau de Bord de Sante du Systeme - Metriques en temps reel : CPU, RAM, Disque, Reseau - Barres de progression animees avec remplissage en degrade - Indicateurs de seuil (avertissement >80%, danger >90%) - Police JetBrains Mono pour toutes les valeurs numeriques 3. Panneau d'Actions Rapides - Bouton Redemarrer Tous les Services (degrade orange) - Bouton Mettre a Jour les Paquets (degrade bleu) - Bouton Voir les Logs Systeme (degrade indigo) - Bouton Exporter la Configuration (degrade vert) 4. Chronologie des Alertes - 10 derniers evenements systeme avec horodatages - Indicateurs d'icone pour les niveaux de severite - Details extensibles par alerte - Rafraichissement automatique toutes les 30 secondes SPECIFICATIONS TECHNIQUES : - Fichier : luci-app-secubox/htdocs/luci-static/resources/view/secubox/dashboard.js - Backend RPCD : luci.secubox (methodes : getModules, getHealth, getAlerts) - CSS : luci-app-secubox/htdocs/luci-static/resources/secubox/dashboard.css - Utiliser L.resolveDefault() pour tous les appels ubus - Implementer une gestion d'erreurs appropriee avec des messages conviviaux - Ajouter des etats de chargement avec des ecrans squelettes COMPOSANTS UI A UTILISER : - sh-page-header pour l'en-tete principal - sh-card avec variantes sh-card-success/warning/danger - sh-stat-badge pour les metriques (minimum 130px) - sh-btn sh-btn-primary pour les boutons d'action - sh-filter-tabs pour le filtrage par categorie REFERENCE A LA DEMO EN LIGNE : Correspondre a l'aspect de la demo secubox.cybermood.eu - Animations fluides au survol des cartes - Effets de texte en degrade sur les titres - Effets de lueur sur les elements actifs - Grille responsive (cartes de 280px minimum) ``` ### 2. Hub Systeme (luci-app-system-hub) **Objectif du Module :** Centre de controle systeme unifie **Prompt pour Claude.ai :** ``` Creez un module Hub Systeme complet pour OpenWrt avec ces fonctionnalites : EXIGENCES DE DESIGN : - Utiliser le systeme de design System Hub (variables common.css) - Titre de page : "Centre de Controle Systeme" avec icone - Interface multi-onglets : Apercu | Services | Logs | Sauvegarde | Composants | Diagnostics | Sante | Distant | Parametres ONGLET APERCU : 1. Grille d'Informations Systeme (4 colonnes, responsive) - Carte Nom d'hote avec bouton d'edition - Carte Temps de fonctionnement avec duree formatee - Carte Charge Moyenne (1m, 5m, 15m) en monospace - Carte Version du Noyau avec icone de copie 2. Moniteurs de Ressources (cercles de progression animes) - Utilisation CPU avec code couleur (<70% vert, 70-90% orange, >90% rouge) - Utilisation memoire avec affichage utilise/total - Utilisation stockage avec repartition par systeme de fichiers - Debit reseau (taux RX/TX en temps reel) 3. Indicateurs de Statut Rapide - Connectivite Internet (test ping toutes les 60s) - Statut de resolution DNS - Statut de synchronisation NTP - Statut du pare-feu avec nombre de regles ONGLET SERVICES : 1. Grille de Cartes de Services - Chaque service : nom, badge de statut, description, temps de fonctionnement - Bordures codees par couleur selon le statut - Boutons d'action : Demarrer/Arreter/Redemarrer/Activer/Desactiver - Filtrer par : Tous | En cours | Arretes | Actives | Desactives - Barre de recherche pour filtrer les services 2. Modal de Details du Service - Infos completes du service (PID, utilisation memoire, temps CPU) - Logs recents (50 dernieres lignes avec coloration syntaxique) - Chemin du fichier de configuration avec lien d'edition - Vue arborescente des dependances ONGLET LOGS : 1. Visionneuse de Logs Systeme - Streaming de logs en temps reel (WebSocket ou polling) - Niveaux de severite codes par couleur (erreur=rouge, avertissement=orange, info=bleu) - Filtrer par : severite, service, plage de dates - Fonctionnalite de recherche avec support regex - Basculement du defilement automatique - Bouton d'export des logs (telecharger en .txt) - Numeros de ligne en monospace - Mode en-tete compact (economise l'espace vertical) 2. Statistiques des Logs - Nombre d'erreurs dans la derniere heure/jour - Services les plus actifs - Graphique de frequence des alertes (sparkline) ONGLET SAUVEGARDE : 1. Gestion des Sauvegardes - Bouton creer une sauvegarde (inclut config + liste des paquets installes) - Lister les sauvegardes existantes avec date, taille, description - Restaurer depuis une sauvegarde avec modal de confirmation - Telecharger la sauvegarde sur la machine locale - Televerser une sauvegarde depuis un fichier - Configuration de la planification de sauvegarde automatique 2. Apercu de la Sauvegarde - Afficher les fichiers inclus avant creation - Calcul de la taille estimee - Options de compression (gz, xz) ONGLET COMPOSANTS : 1. Affichage des Paquets Installes - Grille de tous les paquets luci-app-* - Chaque carte : nom du paquet, version, taille, statut - Filtrage par categorie (meme que les modules SecuBox) - Informations de dependance - Bouton de desinstallation avec avertissement ONGLET DIAGNOSTICS : 1. Diagnostics Reseau - Outil Ping avec saisie de cible - Traceroute avec visualisation des sauts - Recherche DNS avec plusieurs serveurs de noms - Scanner de ports (ports communs ou plage personnalisee) - Test de bande passante (integration speedtest-cli) 2. Diagnostics Systeme - Statut de verification du systeme de fichiers - Detection de fuites memoire - Liste des processus avec utilisation des ressources - Compteur de descripteurs de fichiers ouverts - Tableau des connexions reseau ONGLET SANTE : 1. Rapport de Sante Systeme - Score de sante global (0-100) avec cercle en degrade - Liste des problemes critiques avec suggestions de correction - Capteurs de temperature (si disponibles) - Vitesses des ventilateurs (si disponibles) - Statut SMART du disque - Statut de la batterie (pour les systemes avec onduleur) 2. Historique de Sante - Graphique du score de sante sur 24h (graphique en ligne) - Tendances d'utilisation des ressources - Frequence des alertes dans le temps ONGLET DISTANT : 1. Gestion de l'Acces Distant - Statut SSH avec port et IPs autorisees - Infos d'acces a l'interface Web (HTTP/HTTPS, port, acces externe) - Integration bureau distant RustDesk - Statut VPN WireGuard (si installe) - Configuration DNS Dynamique ONGLET PARAMETRES : 1. Preferences du Hub Systeme - Intervalle de rafraichissement automatique (10s/30s/60s/desactive) - Basculement mode Sombre/Clair - Basculement mode Compact - Selection de la langue - Configuration du fuseau horaire - Personnalisation de la disposition du tableau de bord IMPLEMENTATION TECHNIQUE : - Fichiers : system-hub/overview.js, services.js, logs.js, backup.js, components.js, diagnostics.js, health.js, remote.js, settings.js - RPCD : luci.system-hub avec methodes pour chaque fonctionnalite - Fichier API : system-hub/api.js avec wrappers de methodes propres - CSS : system-hub/dashboard.css + common.css - Utiliser theme.js pour le basculement mode sombre/clair - Support WebSocket pour le streaming de logs en temps reel - LocalStorage pour les preferences utilisateur - Etats de chargement et gestion d'erreurs appropriees REFERENCE DEMO : Correspondre a la demo secubox.cybermood.eu/system-hub - Transitions d'onglets fluides - Mises a jour des donnees en temps reel - Dispositions de grille responsives - Code couleur professionnel ``` --- ## Modules de Securite et Surveillance ### 3. Tableau de Bord CrowdSec (luci-app-crowdsec-dashboard) **Prompt pour Claude.ai :** ``` Creez un tableau de bord de surveillance de securite CrowdSec pour OpenWrt : DESIGN : - Titre : "Securite CrowdSec" avec icone bouclier - Theme sombre avec accent sur les indicateurs de menace - Badges de stats : Decisions Actives | IPs Bloquees | Alertes | Bouncers ONGLET APERCU : 1. Resume de l'Intelligence des Menaces - Compteur total de decisions (reference 15M+ IPs bloquees globalement) - Decisions locales actives avec compte a rebours d'expiration - Repartition des types de decisions (ban, captcha, throttle) en camembert - Distribution geographique des menaces (top 10 avec drapeaux) 2. Chronologie des Alertes Recentes - Cartes d'alerte avec : horodatage, scenario, IP, drapeau du pays, severite - Code couleur par niveau de risque - Details extensibles affichant les donnees completes de l'evenement - Filtrer par : plage de temps, type de scenario, severite 3. Flux d'Activite en Temps Reel - 100 derniers evenements (defilable, mise a jour automatique) - Adresse IP en monospace avec bouton de copie - Nom du scenario avec icone - Action entreprise (ban/log/captcha) ONGLET DECISIONS : 1. Tableau des Decisions Actives - Colonnes : IP, Raison, Duree, Expire Dans, Type, Origine, Actions - Triable par toutes les colonnes - Capacites de recherche et filtrage - Boutons d'ajout/suppression manuelle de decision - Actions en masse (supprimer la selection) - Bouton d'export en CSV 2. Statistiques des Decisions - Decisions dans le temps (graphique 24h) - IPs les plus bloquees - Scenarios les plus declenches - Duree moyenne des decisions ONGLET ALERTES : 1. Gestion des Alertes - Cartes d'alerte groupees par scenario - Vue chronologique avec en-tetes de date - Indicateurs de severite (critique/haute/moyenne/basse) - Liaison avec les decisions associees - Fonctionnalite marquer comme resolu ONGLET BOUNCERS : 1. Statut des Bouncers - Liste des bouncers connectes - Chaque bouncer : nom, type, version, dernier pull, statut - Ajouter un nouveau bouncer avec generation de cle API - Supprimer un bouncer avec confirmation - Metriques des bouncers (decisions appliquees, requetes effectuees) ONGLET METRIQUES : 1. Metriques de Performance - Sante du service CrowdSec - Frequence de pull des decisions - Temps de reponse API - Utilisation memoire et CPU - Indicateurs de statut LAPI/CAPI ONGLET PARAMETRES : 1. Configuration CrowdSec - Activer/desactiver le service - Configuration d'acquisition (chemins des logs) - Gestion des scenarios (activer/desactiver des scenarios specifiques) - Gestion des collections (installer/supprimer) - Statut d'inscription a la console TECHNIQUE : - RPCD : luci.crowdsec-dashboard - Methodes : getStats, getDecisions, getAlerts, getBouncers, getMetrics - Commandes : cscli decisions list/add/delete, cscli alerts list, cscli bouncers list - Parser la sortie JSON des commandes cscli - Gerer la communication API avec le daemon CrowdSec AMELIORATIONS VISUELLES : - Bordures en degrade pour les cartes de niveau de menace (vert vers orange vers rouge) - Pulsation animee sur les nouvelles alertes - Drapeaux de pays pour la geolocalisation IP - Graphiques sparkline pour les metriques - Squelettes de chargement pendant la recuperation des donnees ``` ### 4. Tableau de Bord Netdata (luci-app-netdata-dashboard) **Prompt pour Claude.ai :** ``` Creez un tableau de bord de surveillance systeme Netdata avec plus de 1000 metriques : DESIGN : - Titre : "Surveillance Systeme" avec icone graphique - Accent sur les graphiques et metriques en temps reel - Badges de stats : Alertes | Services | Graphiques | Collecteurs ONGLET TABLEAU DE BORD : 1. Grille de Metriques d'Apercu - Charge systeme (1m, 5m, 15m) en graphiques jauge - Utilisation CPU par coeur (visualisation multi-coeur) - Utilisation RAM avec repartition (utilise/cache/tampons/libre) - Taux d'E/S disque (lecture/ecriture Mo/s) - Debit reseau (toutes les interfaces combinees) 2. Graphiques Rapides - Graphique de temperature CPU (si disponible) - Graphique d'utilisation swap - Graphique du nombre de processus (en cours/en veille/zombie) - Graphique des changements de contexte et interruptions 3. Netdata Integre - Interface web Netdata complete integree en iframe - Dimensionnement responsive - Correspondance du theme (mode sombre) ONGLET SYSTEME : 1. Approfondissement des Metriques Systeme - Frequence et gouverneur CPU - Pourcentage de temps d'inactivite CPU - Barres d'utilisation par coeur - Interruptions systeme par seconde - Taux de changements de contexte - Metriques internes du noyau 2. Details Memoire - Graphique d'allocation memoire - Taux de defauts de page - Ratio de memoire engagee - Utilisation des pages enormes - Repartition de la memoire slab ONGLET PROCESSUS : 1. Surveillance des Processus - Top processus par CPU (tableau mis a jour en direct) - Top processus par RAM - Nombre de processus par etat - Nombre total de threads - Taux de creation de processus 2. Details des Processus - Temps CPU par processus - Cartes memoire par processus - Fichiers ouverts par processus - Visualisation arborescente des processus ONGLET TEMPS REEL : 1. Surveillance en Direct - Graphique CPU en temps reel (granularite 1s) - E/S reseau en temps reel - E/S disque en temps reel - Changements memoire en temps reel - Rafraichissement automatique chaque seconde ONGLET RESEAU : 1. Metriques Reseau - Statistiques d'interface (toutes les interfaces) - Taux de paquets (paquets/s entree/sortie) - Compteurs d'erreurs et de rejets - Etats des connexions TCP/UDP - Statistiques Netfilter - Statistiques de requetes DNS (si disponible) ONGLET PARAMETRES : 1. Configuration Netdata - Activer/desactiver le service Netdata - Configurer la periode de retention - Activer/desactiver des collecteurs specifiques - Configuration des alertes - Configuration du streaming (Netdata central) TECHNIQUE : - RPCD : luci.netdata-dashboard - Integration API Netdata (http://localhost:19999/api/v1/) - Methodes : /info, /charts, /data, /alarms - Recuperation de donnees en temps reel avec polling - Chart.js ou graphiques Netdata natifs - Support WebSocket pour mises a jour en direct GRAPHIQUES A INCLURE : - Graphiques en ligne pour les donnees temporelles - Graphiques en barres pour les comparaisons - Graphiques jauge pour les valeurs actuelles - Graphiques en aires pour les metriques empilees - Sparklines pour les apercus compacts ``` --- ## Modules d'Intelligence Reseau ### 5. Tableau de Bord Netifyd (luci-app-netifyd-dashboard) **Prompt pour Claude.ai :** ``` Creez un tableau de bord d'Inspection Approfondie des Paquets utilisant Netifyd (detection de plus de 300 applications) : DESIGN : - Titre : "Intelligence Reseau" avec icone loupe - Focus sur la visibilite des applications et protocoles - Badges de stats : Flux Actifs | Applications | Appareils | Protocoles ONGLET APERCU : 1. Resume de l'Activite Reseau - Compteur total de flux (actuel + historique) - Applications uniques detectees aujourd'hui - Nombre d'appareils actifs - Distribution des protocoles (camembert TCP/UDP/ICMP) 2. Graphique des Top Applications - Graphique en barres des 10 applications principales par bande passante - Icones pour les applications reconnues (Netflix, YouTube, Spotify, etc.) - Pourcentage du trafic total - Cliquer pour filtrer les flux par application 3. Top Appareils - Cartes d'appareil avec : nom d'hote, MAC, IP, application actuelle - Utilisation de bande passante par appareil (RX/TX) - Icone de type d'appareil (telephone, laptop, TV, IoT) ONGLET APPLICATIONS : 1. Decouverte d'Applications - Grille des applications detectees - Chaque carte : icone app, nom, categorie, protocole, flux actifs - Categories codees par couleur : * Streaming (rouge) : Netflix, YouTube, Twitch * Social (bleu) : Facebook, Instagram, TikTok * Messagerie (vert) : WhatsApp, Telegram, Signal * VoIP (violet) : Zoom, Teams, Discord * Gaming (orange) : Steam, PlayStation, Xbox - Bande passante en temps reel par app (sparklines) 2. Details de l'Application - Cliquer sur l'app pour voir : connexions actives, bande passante totale, protocoles utilises - Chronologie des flux pour l'application selectionnee - Repartition par appareil (quels appareils utilisent cette app) ONGLET APPAREILS : 1. Inventaire des Appareils - Tableau : IP, MAC, Nom d'hote, Fabricant, Apps Actives, Bande Passante - Triable et recherchable - Regroupement des appareils par sous-reseau - Nommage/etiquetage manuel des appareils 2. Profil d'Appareil - Vue par appareil : tous les flux, historique d'utilisation des apps - Tendances de bande passante (graphique 24h) - Evaluation des risques (protocoles inconnus, apps suspectes) - Gestion des regles bloquer/autoriser ONGLET FLUX : 1. Moniteur de Flux Actifs - Tableau en temps reel des flux reseau - Colonnes : Source, Destination, App, Protocole, Bande Passante, Duree - Defilement automatique avec bouton pause - Code couleur par niveau de risque - Details du flux au clic (5-tuple complet + donnees DPI) 2. Statistiques des Flux - Flux par protocole (camembert) - Top emetteurs (IPs sources) - Top destinations (IPs externes) - Distribution des ports ONGLET TOP EMETTEURS : 1. Leaders en Bande Passante - Liste classee des adresses IP par trafic total - Indicateurs de direction (upload/download) - Selecteur de plage de temps (1h/24h/7j/30j) - Export en CSV ONGLET RISQUES : 1. Evaluation des Risques - Detection de flux suspects - Liste des protocoles inconnus - Connexions vers des IPs sur liste noire - Utilisation inhabituelle de ports - Trafic potentiel de malware C2 - Score de risque par appareil (0-100) ONGLET BANDE PASSANTE PAR CATEGORIE : 1. Trafic par Categorie - Graphique en aires empilees montrant les categories dans le temps - Categories : Streaming, Social, Gaming, Business, Autre - Repartition en pourcentages - Heures de pic d'utilisation ONGLET REQUETES DNS : 1. Analytiques DNS - Tableau des requetes DNS recentes - Domaines les plus requetes - Nombre de requetes echouees - Detection de fuite DNS - Requetes bloquees (si utilisation de filtrage DNS) ONGLET PARAMETRES : 1. Configuration Netifyd - Activer/desactiver le DPI - Selectionner les interfaces a surveiller - Sensibilite de detection des applications - Configuration de l'export des flux - Parametres de confidentialite (retention des donnees) TECHNIQUE : - RPCD : luci.netifyd-dashboard - API Netifyd : Socket Unix /var/run/netifyd/netifyd.sock - Parsing de l'export JSON des flux - Base de donnees d'applications des signatures Netify - Mises a jour de flux en temps reel (WebSocket ou SSE) FONCTIONNALITES VISUELLES : - Icones d'application de FontAwesome ou set SVG personnalise - Compteurs de flux animes (effet de comptage) - Barres de bande passante codees par couleur - Graphiques interactifs (cliquer pour filtrer) - Infobulles avec informations detaillees ``` ### 6. Modes Reseau (luci-app-network-modes) **Prompt pour Claude.ai :** ``` Creez un assistant de Configuration de Mode Reseau avec 5 options de topologie : DESIGN : - Titre : "Configuration Reseau" avec icone globe - Interface style assistant avec progression par etapes - Grandes cartes de mode avec illustrations ONGLET APERCU : 1. Affichage du Mode Actuel - Grande carte montrant le mode actif avec icone - Description du mode - Resume de la configuration reseau actuelle (IPs WAN/LAN, statut DHCP) - Bouton "Changer de Mode" (en degrade) 2. Tableau Comparatif des Modes - Les 5 modes en colonnes - Lignes : Cas d'usage, Ports WAN, Ports LAN, Role WiFi, Serveur DHCP, NAT - Mode actuel en surbrillance ONGLET ASSISTANT : 1. Ecran de Selection du Mode - 5 cartes de mode en grille : * Mode Routeur - Configuration maison/bureau par defaut * Mode Bridge - Transfert transparent couche 2 * Mode Point d'Acces - WiFi uniquement, liaison filaire * Mode Repeteur/Extendeur - Repetition WiFi vers WiFi * Mode Routeur de Voyage - WiFi portable depuis ethernet hotel - Chaque carte : titre, description, avantages/inconvenients, diagramme - Bouton "Selectionner" par carte 2. Ecran de Configuration (par mode) - Parametres specifiques au mode : * Routeur : Type WAN (DHCP/PPPoE/Statique), sous-reseau LAN, plage DHCP * Bridge : Membres du bridge, activer STP, config VLAN * AP : Interface de liaison, SSID, securite, canal * Repeteur : Scan SSID source, identifiants, SSID de rediffusion * Routeur de Voyage : Scan WiFi client, option clone MAC WAN 3. Ecran de Previsualisation - Afficher les changements de configuration avant application - Diagramme reseau avec nouvelle topologie - Liste des services qui seront reconfigures - Avertissement de temps d'arret estime - Boutons "Appliquer" et "Retour" 4. Ecran d'Application - Indicateur de progression pendant l'application - Statut etape par etape : * Arret des services... * Mise a jour de la configuration reseau... * Redemarrage des interfaces... * Demarrage des services... - Temporisateur de retour arriere (60 secondes pour confirmer) - Ecran de confirmation apres succes ONGLET MODE ROUTEUR : 1. Parametres Routeur - Config interface WAN (client DHCP, statique, PPPoE, 3G/4G) - Config interface LAN (IP, masque, serveur DHCP) - Mappage de ports (quels ports physiques sont WAN vs LAN) - Regles NAT et pare-feu - Configuration du redirecteur DNS ONGLET POINT D'ACCES : 1. Parametres AP - Selection de l'interface de liaison (ethernet ou WiFi) - Desactiver NAT et serveur DHCP - Pont LAN et Liaison - Configuration WiFi (SSID, securite, canal, puissance) - Parametres de roaming rapide (802.11r) ONGLET RELAIS : 1. Parametres Relais/Repeteur - Sondage du site (scanner les reseaux WiFi) - Connexion au WiFi amont (identifiants) - SSID de rediffusion (meme ou different) - Config bridge WiFi vers WiFi - Indicateurs de force du signal ONGLET MODE SNIFFER : 1. Configuration de Capture de Paquets - Mode moniteur sur WiFi - Mode promiscueux sur ethernet - Filtres de capture (syntaxe BPF) - Format de sortie (pcap, pcapng) - Rotation et stockage des captures - Integration avec tcpdump/wireshark ONGLET PARAMETRES : 1. Parametres Reseau Avances - Configuration VLAN - Agregation de liens (bonding) - Parametres QoS - Configuration IPv6 - Regles de routage personnalisees TECHNIQUE : - RPCD : luci.network-modes - Methodes : get_current_mode, get_available_modes, set_mode, validate_config - Manipulation de config UCI (/etc/config/network, wireless, firewall, dhcp) - Surveillance d'etat des interfaces (evenements network.interface) - Mecanisme de retour arriere (uci revert + temporisateur) VALIDATION : - Validation du format d'adresse IP - Detection de chevauchement de sous-reseaux - Verification de la plage DHCP dans le sous-reseau - Verification de la disponibilite du canal WiFi - Conflits d'assignation de ports physiques ``` --- ## Modules VPN et Controle d'Acces ### 7. Tableau de Bord WireGuard (luci-app-wireguard-dashboard) **Prompt pour Claude.ai :** ``` Creez un tableau de bord de gestion VPN WireGuard avec generation de QR code : DESIGN : - Titre : "VPN WireGuard" avec icone cadenas - Esthetique moderne de tableau de bord VPN - Badges de stats : Pairs Actifs | Donnees Transferees | Temps de fonctionnement | Endpoints ONGLET APERCU : 1. Statut VPN - Statut de l'interface (haut/bas) avec bascule - Affichage de la cle publique (monospace, bouton copie) - Port d'ecoute - Adresse IP (sous-reseau VPN) - Endpoint (si mode client) 2. Statistiques des Pairs - Nombre de pairs actifs - Total des donnees RX/TX (tous pairs combines) - Horodatage du dernier handshake - Indicateurs de qualite de connexion 3. Actions Rapides - Bouton Demarrer/Arreter VPN - Bouton Generer Nouvelle Paire de Cles - Bouton Telecharger Config - Bouton Ajouter Pair (modal rapide) ONGLET PAIRS : 1. Gestion des Pairs - Grille de cartes de pairs : * Chaque carte : nom, cle publique (tronquee), IPs autorisees, endpoint, statut * Bordure codee par couleur (vert=actif, orange=obsolete, rouge=deconnecte) * Heure du dernier handshake (ex: "il y a 2 minutes") * Compteurs de transfert de donnees (RX/TX) * Boutons Editer et Supprimer 2. Dialogue Ajouter Pair - Generer une paire de cles automatiquement OU coller une cle publique existante - Assigner une adresse IP VPN (auto-suggerer la prochaine disponible) - Definir les IPs autorisees (0.0.0.0/0 pour tunnel complet, sous-reseaux specifiques pour split) - Optionnel : intervalle de keepalive persistant - Optionnel : cle pre-partagee (PSK) pour securite post-quantique - Generer le fichier de config et QR code instantanement ONGLET QR CODES : 1. Configuration Client Mobile - Selectionner le pair depuis le menu deroulant - Generer la config client WireGuard - Afficher en QR code (pour scan avec l'app mobile WireGuard) - Afficher aussi le texte de config (copiable) - Bouton telecharger fichier .conf - Inclure les serveurs DNS dans la config 2. Options QR Code - Serveurs DNS personnalises - Inclure toutes les routes vs split tunnel - Configuration MTU - Parametre de keepalive persistant ONGLET TRAFIC : 1. Analytiques de Trafic - Graphique de bande passante en temps reel (par pair) - Graphique de trafic historique (24h, 7j, 30j) - Top utilisateurs de bande passante - Trafic par protocole (si DPI disponible) ONGLET CONFIG : 1. Configuration de l'Interface - Cle privee (masquee par defaut, bouton afficher) - Cle publique (derivee, lecture seule) - Port d'ecoute (51820 par defaut) - Adresses IP (separees par virgules pour multi-sous-reseau) - Taille MTU - Table (numero de table de routage) 2. Parametres Avances - Scripts Pre-up/Post-up - Scripts Pre-down/Post-down - Assignation de zone pare-feu - Bascule masquerading NAT ONGLET PARAMETRES : 1. Parametres VPN Globaux - Bascule demarrage automatique au boot - Intervalle de keep-alive (defaut global) - Protection contre les fuites DNS - Bascule support IPv6 - Niveau de journalisation 2. Configuration Endpoint (pour mode client) - Nom d'hote/IP de l'endpoint serveur - Cle publique du serveur - IPs autorisees (ce qui passe par le VPN) - Keepalive persistant pour traversee NAT TECHNIQUE : - RPCD : luci.wireguard-dashboard - Methodes : status, get_interfaces, get_peers, add_peer, remove_peer, generate_keys, generate_config, generate_qr - Commandes : wg show, wg set, wg genkey, wg pubkey, wg genpsk - Generation QR code : commande qrencode ou bibliotheque JavaScript (qrcodejs) - Generation de modele de fichier de config - Mises a jour de statut des pairs en temps reel AMELIORATIONS UI : - Indicateurs de statut de connexion animes - Bordure en degrade pour les pairs actifs - Copier dans le presse-papiers pour les cles et configs - Dialogues modaux pour ajouter/editer pair - Dialogues de confirmation pour les actions destructives - Notifications toast pour succes/erreur ``` ### 8. Client Guardian (luci-app-client-guardian) **Prompt pour Claude.ai :** ``` Creez un systeme de Controle d'Acces Reseau (NAC) et Portail Captif : DESIGN : - Titre : "Controle d'Acces" avec icone utilisateurs - Focus sur la gestion des appareils et les politiques d'acces - Badges de stats : Total Appareils | Autorises | Bloques | Invites ONGLET APERCU : 1. Resume Reseau - Total des appareils vus (depuis toujours) - Appareils actuellement connectes - Nombre d'appareils autorises - Nombre d'appareils bloques - Appareils invites (portail captif) 2. Activite Recente - 20 derniers evenements de connexion - Chaque evenement : horodatage, MAC, IP, nom d'hote, action (autoriser/bloquer/captif) - Code couleur par type d'action 3. Actions Rapides - Bouton Bloquer Tous les Inconnus (mode verrouillage) - Bouton Autoriser Tout (mode ouvert) - Bouton Effacer les Sessions Invites ONGLET CLIENTS : 1. Tableau des Appareils - Colonnes : MAC, IP, Nom d'hote, Fabricant, Zone, Statut, Actions - Triable par toutes les colonnes - Barre de recherche/filtre - Selection en masse pour actions 2. Modal Details de l'Appareil - Infos completes de l'appareil : MAC, IP, Nom d'hote, Fabricant (depuis prefixe MAC) - Historique de connexion (premiere vue, derniere vue, total connexions) - Assignation de zone actuelle (LAN, Invite, Bloque) - Politiques assignees - Bouton d'edition (changer nom d'hote, zone, politiques) ONGLET ZONES : 1. Gestion des Zones - Zones predefinies : * Confiance (acces complet) * LAN (acces standard) * Invite (acces restreint, portail captif) * IoT (isole, acces limite) * Quarantaine (bloque) 2. Configuration de Zone - Parametres par zone : * Services autorises (HTTP, HTTPS, DNS, etc.) * Limites de bande passante * Restrictions horaires * Regles de communication inter-zones * Regles pare-feu ONGLET PORTAIL CAPTIF : 1. Configuration du Portail Captif - Activer/desactiver le portail - Personnalisation de la page d'accueil : * Upload de logo personnalise * Message de bienvenue (editeur HTML) * Texte des conditions d'utilisation * URL de redirection apres acceptation 2. Themes du Portail - Themes predefinis (Business, Hotel, Cafe, Ecole) - Personnalisation du schema de couleurs - Bouton de previsualisation 3. Parametres du Portail - Duree de session (1h, 4h, 24h, illimitee) - Exiger email avant acces - Exiger verification SMS - Exiger connexion sociale (Facebook, Google) - Autoriser automatiquement les appareils connus ONGLET DESIGN DU PORTAIL : 1. Editeur de Page d'Accueil - Editeur HTML WYSIWYG - Variables de modele (ex: {{client_mac}}, {{client_ip}}) - Upload d'image de fond - Panneau de style CSS - Previsualisation en direct ONGLET LOGS : 1. Logs d'Acces - Log des tentatives de connexion - Decisions autoriser/bloquer - Authentifications portail captif - Filtrer par : plage de temps, MAC, IP, zone, action ONGLET ALERTES : 1. Alertes de Securite - Detection de spoofing MAC - Tentatives de connexion excessives - Appareils inconnus se connectant - Appareils changeant de zones - Configuration des regles d'alerte ONGLET CONTROLE PARENTAL : 1. Filtrage de Contenu - Blocage par categorie de site (adulte, social, gaming, etc.) - Controles d'acces bases sur l'heure (heures d'ecole, heure du coucher) - Politiques par appareil ou par utilisateur - Application de SafeSearch - Mode restreint YouTube 2. Groupes d'Appareils - Grouper les appareils (ex: "Appareils des Enfants") - Appliquer des politiques aux groupes - Regles basees sur le planning (semaine vs weekend) ONGLET PARAMETRES : 1. Parametres Client Guardian - Zone par defaut pour les nouveaux appareils - Application de liaison MAC-IP - Timeout du cache ARP - Integration DHCP (assigner zone selon plage IP) - Niveau de journalisation et retention TECHNIQUE : - RPCD : luci.client-guardian - Methodes : list_clients, update_client, get_zones, configure_portal, get_logs - Integration avec : * nftables/iptables pour le controle d'acces * dnsmasq pour DNS et DHCP * nginx/uhttpd pour le portail captif * ipset pour le regroupement efficace d'appareils - Base de donnees pour le suivi des appareils (SQLite ou UCI) IMPLEMENTATION DU PORTAIL CAPTIF : - Intercepter le trafic HTTP pour les clients non authentifies - Rediriger vers la page d'accueil - Apres acceptation, ajouter a l'ipset autorise - Gestion de session avec cookies ou tokens ``` ### 9. Auth Guardian (luci-app-auth-guardian) **Prompt pour Claude.ai :** ``` Creez un systeme d'authentification et de gestion de sessions avec OAuth2 et bons : DESIGN : - Titre : "Authentification" avec icone cle - Tableau de bord d'authentification professionnel - Badges de stats : Sessions Actives | Fournisseurs OAuth | Bons | Regles de Contournement ONGLET APERCU : 1. Statut d'Authentification - Total des utilisateurs enregistres - Nombre de sessions actives - Fournisseurs OAuth configures - Utilisations de bons aujourd'hui 2. Authentifications Recentes - 20 derniers evenements d'auth - Chaque : horodatage, nom d'utilisateur/email, methode (OAuth/bon/contournement), IP, statut - Code couleur par statut (succes=vert, echec=rouge) ONGLET SESSIONS : 1. Tableau des Sessions Actives - Colonnes : Utilisateur, ID Session, Debut, Derniere Activite, IP, Appareil, Actions - Details de session au clic - Bouton revoquer session (avec confirmation) - Bouton forcer deconnexion de toutes les sessions 2. Gestion des Sessions - Configuration du timeout de session - Limite de sessions simultanees par utilisateur - Timeout d'inactivite - Duree du "se souvenir de moi" ONGLET BONS : 1. Gestion des Bons - Bouton creer nouveau bon - Tableau des bons : Code, Duree, Utilisations Restantes, Cree, Expire, Statut - Types de bons : * Usage unique (une seule fois) * Usage multiple (X utilisations) * Limite dans le temps (expire apres duree) * Limite en bande passante (quota X Go) 2. Dialogue Creer un Bon - Generer code aleatoire OU code personnalise - Duree du bon (1h, 4h, 24h, 7j, 30j, illimitee) - Limite d'utilisation (1, 10, 100, illimitee) - Quota de bande passante (optionnel) - Champ notes/description - Bouton imprimer bon (page imprimable avec code) 3. Generation de Bons en Masse - Generer X bons d'un coup - Exporter en CSV - Imprimer feuille (plusieurs bons par page) ONGLET OAUTH : 1. Configuration des Fournisseurs OAuth - Fournisseurs supportes : * Google OAuth * GitHub OAuth * Facebook Login * Microsoft Azure AD * Fournisseur OAuth2 personnalise 2. Configuration du Fournisseur - Saisie Client ID - Saisie Client Secret (masque) - URI de redirection (auto-genere) - Configuration des scopes - Activer/desactiver par fournisseur - Bouton de test (initie le flux OAuth) 3. Mappage Utilisateur - Mapper les attributs OAuth aux champs utilisateur locaux - Creation auto de l'utilisateur a la premiere connexion OAuth - Assignation de groupe basee sur les claims OAuth ONGLET PAGE D'ACCUEIL : 1. Personnalisation de la Page de Connexion - Upload de logo personnalise - Editeur de texte de bienvenue - Methodes d'auth activees (boutons OAuth, saisie bon, lien contournement) - Image de fond ou degrade - Schema de couleurs - Bouton de previsualisation ONGLET REGLES DE CONTOURNEMENT : 1. Configuration de Contournement - Liste blanche d'adresses MAC (pas d'auth requise) - Liste blanche de plages IP - Liste blanche de noms d'hote (patterns regex) - Contournement base sur l'heure (ex: heures de bureau, tous les appareils autorises) 2. Liste de Contournement - Tableau : MAC/IP, Description, Ajoute, Expire - Ajouter/supprimer des regles de contournement - Contournement temporaire (expire apres X heures) ONGLET LOGS : 1. Logs d'Authentification - Toutes les tentatives d'auth (succes et echec) - Filtrer par : plage de dates, nom d'utilisateur, methode, IP - Exporter en CSV - Visualisations : * Tentatives d'auth dans le temps (graphique en ligne) * Repartition des methodes d'auth (camembert) * Tentatives echouees par IP (graphique en barres) ONGLET PARAMETRES : 1. Parametres Auth Guardian - Exiger authentification (bascule globale) - Duree de session par defaut - Politique de mot de passe (si utilisateurs locaux) - Authentification a deux facteurs (TOTP) - Limites de tentatives de connexion (protection brute force) - Stockage de session (memoire vs base de donnees) TECHNIQUE : - RPCD : luci.auth-guardian - Methodes : status, list_providers, list_vouchers, create_voucher, delete_voucher, validate_voucher, list_sessions, revoke_session - Implementation OAuth : * Flux de code d'autorisation * Validation de token JWT * Appels API specifiques au fournisseur - Systeme de bons : * Generation de code aleatoire (alphanumerique, 8-16 caracteres) * Suivi d'expiration (tache cron ou daemon) * Journalisation des utilisations - Gestion de session : * Basee sur cookie ou token * Stockage Redis ou en memoire pour les sessions * Tache de nettoyage de session INTEGRATION : - Fonctionne avec Client Guardian pour le portail captif - Integration pare-feu pour acces post-auth - Support RADIUS (optionnel, pour entreprise) ``` --- ## Modules de Bande Passante et Trafic ### 10. Gestionnaire de Bande Passante (luci-app-bandwidth-manager) **Prompt pour Claude.ai :** ``` Creez un systeme complet de QoS et de gestion de bande passante : DESIGN : - Titre : "Gestionnaire de Bande Passante" avec icone signal - Focus sur la mise en forme du trafic et les quotas - Badges de stats : Regles Actives | Bande Passante Totale | Clients Suivis | Quotas ONGLET APERCU : 1. Resume de la Bande Passante - Bande passante totale disponible (liaison montante/descendante WAN) - Utilisation actuelle (jauge temps reel) - Utilisation maximale (maximum du jour) - Utilisation moyenne (24h) 2. Top Utilisateurs de Bande Passante - Tableau : IP/Nom d'hote, Download, Upload, Total, Pourcentage - Mises a jour temps reel - Cliquer pour appliquer une regle rapide 3. Classification du Trafic - Par protocole : HTTP, HTTPS, DNS, P2P, Streaming, Gaming - Par priorite : Haute, Moyenne, Basse, Masse - Visualisation en camembert ONGLET REGLES : 1. Tableau des Regles QoS - Colonnes : Nom, Source, Destination, Service, Priorite, Limite de Debit, Statut - Triable et filtrable - Bascule activer/desactiver par regle - Actions Editer/Supprimer 2. Dialogue Ajouter une Regle - Type de regle : Limite de Bande Passante, Priorite, Garantie - Criteres de correspondance : * IP/MAC/Sous-reseau source * IP/Sous-reseau destination * Port/Service (HTTP, HTTPS, SSH, etc.) * Protocole (TCP, UDP, ICMP) * Application (basee sur DPI, si disponible) - Action : * Definir limite de download (kbps/mbps) * Definir limite d'upload * Definir priorite (1-7, ou noms de classe) * Garantir bande passante minimale - Planning (toujours, base sur l'heure, jour de la semaine) ONGLET QUOTAS : 1. Quotas de Bande Passante - Quotas par appareil - Quotas par utilisateur - Quotas famille (groupe d'appareils) - Quotas bases sur le temps (quotidien, hebdomadaire, mensuel) 2. Configuration de Quota - Definir montant du quota (Go) - Definir periode du quota (jour/semaine/mois) - Action en cas de depassement de quota : * Bloquer tout le trafic * Limiter a X kbps * Envoyer notification uniquement - Planning de reinitialisation du quota - Reporter le quota non utilise (optionnel) 3. Tableau de Bord d'Utilisation des Quotas - Cartes par appareil/utilisateur montrant : * Limite du quota * Montant utilise * Restant * Barre de progression avec code couleur * Date de reinitialisation - Seuil d'avertissement (notifier a 80%, 90%) ONGLET UTILISATION : 1. Historique d'Utilisation - Graphiques : * Utilisation quotidienne (30 derniers jours) en barres * Utilisation horaire (24 dernieres heures) en ligne * Utilisation hebdomadaire (12 dernieres semaines) en aire - Filtrer par appareil, service, direction (montant/descendant) - Exporter en CSV 2. Statistiques d'Utilisation - Total transfere ce mois - Utilisation quotidienne moyenne - Heure de pointe (quand l'utilisation est maximale) - Applications en tendance ONGLET MEDIA : 1. Detection du Trafic Media - Services de streaming : Netflix, YouTube, Disney+, Twitch, etc. - VoIP : Zoom, Teams, Discord, appels WhatsApp - Gaming : Steam, PlayStation, Xbox Live - Reseaux Sociaux : Facebook, Instagram, TikTok 2. Regles Specifiques aux Medias - Modeles rapides : * Prioriser VoIP sur le streaming * Limiter le streaming pendant les heures de travail * Limiter la bande passante gaming - Allocation de bande passante par service - Limitation basee sur la qualite (detection 4K vs 720p) ONGLET CLASSES : 1. Classes de Trafic (HTB/CAKE) - Classes predefinies : * Temps Reel (VoIP, gaming) : priorite maximale * Interactif (navigation web, SSH) : haute priorite * Masse (telechargements, mises a jour) : basse priorite * Defaut : priorite moyenne 2. Configuration de Classe - Allocation de bande passante par classe (pourcentage ou absolu) - Emprunt (permettre a la classe d'utiliser la bande passante inutilisee des autres) - Plafond (bande passante maximale qu'une classe peut utiliser) - Quantum (taille de paquet pour mise en file d'attente equitable) ONGLET CLIENTS : 1. Gestion Par Client - Liste des clients avec utilisation actuelle de bande passante - Actions rapides : * Definir limite de bande passante pour le client * Appliquer quota au client * Bloquer le client temporairement * Assigner a une classe de trafic ONGLET PLANNINGS : 1. Gestion des Plannings - Creer des regles basees sur l'heure - Exemples : * Heures de bureau (9h-17h Lun-Ven) : prioriser les apps business * Soiree (18h-23h) : permettre le streaming * Nuit tardive (23h-6h) : tout limiter - Vue calendrier des plannings - Detection des conflits ONGLET PARAMETRES : 1. Parametres Globaux - Limites de bande passante WAN (montant/descendant en Mbps) - Algorithme QoS : CAKE, HTB, SFQ, FQ_CODEL - Activer/desactiver QoS globalement - Classe de trafic par defaut - Test de bande passante (mesurer la vitesse WAN reelle) 2. Parametres Avances - Marquage DSCP - ECN (Notification Explicite de Congestion) - Calcul d'overhead (pour PPPoE, etc.) - Octets d'overhead par paquet - Adaptation de la couche liaison TECHNIQUE : - RPCD : luci.bandwidth-manager - Methodes : getStats, getRules, addRule, deleteRule, getQuotas, setQuota, getUsage - Implementation QoS : * Commandes tc (traffic control) pour HTB * qdisc cake pour QoS moderne * iptables conntrack pour comptabilite d'utilisation * metres nftables pour limitation de debit - Base de donnees : * SQLite ou UCI pour regles et quotas * RRD pour donnees historiques de bande passante * Compteurs iptables pour stats temps reel AMELIORATIONS VISUELLES : - Graphiques jauge de bande passante (animes) - Sparklines pour les tendances - Barres de quota codees par couleur - Cartes de regles responsives ``` ### 11. Mise en Forme du Trafic (luci-app-traffic-shaper) **Prompt pour Claude.ai :** ``` Creez un module avance de mise en forme du trafic avec anti-bufferbloat (CAKE) : DESIGN : - Titre : "Mise en Forme du Trafic" avec icone fusee - Focus technique/avance - Badges de stats : Files Actives | Latence Moy. | Perte de Paquets | Debit ONGLET APERCU : 1. Statut du Shaper - Bascule statut QoS active - Algorithme actif (CAKE, HTB, FQ_CODEL) - Interfaces mises en forme (WAN, LAN) - Latence actuelle (ping vers 1.1.1.1) 2. Metriques de Performance - Temps aller-retour (RTT) sous charge - Taille du buffer (actuel vs optimal) - Taux de perte de paquets - Debit (reel vs configure) 3. Test de Bufferbloat - Bouton executer test de vitesse DSLReports - Afficher resultats : download, upload, latence, note - Graphique historique des resultats de test ONGLET CLASSES : 1. Classes de Trafic (hierarchie HTB) - Classe racine (bande passante totale) - Classes enfants avec priorite : * Expedited Forwarding (EF) : VoIP, gaming * Assured Forwarding (AF) : apps business * Best Effort (BE) : web, email * Background (telechargements en masse) 2. Configuration de Classe - Debit (bande passante garantie) - Plafond (bande passante maximale) - Priorite (1-7) - Quantum (taille de paquet) - Burst (permettre depassement temporaire) ONGLET REGLES : 1. Regles de Classification - Criteres de correspondance : * Champ DSCP/TOS * Numeros de port * Adresses IP * Protocole * Signature DPI - Action : assigner a une classe de trafic - Priorite de regle (1-999) 2. Modeles de Regles - Regles predefinies : * Optimisation VoIP (ports SIP, RTP) * Optimisation gaming (serveurs de jeu connus) * Depriorisation streaming * Limitation P2P - Application en un clic ONGLET STATS : 1. Statistiques des Files - Metriques par classe : * Paquets envoyes * Octets envoyes * Rejets (indicateur de surcharge) * Depassements (atteintes du plafond) * Remises en file - Graphiques temps reel et historiques 2. Statistiques d'Interface - Compteurs par interface - Graphiques de profondeur de file - Mesures de latence (ping ICMP ou horodatage) ONGLET PRESELECTIONS : 1. Preselections QoS - Preselection Gaming (latence minimale, prioriser ports gaming) - Preselection Streaming (equilibre, permettre bande passante streaming) - Preselection Business (prioriser VoIP, bureau distant) - Preselection Equilibree (usage domestique general) - Preselection Manuelle (configuration personnalisee) 2. Configuration de Preselection - Selectionner la preselection depuis le menu deroulant - Auto-configurer tous les parametres - Afficher ce qui va changer (apercu diff) - Bouton Appliquer ONGLET CONFIGURATION CAKE : 1. Parametres CAKE - Bande passante (montant/descendant en Mbps) - Overhead : * Aucun * ADSL (avec entrelacement) * VDSL2 * Ethernet * PPPoE - Adaptation couche liaison : * Ethernet * ATM * PTM - Flux : * Triple-isolate (IP source, IP dest, port) * Dual-srchost * Dual-dsthost * Per-host - Diffserv : * Diffserv4 (4 tins) * Diffserv3 (3 tins) * Besteffort (file unique) - ECN : activer/desactiver - Filtre ACK : activer/desactiver (pour liens montants lents) TECHNIQUE : - RPCD : luci.traffic-shaper - Commandes : * tc qdisc add/del/replace * tc class add/del/change * tc filter add/del * configuration qdisc cake - Surveillance temps reel : * tc -s qdisc show * tc -s class show * Parser la sortie pour les statistiques - Test de latence : * Commande ping avec horodatages * Integration avec fping ou hping3 AMELIORATIONS VISUELLES : - Graphique de latence temps reel (mise a jour en direct) - Sparklines de taux de perte de paquets - Vue arborescente de la hierarchie des classes - Classes codees par couleur selon la priorite ``` ### 12. Media Flow (luci-app-media-flow) **Prompt pour Claude.ai :** ``` Creez un tableau de bord de detection du streaming media et trafic VoIP : DESIGN : - Titre : "Moniteur Media" avec icone cinema - Focus sur les services de streaming et appels video - Badges de stats : Streams Actifs | Appels VoIP | Bande Passante Utilisee | Services ONGLET TABLEAU DE BORD : 1. Streams Media Actifs - Cartes pour chaque stream actif : * Logo du service (Netflix, YouTube, etc.) * Appareil client (IP, nom d'hote) * Estimation de qualite du stream (4K, 1080p, 720p, SD) * Debit actuel (Mbps) * Duree - Code couleur par type de service (streaming=rouge, VoIP=vert) 2. Repartition par Service - Camembert : bande passante par service - Services : * Netflix, Amazon Prime, Disney+, Hulu, HBO Max * YouTube, Twitch, Vimeo * Spotify, Apple Music, Pandora * Zoom, Teams, Meet, Webex * WhatsApp, Telegram, FaceTime ONGLET SERVICES : 1. Grille des Services de Streaming - Chaque service en carte : * Icone/logo * Bande passante totale utilisee aujourd'hui * Sessions actives * Qualite maximale detectee * Duree moyenne de session - Cliquer sur la carte pour details 2. Historique du Service - Utilisation par service dans le temps - Distribution de qualite (frequence 4K vs HD vs SD) - Heures de visionnage de pointe ONGLET CLIENTS : 1. Utilisation Media par Appareil - Tableau : Appareil, Service, Qualite, Debit, Duree - Grouper par appareil - Afficher consommation media totale par appareil - Identifier les gros utilisateurs de streaming ONGLET HISTORIQUE : 1. Activite Media Historique - Vue chronologique de toutes les sessions media - Filtrer par : plage de dates, service, appareil, qualite - Exporter en CSV - Graphiques : * Heures de streaming quotidiennes * Tendances de popularite des services * Correlation qualite vs bande passante ONGLET ALERTES : 1. Alertes Media - Alertes de streaming excessif - Alertes de degradation de qualite (4K tombe a 720p) - Problemes de qualite VoIP (perte de paquets, gigue) - Detection de nouveau service - Patterns inhabituels (ex: streaming a 3h du matin) 2. Configuration des Alertes - Definir seuils pour les alertes - Methodes de notification (interface web, email, webhook) - Regles d'alerte par appareil TECHNIQUE : - RPCD : luci.media-flow - Integration DPI : * Netifyd pour detection d'application * Bibliotheque nDPI pour inspection approfondie * Correspondance de signature pour protocoles streaming - Estimation de qualite : * Analyse de debit (ex: >15 Mbps = 4K, 5-15 Mbps = 1080p) * Parsing de manifest DASH/HLS (si accessible) - Detection VoIP : * Ports et patterns RTP/RTCP * Detection de signalisation SIP * Detection WebRTC PROTOCOLES STREAMING : - HLS (HTTP Live Streaming) - DASH (Dynamic Adaptive Streaming) - RTMP (Real-Time Messaging Protocol) - RTP (pour VoIP) - WebRTC (pour appels video) ``` --- ## Modules de Performance et Services ### 13. Cache CDN (luci-app-cdn-cache) **Prompt pour Claude.ai :** ``` Creez un tableau de bord de proxy cache CDN avec analytiques d'economies de bande passante : DESIGN : - Titre : "Cache CDN" avec icone eclair - Focus sur la performance et les economies - Badges de stats : Taux de Hit Cache | Bande Passante Economisee | Objets en Cache | Stockage Utilise ONGLET APERCU : 1. Performance du Cache - Pourcentage de taux de hit (grand graphique jauge) - Requetes aujourd'hui : total, hits, misses - Estimation de bande passante economisee (Go et pourcentage) - Utilisation du stockage (utilise/total) 2. Top Contenu en Cache - Tableau : URL/domaine, Hits, Taille, Dernier Acces - Repartition par types de contenu (images, videos, scripts, docs) - Camembert : trafic en cache vs non cacheable ONGLET CACHE : 1. Navigateur d'Objets en Cache - Liste des objets en cache : * URL * Content-Type * Taille * Expiration * Nombre de hits * Actions (voir, purger) - Recherche et filtre - Purge en masse par pattern 2. Statistiques du Cache - Total des objets - Taille moyenne des objets - Plus gros objets - Objets les plus touches - Nombre expirant bientot ONGLET POLITIQUES : 1. Politiques de Cache - Domaines a mettre en cache (liste blanche) - Domaines a ne jamais mettre en cache (liste noire) - Types de contenu a mettre en cache (image/*, video/*, text/css, etc.) - Taille maximale d'objet (Mo) - Duree de cache (TTL) par type de contenu 2. Regles de Cache - Editeur de regles : * Pattern URL de correspondance (regex) * Remplacement de duree de cache * Decision de cache ou contournement * Priorite (1-100) ONGLET STATISTIQUES : 1. Metriques de Performance - Comparaison temps de reponse : cache hit vs miss - Graphiques de bande passante : cache vs origine - Taux de requetes dans le temps - Tendances d'efficacite du cache (24h, 7j, 30j) 2. Calculateur d'Economies - Bande passante originale utilisee (sans cache) - Bande passante economisee (Go) - Estimation d'economies de cout ($ par Go du FAI) - Amelioration du temps de reponse (ms) ONGLET MAINTENANCE : 1. Maintenance du Cache - Bouton purger tout (avec confirmation) - Purger par pattern (ex: *.youtube.com/*) - Purger objets expires - Optimiser base de donnees (reconstruire index) - Prechauffer cache (prefetcher URLs populaires) 2. Gestion du Stockage - Repartition de l'utilisation du stockage - Parametres d'eviction LRU (moins recemment utilise) - Configuration de la taille max du cache - Emplacement de stockage (disque, RAM, ou hybride) ONGLET PARAMETRES : 1. Configuration du Cache CDN - Activer/desactiver le cache - Serveurs DNS amont - Port proxy (transparent ou explicite) - Gestion des certificats SSL (bump ou pass-through) - Niveau de journalisation 2. Parametres Avances - Cache negatif (mettre en cache les 404, etc.) - Gestion des requetes de plage - Support de l'en-tete Vary - Validation ETag - Stale-while-revalidate TECHNIQUE : - RPCD : luci.cdn-cache - Logiciel de cache : * Proxy Squid * Proxy cache Nginx * Varnish * uhttpd d'OpenWrt avec module de cache - Methodes : getStats, getCacheObjects, purge, setPolicies - Backend de stockage : systeme de fichiers ou base de donnees - Surveillance : parsing des logs d'acces pour hit/miss AMELIORATIONS VISUELLES : - Jauge animee pour le taux de hit - Sparklines pour les metriques en tendance - Economies codees par couleur (vert = economies elevees) - Graphiques de comparaison avant/apres ``` ### 14. Gestionnaire VHost (luci-app-vhost-manager) **Prompt pour Claude.ai :** ``` Creez un gestionnaire d'hotes virtuels et de proxy inverse avec SSL automatique : DESIGN : - Titre : "Hotes Virtuels" avec icone globe - Focus sur l'hebergement web et le proxying - Badges de stats : VHosts Actifs | Certificats SSL | Requetes Totales | Disponibilite ONGLET APERCU : 1. Resume VHost - Total des hotes virtuels configures - Actifs (actives) vs inactifs - Nombre d'hotes avec SSL - Avertissements d'expiration de certificat 2. Actions Rapides - Bouton Ajouter VHost - Bouton Demander Certificat SSL - Bouton Voir les Logs d'Acces ONGLET VHOSTS : 1. Liste des Hotes Virtuels - Cartes pour chaque vhost : * Nom de domaine * Type (proxy inverse, site statique, redirection) * Backend (si proxy) * Statut (active/desactive) * Statut SSL (valide, expirant, aucun) * Actions (editer, desactiver, supprimer, voir logs) 2. Dialogue Ajouter/Editer VHost - Saisie nom de domaine (validation DNS auto) - Type de VHost : * Proxy Inverse (proxy vers serveur backend) * Site Statique (servir depuis repertoire) * Redirection (301/302 vers autre URL) - Configuration backend (pour proxy) : * URL Backend (http://192.168.1.10:8080) * Protocole (HTTP, HTTPS, WebSocket) * Equilibrage de charge (si multiples backends) - Configuration SSL : * Auto (Let's Encrypt via ACME) * Manuel (telecharger cert + cle) * Aucun (HTTP uniquement) - Avance : * En-tetes personnalises * Controle d'acces (autoriser/refuser IPs) * Reecriture de requete ONGLET INTERNE : 1. Services Internes - Proxys predefinis pour services communs : * LuCI lui-meme * Netdata * Tableau de bord CrowdSec * RustDesk * Apps personnalisees - Activer proxy en un clic pour service interne ONGLET CERTIFICATS : 1. Gestion des Certificats SSL - Liste des certificats : * Domaine * Emetteur (Let's Encrypt, auto-signe, CA) * Valide De - Valide Jusqu'a * Jours jusqu'a expiration * Actions (renouveler, revoquer, telecharger, supprimer) 2. Configuration ACME - Fournisseur ACME (Let's Encrypt production/staging, ZeroSSL, BuyPass) - Email pour notifications - Type de challenge : * HTTP-01 (validation port 80) * DNS-01 (validation enregistrement TXT) * TLS-ALPN-01 (validation port 443) - Bascule renouvellement auto (renouveler quand <30 jours restants) 3. Demander un Certificat - Saisie domaine (supporte wildcards avec DNS-01) - Selecteur de methode de validation - Bouton emettre (affiche progression) ONGLET SSL : 1. Parametres SSL/TLS - Parametres SSL globaux : * Version TLS minimale (1.0, 1.1, 1.2, 1.3) * Suites de chiffrement * HSTS (HTTP Strict Transport Security) * Agrafage OCSP - Remplacements par vhost ONGLET REDIRECTIONS : 1. Regles de Redirection - Redirections simples : * Depuis domaine/chemin * Vers URL * Type (301 permanent, 302 temporaire, 307 temporaire preserve methode) - Redirections wildcard - Redirections basees sur regex ONGLET LOGS : 1. Logs d'Acces - Log d'acces combine pour tous les vhosts - Filtrer par vhost, IP, code de statut, date - Colonnes : Horodatage, IP, Methode, Chemin, Statut, Octets, Referrer, User-Agent - Streaming de log temps reel - Exporter en CSV 2. Logs d'Erreur - Erreurs proxy (backend injoignable, timeout) - Erreurs SSL (cert invalide, expire) - Erreurs de configuration TECHNIQUE : - RPCD : luci.vhost-manager - Logiciel de proxy inverse : * Nginx * HAProxy * Caddy (pour SSL auto) * Apache - Client ACME : * Script acme.sh * Certbot * ACME integre Caddy - Methodes : getVHosts, addVHost, deleteVHost, requestCertificate, getLogs INTEGRATION : - Validation DNS via API (Cloudflare, etc.) - Mises a jour DNS dynamique - Ouverture de port pare-feu (80, 443) - Gestion des limites de taux Let's Encrypt ``` ### 15. Gestionnaire KSM (luci-app-ksm-manager) **Prompt pour Claude.ai :** ``` Creez un tableau de bord de gestion de cles cryptographiques et secrets avec support HSM : DESIGN : - Titre : "Gestion des Cles" avec icone cadenas - Axe securite, esthetique professionnelle - Badges de stats : Total Cles | Cles Actives | Certificats | Secrets ONGLET APERCU : 1. Statut de Gestion des Cles - Total des cles gerees - Repartition des types de cles (RSA, ECDSA, ED25519) - Cles expirant (30 prochains jours) - Statut HSM (si connecte) 2. Activite Recente - Dernieres operations de cle : generee, utilisee, pivotee, revoquee - Journal d'audit (20 dernieres entrees) ONGLET CLES : 1. Liste des Cles Cryptographiques - Tableau : ID Cle, Type, Taille, Usage, Cree, Expire, Statut - Types de cles : * Cles de signature (pour code, documents) * Cles de chiffrement (pour donnees au repos) * Cles d'authentification (SSH, TLS client) - Actions : voir, exporter publique, pivoter, revoquer, supprimer 2. Dialogue Generer une Cle - Selection d'algorithme : * RSA (2048, 3072, 4096 bits) * ECDSA (P-256, P-384, P-521) * ED25519 - Drapeaux d'usage : * Signature numerique * Chiffrement de cle * Chiffrement de donnees - Stockage : * Logiciel (systeme de fichiers) * HSM (si disponible) * TPM (si disponible) - Protection par phrase de passe (optionnel) ONGLET HSM : 1. Module de Securite Materiel - Statut de connexion HSM - Info HSM : fabricant, modele, version firmware - Emplacements de cle disponibles - Operations HSM : * Initialiser HSM * Generer cle sur HSM * Importer cle vers HSM * Sauvegarder HSM ONGLET CERTIFICATS : 1. Gestion des Certificats X.509 - Liste : Sujet, Emetteur, Valide De/A, Serial, Empreinte - Vue chaine de certificats - Actions : voir details, exporter (PEM/DER), revoquer 2. Demande de Certificat (CSR) - Generer CSR pour signature par CA - Champs : CN, O, OU, C, ST, L, Email - Extensions d'usage de cle - Exporter CSR pour soumission a CA 3. Certificats Auto-Signes - Generation rapide de cert auto-signe - Selection de periode de validite - Noms alternatifs de sujet (SANs) ONGLET SECRETS : 1. Stockage de Secrets (Coffre) - Stockage de secrets cle-valeur - Liste des secrets : Nom, Type, Cree, Dernier Acces - Types de secrets : * Mot de passe * Cle API * Token * Chaine de connexion - Chiffre au repos - Controle d'acces (quels utilisateurs/apps peuvent acceder) 2. Dialogue Ajouter un Secret - Nom du secret (base sur chemin : db/prod/password) - Valeur du secret (saisie masquee) - TTL (duree de vie, expiration auto) - Controle de version (garder anciennes versions) ONGLET SSH : 1. Gestion des Cles SSH - Liste des paires de cles SSH - Generer cle SSH (RSA, ED25519, ECDSA) - Importer cle existante - Exporter cle publique (pour authorized_keys) - Gestion des cles autorisees (qui peut se connecter en SSH) ONGLET AUDIT : 1. Journal d'Audit - Toutes les operations de cle journalisees : * Generee, importee, exportee, utilisee, pivotee, revoquee, supprimee - Horodatage, utilisateur, operation, ID cle, resultat - Filtrer par : plage de dates, type d'operation, ID cle, utilisateur - Exporter journal d'audit ONGLET PARAMETRES : 1. Configuration KSM - Emplacement de stockage des cles - Algorithme et taille de cle par defaut - Politique de rotation auto (pivoter cles tous les X jours) - Emplacement et planning de sauvegarde - Parametres de connexion HSM (si supporte) TECHNIQUE : - RPCD : luci.ksm-manager - Stockage de cles : * OpenSSL pour operations de cle * GnuPG pour cles PGP * SSH-keygen pour cles SSH * Integration HSM via PKCS#11 - Chiffrement des secrets : * Chiffrer secrets avec cle maitre * Cle maitre derivee de phrase de passe ou stockee dans HSM - Methodes : listKeys, generateKey, exportKey, importKey, listSecrets, addSecret, getSecret SECURITE : - Tous les secrets chiffres au repos - Journalisation d'audit de toutes les operations - Controle d'acces (base sur les roles) - Suppression securisee des cles (ecraser avant suppression) ``` --- ## Patterns UI Communs a Tous les Modules ### Coherence de Design Global **Tous les modules DOIVENT inclure :** 1. **Pattern d'En-tete de Page** ```javascript E('div', { 'class': 'sh-page-header' }, [ E('div', {}, [ E('h2', { 'class': 'sh-page-title' }, [ E('span', { 'class': 'sh-page-title-icon' }, '[ICONE]'), '[TITRE DU MODULE]' ]), E('p', { 'class': 'sh-page-subtitle' }, '[DESCRIPTION]') ]), E('div', { 'class': 'sh-stats-grid' }, [ // 4 badges de stats minimum ]) ]) ``` 2. **Badges de Stats** (minimum 130px, valeurs monospace) ```javascript E('div', { 'class': 'sh-stat-badge' }, [ E('div', { 'class': 'sh-stat-value' }, '[VALEUR]'), E('div', { 'class': 'sh-stat-label' }, '[LABEL]') ]) ``` 3. **Onglets de Filtre** (pour categorisation) ```javascript E('div', { 'class': 'sh-filter-tabs' }, [ E('div', { 'class': 'sh-filter-tab active', 'data-filter': 'all' }, [ E('span', { 'class': 'sh-tab-icon' }, '[ICONE]'), E('span', { 'class': 'sh-tab-label' }, '[LABEL]') ]) ]) ``` 4. **Cartes avec Bordures Colorees** ```javascript E('div', { 'class': 'sh-card sh-card-success' }, [ E('div', { 'class': 'sh-card-header' }, [ E('h3', { 'class': 'sh-card-title' }, '[TITRE]') ]), E('div', { 'class': 'sh-card-body' }, [ // Contenu ]) ]) ``` 5. **Boutons en Degrade** ```javascript E('button', { 'class': 'sh-btn sh-btn-primary' }, '[ACTION]') ``` 6. **Etats de Chargement** - Ecrans squelettes pendant la recuperation des donnees - Spinner pour les actions de bouton - Barres de progression pour les operations longues 7. **Gestion des Erreurs** - Messages d'erreur conviviaux - Boutons de reessai - Contenu de repli 8. **Design Responsive** - Approche mobile-first - Cartes empilees sur mobile - Grille de stats adaptative (minimum 130px) - Tableaux deviennent defilables ou bases sur cartes --- ## Comment Utiliser Ces Prompts ### Etape 1 : Selectionner le Module Choisissez le module que vous souhaitez regenerer/implementer dans la liste ci-dessus. ### Etape 2 : Copier le Prompt Complet Copiez le prompt entier pour ce module (de "Creez un..." a "AMELIORATIONS VISUELLES :"). ### Etape 3 : Fournir a Claude.ai Collez le prompt dans Claude.ai (conversation claude.ai) avec un contexte supplementaire : ``` J'ai besoin que vous implementiez [NOM DU MODULE] pour OpenWrt LuCI. CONTRAINTES IMPORTANTES : - OpenWrt utilise le framework LuCI (pas React/Vue) - JavaScript utilise le pattern L.view (pas de modules ES6) - Le backend est RPCD (scripts shell) communiquant via ubus - Le CSS doit utiliser les variables de common.css - Tout le code doit etre pret pour la production - Suivre exactement le systeme de design Voici la specification complete : [COLLEZ LE PROMPT ICI] Veuillez fournir : 1. Fichier de vue JavaScript complet 2. Script backend RPCD 3. CSS requis 4. Configuration ACL 5. Configuration de menu JSON Assurez-vous que tout le code correspond a la demo en ligne sur secubox.cybermood.eu ``` ### Etape 4 : Iterer Si necessaire, fournissez des captures d'ecran de la demo en ligne ou demandez des ajustements pour correspondre exactement a l'aspect et au comportement. --- ## Ressources Supplementaires - **Demo en Ligne :** https://secubox.cybermood.eu - **Systeme de Design :** DEVELOPMENT-GUIDELINES.md - **Demarrage Rapide :** QUICK-START.md - **Guide de Build :** CLAUDE.md --- **Version du Document :** 1.0.0 **Derniere mise a jour :** 2025-12-27 **Mainteneur :** CyberMind.fr