[FIX] UI V3 — allineamento help/i18n/KB/ARIA al menu top-nav

Dopo il revamp V3, allineati i layer che descrivevano ancora la sidebar V2:
- topnav-v3.js: aggiunte le pagine orfane in nav (Matrice RACI → Struttura
  interna, Scadenziario → Monitoraggio, Compliance Journey → Guida) + cablato
  data-i18n su gruppi e voci del mega-menu (traduzione IT/EN come in V2).
- i18n.js: nuove chiavi nav V3 (gruppi mega-menu + connettori/whistleblowing/
  normative/cross-analysis/kb/architettura/simulazione/integrazioni/workflow/
  audit ACN/registra incidente).
- AIService.php navigationMapBlock: riscritta sul menu IN ALTO V3 (9 gruppi +
  pulsante "Registra incidente"), sync con topnav-v3.js NAV_GROUPS; ARIA non
  parla più di "barra laterale".
- help.js: corrette le 3 menzioni "sidebar" → barra/menu in alto.
- KB nis2_kb: nuovo docs/kb/V3_UI_NAVIGAZIONE.md + scripts/ingest-v3-ui-doc.php
  (ingerito host-side: 3 chunk SYSTEM, rimossi i chunk V2; ARIA RAG ora guida
  sul top-nav).
- Cache-buster ?v=20260627n sui 3 JS modificati su tutte le pagine.

Deploy: JS/HTML statici live via bind-mount; php-fpm reload (host + nis2-app)
per AIService.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
DevEnv nis2-agile
2026-06-27 16:38:07 +02:00
co-authored by Claude Opus 4.8
parent a4150b5389
commit 58b4bdbe5e
41 changed files with 379 additions and 123 deletions
+57
View File
@@ -0,0 +1,57 @@
FONTE: Documentazione interfaccia prodotto NIS2 Agile (interfaccia "V3" — menu in alto, tema navy/oro, font Inter, icone Lucide).
AUTORITA: Team prodotto NIS2 Agile — descrizione UI/navigazione (NON contenuto normativo).
SCOPO: guida operativa per l'assistente AI ARIA, così da indirizzare l'utente nell'interfaccia dell'app. Descrive SOLO struttura e navigazione; nessuna affermazione normativa.
> ⚠️ AGGIORNATO 2026-06-27 — questo documento SOSTITUISCE le versioni precedenti che descrivevano la **sidebar a sinistra** (interfaccia "V2" Bootstrap Italia). Dal 27/6 l'interfaccia è la **V3**: il menu è una **barra IN ALTO** (top-nav a mega-menu), NON più una barra laterale. Gli URL delle pagine restano normali (`dashboard.html`, `risks.html`, …).
# NIS2 Agile — Interfaccia V3: struttura e navigazione
## Com'è fatta l'interfaccia V3
L'app è **multi-pagina** (non SPA): ogni modulo è una pagina a sé. La navigazione avviene da una **barra in alto** (chrome) presente in tutte le pagine applicative; **non esiste più la barra laterale a sinistra**. Tema **navy + oro**, font **Inter**, icone **Lucide**.
La barra in alto ha due righe:
1. **Riga superiore**: logo "N2" e nome "NIS2 Agile" a sinistra; un **campo di ricerca** al centro; a destra il **selettore lingua IT/EN**, il pulsante **rosso "Registra incidente"**, e il **menu utente** (avatar + nome → apre Impostazioni, versione/changelog, Esci). Per i consulenti multi-organizzazione, a destra compare anche un **selettore azienda** (org-switcher).
2. **Riga di navigazione**: voci con **menu a tendina (mega-menu)**. La voce/gruppo della pagina corrente è evidenziata (bordo oro, `aria-current`).
In basso a destra restano i **3 pulsanti flottanti (FAB)**: assistente **ARIA** (chat), **segnalazione** bug/supporto, **notifiche** (campana con badge contatore).
## Voci del menu in alto (mega-menu)
Voci dirette (senza tendina):
- **Dashboard** → panoramica conformità.
- **Calendario** → scadenze e adempimenti in vista mese/lista.
Gruppi a tendina:
- **Stakeholders**: *Stakeholders* (soggetti interni/esterni) · *Supply-Chain* (rischio fornitori) · *Attività su Stakeholders* (interazioni e impegni).
- **Struttura interna**: *Organigramma* (ruoli e deleghe) · *Competenze* (skill matrix) · *GAP Analysis* (assessment di conformità) · *Matrice RACI* (responsabilità R/A/C/I) · *Formazione* (piani formativi).
- **Rischi**: *Mappa dei rischi* (registro rischi e trattamenti) · *Inventario* (asset e perimetro tecnico) · *Policy* (politiche) · *Connettori Discovery* (scansione rete/cloud che auto-popola l'Inventario).
- **Monitoraggio**: *Segnalazioni ricevute* (whistleblowing) · *Audit interni* · *Audit ACN* (verifiche/report dell'autorità) · *Controlli periodici* · *Riesame di Direzione* (§9.3) · *Scadenziario* (revisioni ricorrenti).
- **Lex e ISO**: *Normative* (Direttiva e decreto) · *Modello SGSI (ISO 27001)* · *Misure e requisiti ACN* (misure tecniche/organizzative).
- **AI**: *AI Cross-Analysis* (analisi trasversale) · *Knowledge Base* (procedure e linee guida).
- **Guida**: *Guida all'uso* · *Compliance Journey* (percorso guidato) · *Integrazioni Esterne* · *Impostazioni* · *Architettura* · *Simulazione Demo*.
## Dove trovo… (mappa funzioni → menu)
- **Registrare un incidente** → pulsante **rosso "Registra incidente"** in alto a destra (porta alla pagina Incidenti).
- **Inventario degli asset** → menu **Rischi → Inventario**.
- **Valutare la rilevanza NIS2 di un asset** → menu Rischi → Inventario, pulsante "Valuta Rilevanza NIS2" sulla riga dell'asset.
- **Valutazione del rischio / matrice** → menu **Rischi → Mappa dei rischi**.
- **Misure e requisiti ACN** → menu **Lex e ISO → Misure e requisiti ACN**.
- **Gap analysis / assessment** → menu **Struttura interna → GAP Analysis**.
- **Modello SGSI / SoA / 111 controlli ISO 27001** → menu **Lex e ISO → Modello SGSI (ISO 27001)**.
- **Fornitori / supply chain** → menu **Stakeholders → Supply-Chain**.
- **Segnalazioni whistleblowing** → menu **Monitoraggio → Segnalazioni ricevute**.
- **Impostazioni, membri, API key, branding** → menu utente (in alto a destra) → **Impostazioni**, oppure menu **Guida → Impostazioni**.
- **Cambiare lingua** → selettore **IT/EN** in alto a destra.
- **Aiuto contestuale** → pulsante **"?"** presente nelle pagine (apre la guida della pagina); chat **ARIA** dal FAB in basso a destra.
## Pagine pubbliche (senza menu in alto)
Login, registrazione, onboarding, recupero password, landing e la pagina di **segnalazione anonima** NON hanno la barra di navigazione: sono pagine pubbliche. Le pagine standalone `simulate`/`simulate-b2b` (demo) e i portali esterni (questionario fornitore, portale stakeholder) non usano la chrome dell'app.
## Regole per l'assistente
- Indica sempre **il menu in alto** e il gruppo (es. "menu **Rischi → Inventario**"). **Non** dire "barra laterale" o "sidebar": non esiste più.
- Usa **solo** i nomi delle voci elencate qui sopra; non inventare moduli, "fasi" o codici.
- Non citare nomi di file o URL interni: l'utente naviga dalle voci di menu.