// ============================================================ // Settings.jsx — provider AI completi + connettori + governance // ============================================================ // Catalogo modelli disponibili (Claude + Gemini + DeepSeek). // NB: il catalogo è una guida non esaustiva. L'utente può digitare un model id // custom nel campo "Custom model" sotto la lista per usare modelli non listati // (es. modelli appena rilasciati o varianti experimental). Il backend accetta // qualsiasi stringa: il provider stesso valida che l'id esista. const MODEL_CATALOG = { claude: [ { id: 'claude-opus-4-7', name: 'Claude Opus 4.7', tier: 'Flagship', ctx: '1M', out: '32K', cost: '$15 / $75', best: 'Ragionamento estremo · context 1M token', recommended: true }, { id: 'claude-sonnet-4-6', name: 'Claude Sonnet 4.6', tier: 'Balanced', ctx: '200K', out: '64K', cost: '$3 / $15', best: 'Coding agentic + tool use multi-turn' }, { id: 'claude-haiku-4-5', name: 'Claude Haiku 4.5', tier: 'Fast', ctx: '200K', out: '8K', cost: '$1 / $5', best: 'Bassa latenza, task brevi' }, { id: 'claude-opus-4-1', name: 'Claude Opus 4.1', tier: 'Flagship', ctx: '200K', out: '32K', cost: '$15 / $75', best: 'Reasoning legacy, analisi complesse' }, { id: 'claude-sonnet-4-5', name: 'Claude Sonnet 4.5', tier: 'Balanced', ctx: '200K', out: '64K', cost: '$3 / $15', best: 'Stabile · coding e agenti' }, { id: 'claude-sonnet-4', name: 'Claude Sonnet 4', tier: 'Balanced', ctx: '200K', out: '64K', cost: '$3 / $15', best: 'Generazione di lungo formato' }, { id: 'claude-opus-4', name: 'Claude Opus 4', tier: 'Flagship', ctx: '200K', out: '32K', cost: '$15 / $75', best: 'Analisi tecniche avanzate' }, { id: 'claude-sonnet-3-7', name: 'Claude Sonnet 3.7', tier: 'Balanced', ctx: '200K', out: '64K', cost: '$3 / $15', best: 'Reasoning esteso legacy' }, { id: 'claude-haiku-3-5', name: 'Claude Haiku 3.5', tier: 'Fast', ctx: '200K', out: '8K', cost: '$0.80 / $4', best: 'Classificazione, routing' }, ], gemini: [ { id: 'gemini-2-5-pro', name: 'Gemini 2.5 Pro', tier: 'Flagship', ctx: '1M', out: '64K', cost: '$1.25 / $10', best: 'Context lungo, multimodale', recommended: true }, { id: 'gemini-2-5-flash', name: 'Gemini 2.5 Flash', tier: 'Balanced', ctx: '1M', out: '64K', cost: '$0.30 / $2.50', best: 'Throughput alto, reasoning' }, { id: 'gemini-2-5-flash-lite', name: 'Gemini 2.5 Flash-Lite',tier: 'Fast', ctx: '1M', out: '64K', cost: '$0.10 / $0.40', best: 'Volumi massivi, cost-sensitive' }, { id: 'gemini-2-0-flash', name: 'Gemini 2.0 Flash', tier: 'Balanced', ctx: '1M', out: '8K', cost: '$0.10 / $0.40', best: 'Multimodale real-time' }, { id: 'gemini-2-0-flash-lite', name: 'Gemini 2.0 Flash-Lite',tier: 'Fast', ctx: '1M', out: '8K', cost: '$0.075 / $0.30', best: 'Latenza minima' }, { id: 'gemini-1-5-pro', name: 'Gemini 1.5 Pro', tier: 'Flagship', ctx: '2M', out: '8K', cost: '$1.25 / $5', best: 'Legacy · context 2M token (deprecato Q3-2026)' }, ], deepseek: [ { id: 'deepseek-chat', name: 'DeepSeek V3.x · Chat (alias latest)', tier: 'Balanced', ctx: '128K', out: '8K', cost: '$0.27 / $1.10', best: 'Default consigliato · alias auto-aggiornato', recommended: true }, { id: 'deepseek-reasoner', name: 'DeepSeek R1 · Reasoner (alias latest)',tier: 'Flagship', ctx: '128K', out: '8K', cost: '$0.55 / $2.19', best: 'Ragionamento esteso (chain-of-thought visibile)' }, { id: 'deepseek-v3.2-exp', name: 'DeepSeek V3.2 Experimental', tier: 'Balanced', ctx: '128K', out: '8K', cost: '$0.27 / $1.10', best: 'Versione fissa V3.2 (no auto-update)' }, { id: 'deepseek-v3.1', name: 'DeepSeek V3.1', tier: 'Balanced', ctx: '128K', out: '8K', cost: '$0.27 / $1.10', best: 'Versione fissa V3.1 stabile' }, ], }; // Connettori disponibili — integrazioni enterprise (catalog). // Sessione 70 — rimosso stato fittizio 'connected' + lastSync hardcoded. // Tutti gli adattatori sono in stato 'available' finché non saranno cablati // con un'integrazione reale (FASE 21 connettori prod). Lo stato `connected` // va attivato dall'utente solo quando la chiave/credentials è configurata // (oggi è solo una flag locale; futura iterazione: stato persistito su DB). const CONNECTOR_CATALOG = [ { cat: 'ERP & Finance', items: [ { id: 'sap-s4', name: 'SAP S/4HANA', icon: 'factory', status: 'available', detail: 'OData v2/v4 · CPI gateway' }, { id: 'oracle-nc', name: 'Oracle NetSuite', icon: 'coins', status: 'available', detail: 'OAuth 2.0 · TBA' }, { id: 'sapb1', name: 'SAP Business One', icon: 'package', status: 'available', detail: 'Service Layer REST' }, { id: 'dynamics', name: 'MS Dynamics 365 F&O',icon: 'package', status: 'available', detail: 'OData · Entra ID' }, ]}, { cat: 'Project & PMO', items: [ { id: 'primavera', name: 'Primavera P6', icon: 'calendar', status: 'available', detail: 'REST API' }, { id: 'msproject', name: 'Microsoft Project', icon: 'calendar', status: 'available', detail: 'Project Online · Graph API' }, { id: 'jira', name: 'Atlassian Jira', icon: 'check', status: 'available', detail: 'OAuth 2.0 (3LO)' }, { id: 'asana', name: 'Asana', icon: 'check', status: 'available', detail: 'Personal Access Token' }, ]}, { cat: 'Storage & documentale', items: [ { id: 'sharepoint', name: 'SharePoint Online', icon: 'cloud', status: 'available', detail: 'Graph API · sites/drives' }, { id: 'gdrive', name: 'Google Drive', icon: 'cloud', status: 'available', detail: 'OAuth 2.0 · Drive API' }, { id: 'box', name: 'Box', icon: 'box', status: 'available', detail: 'JWT / OAuth' }, { id: 'dropbox', name: 'Dropbox Business', icon: 'box', status: 'available', detail: 'OAuth 2.0' }, { id: 's3', name: 'AWS S3', icon: 'cloud', status: 'available', detail: 'IAM · SSE-KMS' }, ]}, { cat: 'Comunicazione', items: [ { id: 'teams', name: 'Microsoft Teams', icon: 'chat', status: 'available', detail: 'Graph API · channel notifications' }, { id: 'slack', name: 'Slack', icon: 'chat', status: 'available', detail: 'Bot + slash commands' }, { id: 'outlook', name: 'Outlook / Exchange', icon: 'mail', status: 'available', detail: 'Graph API · mailbox' }, { id: 'gmail', name: 'Gmail Workspace', icon: 'mail', status: 'available', detail: 'Service account DWD' }, ]}, { cat: 'Firma & legale', items: [ { id: 'docusign', name: 'DocuSign', icon: 'signature',status: 'available', detail: 'CLM REST API' }, { id: 'adobesign', name: 'Adobe Acrobat Sign', icon: 'signature',status: 'available', detail: 'REST v6' }, { id: 'aruba', name: 'Aruba Firma', icon: 'signature',status: 'available', detail: 'CAdES · FEQ' }, ]}, { cat: 'Fiscale & payments', items: [ { id: 'sdi', name: 'SDI · FatturaPA', icon: 'receipt', status: 'available', detail: 'Passthrough SdI' }, { id: 'stripe', name: 'Stripe', icon: 'coins', status: 'available', detail: 'Pagamenti milestone' }, { id: 'cbi', name: 'CBI Globe', icon: 'coins', status: 'available', detail: 'PSD2 · bonifici SCT' }, ]}, { cat: 'Identità & Directory', items: [ { id: 'entra', name: 'Microsoft Entra ID', icon: 'shield', status: 'available', detail: 'SAML 2.0 · SCIM' }, { id: 'okta', name: 'Okta', icon: 'shield', status: 'available', detail: 'OIDC + SCIM' }, ]}, ]; function ConnectorCard({ c, onToggle }) { const isOn = c.status === 'connected'; return (
{c.name}
{isOn ? connesso : disponibile}
{c.detail}
{isOn ? <> onToggle(c)}>Disconnetti Sync : <> onToggle(c)}> Connetti Dettagli }
); } function ModelRow({ m, selected, onSelect }) { return (
onSelect(m.id)} style={{ display: 'grid', gridTemplateColumns: '16px 1fr auto', gap: 10, alignItems: 'center', padding: '8px 10px', border: '1px solid ' + (selected ? 'var(--accent)' : 'var(--line)'), borderRadius: 8, background: selected ? 'color-mix(in oklch, var(--accent) 8%, var(--bg-1))' : 'var(--bg-1)', }} >
{m.name}
{m.tier} {m.recommended && consigliato}
{m.best}
ctx {m.ctx} · out {m.out}
{m.cost} /Mtok
); } /** * AiUsageCard — sostituisce la mock "Budget & consumo" del template Claude Design. * Legge stat reali dall'audit_log via /api/ai/usage (fase 2c.3 sprint 2b). * * Dati visualizzati: chiamate del mese, success/error/fallback rate, latenza * media, breakdown per provider+modello con last-used. Spesa e token sono * marcati "—" finché FASE 11 non estenderà l'audit AI con i token usage reali. */ function AiUsageCard() { const [usage, setUsage] = React.useState(null); const [loading, setLoading] = React.useState(true); const [error, setError] = React.useState(null); const reload = React.useCallback(async () => { setLoading(true); setError(null); try { const res = await fetch('/api/ai/usage', { cache: 'no-store' }); if (!res.ok) throw new Error(`HTTP ${res.status}`); const json = await res.json(); setUsage(json?.data ?? null); } catch (e) { setError(String(e?.message || e)); } finally { setLoading(false); } }, []); React.useEffect(() => { reload(); }, [reload]); return (
Consumo AI · mese {usage?.month || '—'}
{loading ? 'Carico…' : 'Aggiorna'}
{error && (
⚠ {error}
)} {loading && !usage && (
Caricamento…
)} {usage && ( <>
0 ? `${usage.calls.total} req` : 'no traffic'} tone="flat" /> 0 ? 'auto-retry attivato' : 'mai usato'} tone={usage.calls.fallback > 0 ? 'down' : 'flat'} /> 0 ? `${Math.round((usage.calls.error / usage.calls.total) * 100)}% del totale` : '—'} tone={usage.calls.error > 0 ? 'down' : 'flat'} />
{usage.byProvider.length > 0 ? (
{usage.byProvider.map((row, i) => ( ))}
ProviderModelloChiamateOKErroriFallbackLatenza mediaUltimo uso
{row.provider} {row.model || '—'} {row.calls} {row.success} 0 ? 'var(--err)' : 'var(--text-3)' }}>{row.errors} 0 ? 'var(--warn)' : 'var(--text-3)' }}>{row.fallback} {row.latencyAvgMs > 0 ? `${row.latencyAvgMs}ms` : '—'} {row.lastUsedAt ? new Date(row.lastUsedAt).toLocaleString('it-IT') : '—'}
) : (
Nessuna chiamata AI registrata questo mese. Configura una API key in alto e fai un ping per popolare le statistiche.
)}
Sorgente: audit_log dove entityType IN ('ai.complete', 'ai.ping'). Token usage e spesa stimata arriveranno con FASE 11 (estensione audit AI con counter input/output tokens).
)}
); } function Settings() { const { theme, setTheme, aiSettings, setAiSettings, pushToast, user } = useStore(); const [tab, setTab] = React.useState('ai'); // Sessione 83 — Email Provider state const [emailServer, setEmailServer] = React.useState(null); const [emailPresets, setEmailPresets] = React.useState([]); const [emailLoading, setEmailLoading] = React.useState(true); const [emailForm, setEmailForm] = React.useState({ presetId: 'resend', // default Resend (consigliato su cloud: OVH/AWS/Azure bloccano SMTP outbound) providerKind: 'resend', // 'resend' | 'smtp' fromAddress: '', fromName: 'Veridanto', replyToAddress: '', smtpHost: 'smtp.gmail.com', smtpPort: 465, smtpSecure: true, smtpUser: '', smtpPassword: '', resendApiKey: '', }); const [emailSaving, setEmailSaving] = React.useState(false); const [emailShowPassword, setEmailShowPassword] = React.useState(false); const [emailTestOpen, setEmailTestOpen] = React.useState(false); const [emailTestTo, setEmailTestTo] = React.useState(''); const [emailTestSending, setEmailTestSending] = React.useState(false); const [emailTestResult, setEmailTestResult] = React.useState(null); React.useEffect(() => { let cancelled = false; (async () => { try { const r = await fetch('/api/settings/email', { headers: { 'X-Actor-Persona-Id': user?.id || '' } }); if (!r.ok) return; const j = await r.json(); if (cancelled) return; setEmailServer(j.data || null); setEmailPresets(j.presets || []); // Pre-populate form dai dati esistenti (esclusa password, mai esposta). // Permette update di singoli campi (es. solo password, solo from-address) // senza dover ricompilare tutto il form da zero. if (j.data) { const kind = j.data.provider === 'resend' ? 'resend' : 'smtp'; setEmailForm((prev) => ({ ...prev, presetId: kind === 'resend' ? 'resend' : (prev.presetId === 'resend' ? 'gmail' : prev.presetId), providerKind: kind, fromAddress: j.data.fromAddress || prev.fromAddress, fromName: j.data.fromName || prev.fromName, replyToAddress: j.data.replyToAddress || '', smtpHost: j.data.smtpHost || prev.smtpHost, smtpPort: j.data.smtpPort ?? prev.smtpPort, smtpSecure: j.data.smtpSecure ?? prev.smtpSecure, smtpUser: j.data.smtpUser || prev.smtpUser, // smtpPassword/resendApiKey restano vuoti: l'utente può lasciarli // così per mantenere il valore corrente, oppure compilare per cambiarli. })); } } catch {} finally { if (!cancelled) setEmailLoading(false); } })(); return () => { cancelled = true; }; }, [user?.id]); const applyEmailPreset = (presetId) => { const p = emailPresets.find(x => x.id === presetId); if (!p) return; if (presetId === 'resend') { setEmailForm({ ...emailForm, presetId, providerKind: 'resend' }); return; } setEmailForm({ ...emailForm, presetId, providerKind: 'smtp', smtpHost: p.host || emailForm.smtpHost, smtpPort: p.port, smtpSecure: p.secure, }); }; const saveEmailConfig = async () => { const isResend = emailForm.providerKind === 'resend'; // Validation diagnostica: elenca i campi mancanti per feedback specifico. // Secret (password / apiKey) obbligatorio solo se NON esiste già una config // attiva del provider scelto. In update può restare vuoto → backend riusa. const missing = []; if (!emailForm.fromAddress) missing.push('From address'); if (isResend) { if (!emailServer && !emailForm.resendApiKey) missing.push('Resend API key'); } else { if (!emailForm.smtpHost) missing.push('SMTP host'); if (!emailForm.smtpUser) missing.push('SMTP user'); if (!emailServer && !emailForm.smtpPassword) missing.push('SMTP password'); } if (missing.length > 0) { pushToast({ title: 'Configurazione incompleta', desc: 'Campi mancanti: ' + missing.join(', '), tone: 'err' }); return; } setEmailSaving(true); try { const body = isResend ? { provider: 'resend', fromAddress: emailForm.fromAddress, fromName: emailForm.fromName || null, replyToAddress: emailForm.replyToAddress || null, resend: { apiKey: emailForm.resendApiKey || '' }, } : { provider: 'smtp', fromAddress: emailForm.fromAddress, fromName: emailForm.fromName || null, replyToAddress: emailForm.replyToAddress || null, smtp: { host: emailForm.smtpHost, port: parseInt(emailForm.smtpPort, 10) || 587, secure: !!emailForm.smtpSecure, user: emailForm.smtpUser, password: emailForm.smtpPassword || '', }, }; const r = await fetch('/api/settings/email', { method: 'POST', headers: { 'Content-Type': 'application/json', 'X-Actor-Persona-Id': user?.id || '' }, body: JSON.stringify(body), }); const j = await r.json(); if (!r.ok) { const detail = j?.detail || j?.issues?.map(i => i.path?.join('.')).filter(Boolean).join(', ') || `HTTP ${r.status}`; pushToast({ title: 'Salvataggio email fallito', desc: detail, tone: 'err' }); return; } setEmailServer(j.data); // NON svuoto smtpPassword dopo save: l'utente vuole conferma visiva di // cosa ha effettivamente salvato. Il toggle eye resta nello stato che // l'utente ha scelto. La password sparisce solo al reload pagina (security). pushToast({ title: 'Provider email salvato ✓', desc: `Config attiva: ${j.data.smtpHint}`, tone: 'ok' }); } catch (err) { pushToast({ title: 'Errore di rete', desc: err?.message || 'POST fallito', tone: 'err' }); } finally { setEmailSaving(false); } }; // Sessione 83 — Onboarding wizard state const [tenantsList, setTenantsList] = React.useState([]); const [onbForm, setOnbForm] = React.useState({ tenantId: '', tenantName: '', tenantSlug: '', tenantDescription: '', adminName: '', adminEmail: '', adminPassword: '', seedCapex: true, seedDocTypes: true, seedCalendars: true, }); const [onbSaving, setOnbSaving] = React.useState(false); const [onbResult, setOnbResult] = React.useState(null); React.useEffect(() => { if (!isSuperadmin) return; let cancelled = false; (async () => { try { const r = await fetch('/api/admin/tenants', { headers: { 'X-Actor-Persona-Id': user?.id || '' } }); if (!r.ok) return; const j = await r.json(); if (!cancelled) setTenantsList(j.data || []); } catch {} })(); return () => { cancelled = true; }; }, [isSuperadmin, user?.id]); const createTenant = async () => { if (!onbForm.tenantId || !onbForm.tenantName || !onbForm.adminEmail || !onbForm.adminPassword) { pushToast({ title: 'Campi obbligatori', desc: 'Compila tenant id, name, admin email, password.', tone: 'err' }); return; } setOnbSaving(true); setOnbResult(null); try { const r = await fetch('/api/admin/tenants', { method: 'POST', headers: { 'Content-Type': 'application/json', 'X-Actor-Persona-Id': user?.id || '' }, body: JSON.stringify({ tenant: { id: onbForm.tenantId, name: onbForm.tenantName, slug: onbForm.tenantSlug || onbForm.tenantId, description: onbForm.tenantDescription || null, }, admin: { name: onbForm.adminName || onbForm.adminEmail.split('@')[0], email: onbForm.adminEmail, password: onbForm.adminPassword, roleIds: ['SUPERADMIN'], }, seedDefaults: { capexClasses: onbForm.seedCapex, docTypes: onbForm.seedDocTypes, calendars: onbForm.seedCalendars, }, }), }); const j = await r.json(); if (!r.ok) { setOnbResult({ ok: false, error: j.error, detail: j.detail }); pushToast({ title: `Onboarding fallito (${j.error})`, desc: j.detail?.slice(0, 120) || '', tone: 'err' }); return; } setOnbResult({ ok: true, ...j.data }); // Reset form setOnbForm({ ...onbForm, tenantId: '', tenantName: '', tenantSlug: '', tenantDescription: '', adminName: '', adminEmail: '', adminPassword: '' }); // Refresh list const list = await fetch('/api/admin/tenants', { headers: { 'X-Actor-Persona-Id': user?.id || '' } }); const listJ = await list.json(); setTenantsList(listJ.data || []); pushToast({ title: 'Tenant creato', desc: `${j.data.tenant.id} + admin ${j.data.admin.email}`, tone: 'ok' }); } catch (err) { pushToast({ title: 'Errore di rete', desc: err?.message || 'POST fallito', tone: 'err' }); } finally { setOnbSaving(false); } }; const sendTestEmail = async () => { if (!emailTestTo) return; setEmailTestSending(true); setEmailTestResult(null); try { const r = await fetch('/api/settings/email/test-send', { method: 'POST', headers: { 'Content-Type': 'application/json', 'X-Actor-Persona-Id': user?.id || '' }, body: JSON.stringify({ to: emailTestTo, subject: 'Veridanto · Test email' }), }); const j = await r.json(); if (!r.ok) { setEmailTestResult({ ok: false, error: j?.error, detail: j?.detail }); pushToast({ title: `Test email fallito (${j?.error})`, desc: j?.detail?.slice(0, 120) || '', tone: 'err' }); return; } setEmailTestResult({ ok: true, ...j.data }); pushToast({ title: 'Email di test inviata', desc: `${j.data.accepted.length} accepted · ${j.data.latencyMs}ms`, tone: 'ok' }); } catch (err) { setEmailTestResult({ ok: false, error: 'network', detail: err?.message }); pushToast({ title: 'Errore di rete', desc: err?.message || 'fetch fallito', tone: 'err' }); } finally { setEmailTestSending(false); } }; // FASE 2b.AI — fonte di verità su provider/mode/model/temperature/key è il DB. // `aiServer` è l'ultimo DTO ricevuto dal server; `setAi` invia PATCH e ricarica. const [aiServer, setAiServer] = React.useState(null); const [aiServerLoading, setAiServerLoading] = React.useState(true); const [aiServerError, setAiServerError] = React.useState(null); const [claudeKeyDraft, setClaudeKeyDraft] = React.useState(''); const [geminiKeyDraft, setGeminiKeyDraft] = React.useState(''); const [deepseekKeyDraft, setDeepseekKeyDraft] = React.useState(''); const [savingKey, setSavingKey] = React.useState(null); // 'claude' | 'gemini' | 'deepseek' | null const [pingState, setPingState] = React.useState({ provider: null, status: 'idle', text: '', latencyMs: 0, error: null }); React.useEffect(() => { let cancelled = false; (async () => { try { const dto = await window.fetchAiSettings(); if (cancelled) return; setAiServer(dto); setAiServerError(null); // sync dello shadow localStorage (no chiavi) setAiSettings({ provider: dto.primaryProvider, mode: dto.mode, claudeModel: dto.claudeModel, geminiModel: dto.geminiModel, deepseekModel: dto.deepseekModel, temperature: dto.temperature, }); } catch (err) { if (!cancelled) setAiServerError(err?.message || 'Errore caricamento'); } finally { if (!cancelled) setAiServerLoading(false); } })(); return () => { cancelled = true; }; }, []); /** * Patch parziale verso /api/settings/ai. Aggiorna sia lo stato server che * lo shadow `aiSettings` localStorage. In caso di errore mostra un toast. */ const setAi = async (patch) => { try { const dto = await window.patchAiSettings(patch, user?.id); setAiServer(dto); setAiSettings({ provider: dto.primaryProvider, mode: dto.mode, claudeModel: dto.claudeModel, geminiModel: dto.geminiModel, deepseekModel: dto.deepseekModel, temperature: dto.temperature, }); } catch (err) { pushToast({ title: 'Errore salvataggio AI', desc: err?.message || 'PATCH fallita', tone: 'err' }); } }; const KEY_FIELD = { claude: 'claudeKey', gemini: 'geminiKey', deepseek: 'deepseekKey' }; const saveKey = async (provider) => { const draft = provider === 'claude' ? claudeKeyDraft : provider === 'gemini' ? geminiKeyDraft : deepseekKeyDraft; if (!draft.trim()) return; setSavingKey(provider); try { const dto = await window.patchAiSettings( { [KEY_FIELD[provider]]: draft.trim() }, user?.id, ); setAiServer(dto); if (provider === 'claude') setClaudeKeyDraft(''); else if (provider === 'gemini') setGeminiKeyDraft(''); else setDeepseekKeyDraft(''); pushToast({ title: `Chiave ${provider} salvata`, desc: 'Cifrata e archiviata in DB.', tone: 'ok' }); } catch (err) { pushToast({ title: 'Errore salvataggio chiave', desc: err?.message || 'PATCH fallita', tone: 'err' }); } finally { setSavingKey(null); } }; const removeKey = async (provider) => { if (!window.confirm(`Rimuovere la chiave ${provider} dal database?`)) return; setSavingKey(provider); try { const dto = await window.patchAiSettings( { [KEY_FIELD[provider]]: null }, user?.id, ); setAiServer(dto); pushToast({ title: `Chiave ${provider} rimossa`, tone: 'warn' }); } catch (err) { pushToast({ title: 'Errore rimozione', desc: err?.message || 'PATCH fallita', tone: 'err' }); } finally { setSavingKey(null); } }; const runPing = async (provider) => { setPingState({ provider, status: 'pending', text: '', latencyMs: 0, error: null }); try { const data = await window.pingAi(provider, undefined, user?.id); setPingState({ provider, status: 'ok', text: data.text, latencyMs: data.latencyMs, error: null }); pushToast({ title: `${provider} OK`, desc: `${data.model} · ${data.latencyMs}ms`, tone: 'ok' }); } catch (err) { setPingState({ provider, status: 'err', text: '', latencyMs: 0, error: err?.message || 'Errore' }); pushToast({ title: `${provider} fallito`, desc: err?.message?.slice(0, 200) || 'Errore', tone: 'err' }); } }; // stato locale connectors (override del catalogo) const [connectors, setConnectors] = React.useState(() => { const out = {}; CONNECTOR_CATALOG.forEach(g => g.items.forEach(c => { out[c.id] = c.status; })); return out; }); const toggleConnector = (c) => { const next = connectors[c.id] === 'connected' ? 'available' : 'connected'; setConnectors({ ...connectors, [c.id]: next }); pushToast({ title: next === 'connected' ? `${c.name} connesso` : `${c.name} disconnesso`, desc: next === 'connected' ? 'Integrazione attiva. Prima sync pianificata.' : 'Integrazione disattivata. Dati locali mantenuti.', tone: next === 'connected' ? 'ok' : 'warn', }); }; const connectedCount = Object.values(connectors).filter(s => s === 'connected').length; const totalCount = Object.keys(connectors).length; const currentClaude = aiServer?.claudeModel || aiSettings.claudeModel || 'claude-sonnet-4-5'; const currentGemini = aiServer?.geminiModel || aiSettings.geminiModel || 'gemini-2-5-pro'; const currentDeepseek = aiServer?.deepseekModel || aiSettings.deepseekModel || 'deepseek-chat'; const currentMode = aiServer?.mode || aiSettings.mode || 'hybrid'; const currentProvider = aiServer?.primaryProvider || aiSettings.provider || 'claude'; const currentTemp = aiServer?.temperature ?? aiSettings.temperature ?? 0.3; const hasClaudeKey = aiServer?.hasClaudeKey ?? false; const hasGeminiKey = aiServer?.hasGeminiKey ?? false; const hasDeepseekKey = aiServer?.hasDeepseekKey ?? false; const isSuperadmin = Array.isArray(user?.roleIds) && user.roleIds.includes('SUPERADMIN'); const tabs = [ { id: 'ai', label: 'Provider AI', icon: 'sparkle' }, { id: 'email', label: 'Provider Email', icon: 'mail' }, { id: 'gmail-inbound', label: 'Gmail inbound', icon: 'mail' }, ...(isSuperadmin ? [{ id: 'onboarding', label: 'Onboarding tenant', icon: 'plus' }] : []), { id: 'connect', label: 'Connettori', icon: 'link', badge: `${connectedCount}/${totalCount}` }, { id: 'ui', label: 'Interfaccia', icon: 'palette' }, { id: 'gov', label: 'Governance', icon: 'shield' }, { id: 'notif', label: 'Notifiche', icon: 'bell' }, { id: 'sessions', label: 'Sessioni attive', icon: 'shield' }, { id: 'delegations', label: 'Deleghe uscenti', icon: 'users' }, { id: 'org', label: 'Organizzazione', icon: 'users' }, ]; return (
Amministrazione

Impostazioni

Provider AI, integrazioni di sistema, sicurezza, notifiche e retention. Modalità live richiede una API key configurata; hybrid abilita auto-retry tra provider.
{currentMode==='live'?'AI · Solo primario':'AI · Auto-retry'} {aiServerError && BE non raggiungibile} 0 ? 'ok' : 'info'} dot>{connectedCount} connettori attivi
{/* Tab nav */}
{tabs.map(t => ( ))}
{/* ==================== TAB: AI ==================== */} {tab === 'ai' && (
{/* Claude */} saveKey('claude')} onRemove={() => removeKey('claude')} onPing={() => runPing('claude')} pingState={pingState.provider === 'claude' ? pingState : null} modelLabel="Modello di default · Claude" models={MODEL_CATALOG.claude} currentModel={currentClaude} onSelectModel={(id) => setAi({ claudeModel: id })} disabled={aiServerLoading} /> {/* Gemini */} saveKey('gemini')} onRemove={() => removeKey('gemini')} onPing={() => runPing('gemini')} pingState={pingState.provider === 'gemini' ? pingState : null} modelLabel="Modello di default · Gemini" models={MODEL_CATALOG.gemini} currentModel={currentGemini} onSelectModel={(id) => setAi({ geminiModel: id })} disabled={aiServerLoading} /> {/* DeepSeek */} saveKey('deepseek')} onRemove={() => removeKey('deepseek')} onPing={() => runPing('deepseek')} pingState={pingState.provider === 'deepseek' ? pingState : null} modelLabel="Modello di default · DeepSeek" models={MODEL_CATALOG.deepseek} currentModel={currentDeepseek} onSelectModel={(id) => setAi({ deepseekModel: id })} disabled={aiServerLoading} /> {/* Runtime & routing */}
Runtime & routing
Come l'orchestratore sceglie il provider ad ogni chiamata
Auto-retry: se il provider primario fallisce, prova gli altri configurati. Solo primario: errore esplicito se il primario fallisce.
Auto: il router sceglie in base a costo/latenza/tipo di task.
setAi({ temperature: Number(e.target.value) })} style={{ width: '100%' }}/>
0 · deterministico{currentTemp.toFixed(1)}1 · creativo
Routing per tipo di task
{[ { t: 'Estrazione campi da PDF', m: 'Claude Haiku 4.5', f: 'Gemini 2.5 Flash-Lite', c: '€0.002', l: '~800ms' }, { t: 'Redazione capitolati/RdA', m: 'Claude Sonnet 4.5', f: 'Gemini 2.5 Pro', c: '€0.08', l: '~6s' }, { t: 'Analisi rischi e anomalie', m: 'Claude Opus 4.1', f: 'Gemini 2.5 Pro', c: '€0.25', l: '~12s' }, { t: 'Ricerca semantica docs', m: 'Gemini 2.5 Flash', f: 'Claude Haiku 4.5', c: '€0.003', l: '~400ms' }, { t: 'Riassunto verbali riunione', m: 'Claude Sonnet 4.5', f: 'Gemini 2.5 Flash', c: '€0.04', l: '~3s' }, { t: 'Classificazione documenti', m: 'Claude Haiku 3.5', f: 'Gemini 2.0 Flash-Lite', c: '€0.001', l: '~300ms' }, ].map((r, i) => ( ))}
TaskModelloFallbackCosto/msgLatenza
{r.t} {r.m} {r.f} {r.c} {r.l}
{/* Budget & usage — dati reali da audit_log /api/ai/usage */} {/* Sessione 65 — AI override personale (per persona, in localStorage) */}
)} {/* ==================== TAB: Email Provider (Sessione 83) ==================== */} {tab === 'email' && (
Provider Email Transactional
{emailServer && Attivo · {emailServer.provider}} {!emailServer && !emailLoading && Non configurato} setEmailTestOpen(true)} disabled={!emailServer || emailLoading} data-testid="email-test-btn"> Invia test
Configura un provider SMTP per invio email transazionali (notifiche, reset password, dispatch SLA). Per Gmail/Google Workspace serve una App Password (richiede 2FA attivo). Per Microsoft 365 SMTP AUTH va abilitato sul mailbox.
{emailServer && (
From: {emailServer.fromName ? `"${emailServer.fromName}" <${emailServer.fromAddress}>` : emailServer.fromAddress} {emailServer.smtpHint}
{emailServer.replyToAddress &&
Reply-to: {emailServer.replyToAddress}
}
)}
{emailForm.presetId && emailPresets.find(p => p.id === emailForm.presetId)?.hint && (
💡 {emailPresets.find(p => p.id === emailForm.presetId)?.hint}
)}
setEmailForm({...emailForm, fromAddress: e.target.value})} placeholder={emailForm.providerKind === 'resend' ? 'onboarding@resend.dev' : 'no-reply@veridanto.com'} data-testid="email-from-input"/>
setEmailForm({...emailForm, fromName: e.target.value})} placeholder="Veridanto Notifiche"/>
setEmailForm({...emailForm, replyToAddress: e.target.value})} placeholder="support@veridanto.com"/>
{emailForm.providerKind === 'resend' && (
setEmailForm({...emailForm, resendApiKey: e.target.value})} placeholder={emailServer && emailServer.provider === 'resend' ? 'Lascia vuoto per mantenere quella attuale' : 're_xxxxxxxxxxxxxxxxxxxxxxxx'} data-testid="email-resend-apikey-input" style={{ paddingRight: 36, width: '100%' }} />
)} {emailForm.providerKind === 'smtp' && ( <>
setEmailForm({...emailForm, smtpHost: e.target.value})} placeholder="smtp.gmail.com"/>
setEmailForm({...emailForm, smtpPort: e.target.value})} placeholder="465"/>
setEmailForm({...emailForm, smtpUser: e.target.value})} placeholder="user@gmail.com" data-testid="email-user-input"/>
setEmailForm({...emailForm, smtpPassword: e.target.value})} placeholder={emailServer ? 'Lascia vuoto per mantenere quella attuale' : 'xxxx xxxx xxxx xxxx'} data-testid="email-password-input" style={{ paddingRight: 36, width: '100%' }} />
)}
{emailSaving ? 'Salvataggio…' : (emailServer ? 'Aggiorna provider' : 'Salva configurazione')}
)} {/* Email test send modal */} {emailTestOpen && ( { setEmailTestOpen(false); setEmailTestResult(null); }} title="Invia email di test" size="sm" footer={ <> { setEmailTestOpen(false); setEmailTestResult(null); }}>Chiudi {emailTestSending ? 'Invio…' : 'Invia'} }>
setEmailTestTo(e.target.value)} placeholder="recipient@example.com" data-testid="email-test-to-input"/>
Verrà inviata una mail di test usando la config SMTP attiva del tenant. Audit metadata-only registrato.
{emailTestResult && (
{emailTestResult.ok ? ( <>
✓ Inviata
{emailTestResult.messageId}
Accepted: {emailTestResult.accepted?.length || 0} · Rejected: {emailTestResult.rejected?.length || 0} · Latency: {emailTestResult.latencyMs}ms
) : ( <>
✗ {emailTestResult.error}
{emailTestResult.detail}
)}
)}
)} {/* ==================== TAB: Gmail Inbound OAuth (Sessione 88 / FASE 15.B) ==================== */} {tab === 'gmail-inbound' && ( )} {/* ==================== TAB: Onboarding Tenant (SUPERADMIN, Sessione 83) ==================== */} {tab === 'onboarding' && isSuperadmin && (
Onboarding nuovo tenant
SUPERADMIN only
Crea un nuovo tenant (cliente isolato) con admin persona dedicata e seed default opzionali. Operazione atomica in transaction: in caso di errore tutto rollback.
Tenant
setOnbForm({...onbForm, tenantId: e.target.value.toLowerCase().replace(/[^a-z0-9-]/g, '-')})} placeholder="acme-mfg" data-testid="onb-tenant-id"/>
setOnbForm({...onbForm, tenantName: e.target.value})} placeholder="ACME Manufacturing SpA" data-testid="onb-tenant-name"/>
setOnbForm({...onbForm, tenantSlug: e.target.value.toLowerCase().replace(/[^a-z0-9-]/g, '-')})} placeholder={onbForm.tenantId || 'acme-mfg'}/>
setOnbForm({...onbForm, tenantDescription: e.target.value})} placeholder="Cliente CAPEX 2026"/>
Admin persona iniziale
setOnbForm({...onbForm, adminName: e.target.value})} placeholder="Mario Rossi" data-testid="onb-admin-name"/>
setOnbForm({...onbForm, adminEmail: e.target.value})} placeholder="admin@acme-mfg.com" data-testid="onb-admin-email"/>
setOnbForm({...onbForm, adminPassword: e.target.value})} placeholder="••••••••" data-testid="onb-admin-password"/>
Seed default opzionali
{onbSaving ? 'Onboarding…' : 'Crea tenant + admin'}
{onbResult && (
{onbResult.ok ? ( <>
✓ Tenant creato
Tenant: {onbResult.tenant.id} ({onbResult.tenant.name})
Admin: {onbResult.admin.email} (persona id: {onbResult.admin.id})
Seed: {onbResult.seedStats.capexClassesCreated} capex · {onbResult.seedStats.docTypesCreated} doc_types · {onbResult.seedStats.calendarsCreated} calendar
) : ( <>
✗ {onbResult.error}
{onbResult.detail}
)}
)}
{/* Tenant list */}
Tenant attivi ({tenantsList.length})
{tenantsList.length === 0 ? ( ) : tenantsList.map(t => ( ))}
Tenant IDNomeSlugCreatedStato
Nessun tenant. Crea il primo con il form sopra.
{t.id} {t.name} {t.slug} {t.createdAt?.slice(0,10)} {t.active ? 'attivo' : 'off'}
)} {/* ==================== TAB: Connettori ==================== */} {tab === 'connect' && (
Integrazioni enterprise
Cerca Sync tutti Nuovo connettore custom
{connectedCount} su {totalCount} connettori attivi. L'AI può leggere e scrivere sui sistemi abilitati; ogni azione richiede approvazione umana (human-in-the-loop).
{CONNECTOR_CATALOG.map(group => (
{group.cat}
{group.items.map(c => ( ))}
))}
Webhook in uscita
Nessun webhook configurato.
Gestione completa in arrivo con FASE 21 (integrazioni esterne).
Aggiungi webhook
API Tokens
Nessun token API generato.
Gestione completa in arrivo con FASE 22 (hardening + multi-tenancy).
Genera token
)} {/* ==================== TAB: UI ==================== */} {tab === 'ui' && (
Preferenze interfaccia
Scorciatoie da tastiera
{[ ['⌘ K', 'Command palette globale'], ['⌘ /', 'Apri/chiudi Copilot'], ['⌘ B', 'Toggle sidebar'], ['G + D', 'Vai a Dashboard'], ['G + P', 'Vai a Progetti'], ['G + R', 'Vai a RdA'], ['N', 'Nuova entità (contestuale)'], ['?', 'Mostra questa lista'], ].map(([k, d]) => (
{d} {k}
))}
)} {/* ==================== TAB: Governance ==================== */} {tab === 'gov' && (
Sicurezza & compliance
Data residencyEU · Frankfurt (eu-central-1)
Backup giornalieroattivo · 35gg
Encryption at restAES-256 · KMS
Encryption in transitTLS 1.3
SSO SAML · Entra IDopzionale (no enforcement MVP)
ISO 27001 / SOC 2certificato
GDPR DPAfirmato · 2025-11
Governance AI
Human-in-the-loopobbligatorio scritture
PII masking pre-promptattivo
Training opt-outno-train clause
Retention prompt/risposte24 mesi
Audit log AIimmutabile
Red-team reviewstrimestrali
EU AI Act · categorialimited risk
Audit log · ultime 24h
Export CSV
TimestampUtenteAzioneRisorsaIPEsito
09:42:11m.rossirda.approveRDA-0041810.12.4.81ok
09:31:02ai-agentdoc.draftDOC-8812internalok
09:18:55g.bianchisettings.updateai.model=sonnet-4.510.12.4.102ok
08:56:40l.verdisal.rejectSAL-207-0487.14.22.9override
08:12:09systemconnector.syncsap-s4internalok
)} {/* ==================== TAB: Notifiche (FASE 73 — live persistite per persona) ==================== */} {tab === 'notif' && } {/* ==================== TAB: Sessioni attive (FASE 53.3 sessione 58) ==================== */} {tab === 'sessions' && } {tab === 'delegations' && } {/* ==================== TAB: Organizzazione ==================== */} {tab === 'org' && (
Tenant Industrial Demo SpA
Multi-plant · 4 siti produttivi · 120 utenti attivi
Ruoli & permessi
Nuovo ruolo
RuoloUtentiScope
CFO / Direzione3tutto · read
Project Manager CAPEX12progetti assegnati
Procurement / Buyer8RdA, vendor
Controller5budget, SAL
Engineering lead9specs, capitolati
Plant manager4sito assegnato
Vendor esterno76proprio perimetro
Admin3full
Plant / Siti produttivi
PlantResponsabileProgetti attivi
Torino · sedeG. Bianchi7
Modena · stabilimentoA. Russo6
Bari · nuovo sitoM. Ferrari4
Poznań · PLK. Nowak3
Fatturazione & piano
)}
); } /** * Card per provider AI: gestisce input chiave (con hint quando già salvata), * salva/rimuovi via PATCH, esegue ping reale al provider, mostra esito test. * * Lo stato `pingState` è esterno e condiviso tra le card (un solo ping alla volta). */ function ProviderKeyCard({ color, name, placeholder, endpoint, hasKey, keyHint, draft, setDraft, saving, onSave, onRemove, onPing, pingState, modelLabel, models, currentModel, onSelectModel, disabled, }) { return (
{name}
{hasKey ? 'API configurata' : 'non configurato'}
setDraft(e.target.value)} disabled={disabled || saving} />
{saving ? 'Salvataggio…' : (hasKey ? 'Aggiorna chiave' : 'Salva chiave')} {hasKey && ( Rimuovi )} {pingState?.status === 'pending' ? 'Test in corso…' : 'Test connessione'}
Endpoint: {endpoint}
{pingState?.status === 'ok' && (
OK · {pingState.latencyMs}ms · {pingState.text.slice(0, 200)}
)} {pingState?.status === 'err' && (
Errore: {String(pingState.error).slice(0, 300)}
)}
{modelLabel}
{models.map(m => ( ))}
); } /** * Custom model input — permette di digitare un model id non presente nel * catalogo (es. modelli appena rilasciati, varianti experimental, alias di * provider). Visibile come dettaglio espandibile sotto la lista. Quando il * `currentModel` scelto NON è nel catalogo, l'input è visibile in default * (mostra il valore custom attivo). Altrimenti collapsed. */ function CustomModelInput({ currentModel, models, onSelect, disabled }) { const inCatalog = React.useMemo(() => models.some(m => m.id === currentModel), [models, currentModel]); const [expanded, setExpanded] = React.useState(!inCatalog); const [draft, setDraft] = React.useState(inCatalog ? '' : currentModel); React.useEffect(() => { if (!inCatalog) { setExpanded(true); setDraft(currentModel); } }, [currentModel, inCatalog]); function apply() { const v = (draft || '').trim(); if (!v) return; onSelect(v); } return (
{expanded && (
setDraft(e.target.value)} disabled={disabled} style={{ width: '100%', padding: '6px 8px', fontSize: 11.5, fontFamily: 'monospace' }} />
Usa modello custom Il provider valida l'id. Errori 404/invalid_model arriveranno da BE.
)}
); } // ============================================================ // SessionsTab — FASE 53.3 (sessione 58): info sessione corrente + revoca tutte // le altre. BE già esistente (sessione 38: jwt-blacklist + /api/auth/revoke). // ============================================================ function SessionsTab() { const { user, pushToast } = useStore(); const [info, setInfo] = React.useState(null); const [error, setError] = React.useState(null); const [busy, setBusy] = React.useState(false); const reload = React.useCallback(async () => { setError(null); try { const r = await fetch('/api/auth/sessions', { credentials: 'same-origin', cache: 'no-store', }); const j = await r.json().catch(() => ({})); if (!r.ok) { if (j.error === 'unauthenticated' || j.error === 'invalid_session' || j.error === 'session_revoked') { setError('Sessione non valida — esegui logout e ri-login.'); } else { setError(j.error || `HTTP ${r.status}`); } return; } setInfo(j); } catch (e) { setError(String(e?.message || e)); } }, []); React.useEffect(() => { reload(); }, [reload]); async function revokeAll() { if (!confirm('Revocare tutte le sessioni di questa persona (incluse le altre device)?\nDovrai effettuare nuovamente il login dopo questa azione.')) return; setBusy(true); try { const r = await fetch('/api/auth/revoke', { method: 'POST', headers: { 'Content-Type': 'application/json' }, credentials: 'same-origin', body: JSON.stringify({}), }); const j = await r.json().catch(() => ({})); if (!r.ok) { if (j.error === 'redis_unavailable') { pushToast({ title: 'Redis non disponibile', desc: 'Riprova più tardi.', tone: 'err' }); } else if (j.error === 'revocation_disabled') { pushToast({ title: 'Revoca disabilitata', desc: 'JWT_REVOCATION_ENABLED=false', tone: 'warn' }); } else { pushToast({ title: 'Errore revoca', desc: j.detail || j.error || `HTTP ${r.status}`, tone: 'err' }); } setBusy(false); return; } pushToast({ title: 'Sessioni revocate', desc: `Tutti i token di questa persona sono ora invalidi (TTL ${j.revoked?.ttlSec ?? '?'}s).`, tone: 'ok', }); // Lascio il caller logged-in finché il prossimo /me/auth check non fallisce setBusy(false); reload(); } catch (e) { pushToast({ title: 'Errore revoca', desc: String(e), tone: 'err' }); setBusy(false); } } return (
Sessione corrente
JWT cookie sid. La sessione è stateless: il sistema non traccia sessioni multiple in DB. La revoca invalida TUTTI i token di questa persona via Redis blacklist (FASE 22.E).
{error && (
⚠ {error}
)} {!info && !error && (
Caricamento…
)} {info && (
Persona {info.persona.name} · {info.persona.email}
Token id (jti) {info.session.jti}
Emesso a (iat) {new Date(info.session.iatIso).toLocaleString('it-IT')}
Scade a (exp) {new Date(info.session.expIso).toLocaleString('it-IT')}
Ultimo login {info.lastLoginAt ? new Date(info.lastLoginAt).toLocaleString('it-IT') : '—'}
IP corrente {info.currentRequest.ip || '—'}
User-Agent {info.currentRequest.userAgent || '—'}
)}
Revoca tutte le sessioni
Invalida tutti i token JWT della persona corrente (incluse le altre device). Necessario fare di nuovo login.
{busy ? 'Revocando…' : '🔒 Revoca tutte le sessioni'}
); } // ============================================================ // AiPersonalOverrideCard — Sessione 65 (chiusura FASE 20) // ============================================================ // Override personale di mode + primaryProvider per il current user. // Persistenza in localStorage `lgs.ai.user..preferences`. // Header proposti per future BE consumption: X-AI-Mode-Override, // X-AI-Provider-Override (oggi solo persistenza locale). // // Default = no override → fallback su config tenant (ai_credentials). // Sessione 69 — rimosso 'simulated' (cleanup pilot/simulated) const AI_OVERRIDE_MODES = ['default', 'live', 'hybrid']; const AI_OVERRIDE_PROVIDERS = ['default', 'auto', 'claude', 'gemini', 'deepseek']; const AI_OVERRIDE_LS_KEY = (personaId) => `lgs.ai.user.${personaId}.preferences`; function loadAiPersonalOverride(personaId) { if (!personaId) return { modeOverride: 'default', providerOverride: 'default' }; try { const raw = localStorage.getItem(AI_OVERRIDE_LS_KEY(personaId)); if (!raw) return { modeOverride: 'default', providerOverride: 'default' }; const j = JSON.parse(raw); return { modeOverride: AI_OVERRIDE_MODES.includes(j.modeOverride) ? j.modeOverride : 'default', providerOverride: AI_OVERRIDE_PROVIDERS.includes(j.providerOverride) ? j.providerOverride : 'default', }; } catch { return { modeOverride: 'default', providerOverride: 'default' }; } } function saveAiPersonalOverride(personaId, prefs) { if (!personaId) return; try { localStorage.setItem(AI_OVERRIDE_LS_KEY(personaId), JSON.stringify(prefs)); } catch { // localStorage may be unavailable (quota / SSR fallback) } } // Sessione 88 (FASE 15.B) — Gmail OAuth2 inbound credential card. // SUPERADMIN-only operativo (UI è readonly per altri ruoli). function GmailInboundCard() { const { user, pushToast } = useStore(); const [status, setStatus] = React.useState(null); // null=loading, {connected:false}, {connected:true, ...} const [busy, setBusy] = React.useState(false); const [pullBusy, setPullBusy] = React.useState(false); const [lastPullResult, setLastPullResult] = React.useState(null); async function loadStatus() { try { const r = await fetch('/api/settings/gmail-oauth/status', { credentials: 'same-origin', cache: 'no-store', headers: user?.id ? { 'X-Actor-Persona-Id': user.id } : {}, }); if (r.status === 403) { setStatus({ forbidden: true }); return; } if (!r.ok) { setStatus({ connected: false }); return; } const j = await r.json(); setStatus(j); } catch { setStatus({ connected: false, error: 'network' }); } } React.useEffect(() => { loadStatus(); // Check query string per OAuth callback feedback const params = new URLSearchParams(window.location.search); const oauthState = params.get('gmail-oauth'); if (oauthState === 'success') { const account = params.get('account'); pushToast({ title: 'Gmail connesso', desc: `Account ${account || 'autorizzato'} pronto per inbound.`, tone: 'ok' }); // Cleanup URL window.history.replaceState({}, '', window.location.pathname); } else if (oauthState === 'denied') { pushToast({ title: 'Consent OAuth negato', desc: 'L\'utente Google ha rifiutato l\'autorizzazione.', tone: 'warn' }); window.history.replaceState({}, '', window.location.pathname); } else if (oauthState === 'exchange_failed' || oauthState === 'persist_failed' || oauthState === 'invalid' || oauthState === 'invalid_state') { const detail = params.get('detail'); pushToast({ title: `OAuth ${oauthState}`, desc: detail || 'Errore durante il flow OAuth.', tone: 'err' }); window.history.replaceState({}, '', window.location.pathname); } // eslint-disable-next-line react-hooks/exhaustive-deps }, []); async function handleConnect() { if (busy) return; setBusy(true); try { const r = await fetch('/api/settings/gmail-oauth/init', { credentials: 'same-origin', headers: user?.id ? { 'X-Actor-Persona-Id': user.id } : {}, }); const j = await r.json(); if (!r.ok) { pushToast({ title: 'OAuth non configurato', desc: j?.detail || j?.error || 'Verifica env vars GMAIL_OAUTH_*', tone: 'err' }); return; } // Redirect a Google consent window.location.href = j.url; } catch (err) { pushToast({ title: 'Errore rete', desc: String(err?.message || err), tone: 'err' }); } finally { setBusy(false); } } async function handleDisconnect() { if (busy) return; if (!confirm('Disconnettere la credenziale Gmail? Lo storico mail già importate non viene toccato, ma le nuove mail non verranno più pullate.')) return; setBusy(true); try { const r = await fetch('/api/settings/gmail-oauth/status', { method: 'DELETE', credentials: 'same-origin', headers: user?.id ? { 'X-Actor-Persona-Id': user.id } : {}, }); const j = await r.json(); if (!r.ok) { pushToast({ title: 'Disconnessione fallita', desc: j?.error || `HTTP ${r.status}`, tone: 'err' }); return; } pushToast({ title: 'Gmail disconnesso', desc: `Account ${j.accountEmail} disconnesso.`, tone: 'ok' }); await loadStatus(); } catch (err) { pushToast({ title: 'Errore rete', desc: String(err?.message || err), tone: 'err' }); } finally { setBusy(false); } } async function handlePullNow() { if (pullBusy) return; setPullBusy(true); setLastPullResult(null); try { const r = await fetch('/api/admin/gmail-inbound/pull-now', { method: 'POST', credentials: 'same-origin', headers: user?.id ? { 'X-Actor-Persona-Id': user.id } : {}, }); const j = await r.json(); if (!r.ok) { pushToast({ title: 'Pull fallito', desc: j?.detail || j?.error || `HTTP ${r.status}`, tone: 'err' }); return; } setLastPullResult(j.results); const totalInserted = (j.results || []).reduce((a, r) => a + (r.inserted || 0), 0); const totalFailed = (j.results || []).reduce((a, r) => a + (r.failed || 0), 0); pushToast({ title: 'Pull completato', desc: `${totalInserted} nuove mail · ${totalFailed} errori. Hook auto-classify in esecuzione async.`, tone: totalFailed > 0 ? 'warn' : 'ok', }); await loadStatus(); } catch (err) { pushToast({ title: 'Errore rete', desc: String(err?.message || err), tone: 'err' }); } finally { setPullBusy(false); } } if (status === null) { return
Caricamento stato Gmail…
; } if (status.forbidden) { return (
Gmail inbound
SUPERADMIN only
La configurazione Gmail OAuth richiede ruolo SUPERADMIN. Chiedi a un amministratore di sistema.
); } return (
Gmail Inbound · OAuth2
Pull periodico (ogni 2 min) di mail da Gmail via Gmail API REST. Le mail vengono auto-link a project/RDA/vendor e classificate dall'AI per signal (delay/risk/action/...).
{status.connected ? ( Connesso ) : ( Non connesso )}
{!status.connected ? (
Connetti un account Gmail (es. inboundveridanto@gmail.com) per abilitare l'ingestion automatica. Il refresh token sarà cifrato AES-256-GCM at rest e mai esposto al FE.
Prerequisiti: env vars GMAIL_OAUTH_CLIENT_ID, GMAIL_OAUTH_CLIENT_SECRET, GMAIL_OAUTH_REDIRECT_URI impostate. Project Google Cloud con Gmail API abilitata + OAuth consent screen configurato.
{busy ? 'Inizializzazione…' : 'Connetti account Gmail'}
) : (
Account
{status.accountEmail}
Refresh token hint
{status.refreshTokenHint}
Mail importate
{status.totalMessagesImported}
Ultimo sync
{status.lastSyncAt || '—'}
History ID
{status.lastHistoryId || '—'}
Connesso il
{status.connectedAt ? new Date(status.connectedAt).toLocaleString('it-IT') : '—'}
{status.lastError && (
Ultimo errore: {status.lastError}
)}
{pullBusy ? 'Pull in corso…' : 'Pull adesso (manuale)'} Disconnetti
)}
{lastPullResult && lastPullResult.length > 0 && (
Risultato ultimo pull manuale
{lastPullResult.map((r, i) => ( ))}
AccountFetchedInsertedDuplicatesFailedMs
{r.accountEmail} {r.totalFetched} 0 ? 'ok' : 'info'}>{r.inserted} {r.duplicates} {r.failed > 0 ? {r.failed} : r.failed} {r.durationMs}
{lastPullResult[0]?.errors?.length > 0 && (
Errori (primi {lastPullResult[0].errors.length})
    {lastPullResult[0].errors.map((e, i) =>
  • {e}
    • )}
)}
)}
); } function AiPersonalOverrideCard({ userId, userName }) { const [prefs, setPrefs] = React.useState(() => loadAiPersonalOverride(userId)); React.useEffect(() => { setPrefs(loadAiPersonalOverride(userId)); }, [userId]); function update(field, value) { const next = { ...prefs, [field]: value }; setPrefs(next); saveAiPersonalOverride(userId, next); } function reset() { const next = { modeOverride: 'default', providerOverride: 'default' }; setPrefs(next); saveAiPersonalOverride(userId, next); } const isCustom = prefs.modeOverride !== 'default' || prefs.providerOverride !== 'default'; return (
Override personale · {userName || 'utente'}
Imposta una preferenza individuale di modalità/provider AI per le tue chiamate. Lascia su default per usare la configurazione del tenant. Salvataggio locale (no DB).
{isCustom && ( Reset a default )} {isCustom ? 'override attivo' : 'segue tenant'}
{AI_OVERRIDE_MODES.map((m) => ( ))}
Solo le chiamate AI lanciate da te useranno questa modalità. Worker/cron usano sempre il default tenant.
{AI_OVERRIDE_PROVIDERS.map((p) => ( ))}
Override applicato solo se la chiave del provider scelto è configurata sul tenant.
Storage: {AI_OVERRIDE_LS_KEY(userId || '')}
Header BE proposti (futuro): X-AI-Mode-Override,{' '} X-AI-Provider-Override
); } // ============================================================ // DelegationsTab — Sessione 65 — Deleghe uscenti del current user // ============================================================ // Mostra le delegations dove `fromPersonaId === user.id`. Read-only: // la creazione/modifica delle deleghe resta in Customizing (admin-only). // // Stato delega derivato: // - 'active' se now() in [fromDate, toDate] AND row.active=true // - 'scheduled' se now() < fromDate // - 'expired' se now() > toDate // - 'inactive' se row.active=false function DelegationsTab() { const { user, seed, pushToast } = useStore(); const [rows, setRows] = React.useState(null); const [error, setError] = React.useState(null); const [createOpen, setCreateOpen] = React.useState(false); const [reloadKey, setReloadKey] = React.useState(0); React.useEffect(() => { let cancelled = false; (async () => { try { const r = await fetch('/api/config/delegations', { credentials: 'same-origin', cache: 'no-store', headers: user?.id ? { 'X-Actor-Persona-Id': user.id } : {}, }); if (!r.ok) { if (!cancelled) setError(`HTTP ${r.status}`); return; } const j = await r.json(); if (!cancelled) setRows(Array.isArray(j.data) ? j.data : []); } catch (e) { if (!cancelled) setError(String(e?.message || e)); } })(); return () => { cancelled = true; }; }, [user?.id, reloadKey]); function deriveState(d) { if (!d.active) return { state: 'inactive', label: 'inattiva', tone: '' }; const now = Date.now(); const from = d.fromDate ? new Date(d.fromDate).getTime() : 0; const to = d.toDate ? new Date(d.toDate).getTime() : Number.POSITIVE_INFINITY; if (now < from) return { state: 'scheduled', label: 'pianificata', tone: 'info' }; if (now > to) return { state: 'expired', label: 'scaduta', tone: '' }; return { state: 'active', label: 'attiva', tone: 'ok' }; } // Filter solo le deleghe uscenti (fromPersonaId === user.id). const myOutgoing = rows ? rows.filter((d) => d.fromPersonaId === user?.id || d.fromPersona === user?.id) : null; return (
Deleghe uscenti · {user?.name}
Sostituzioni che hai impostato (es. ferie, malattia). FASE 19 — creazione self-service.
setCreateOpen(true)} data-action="create-delegation"> Crea delega
setCreateOpen(false)} onCreated={() => { setReloadKey((k) => k + 1); setCreateOpen(false); pushToast({ title: 'Delega creata', tone: 'ok' }); }} currentUser={user} personas={seed?.PERSONAS || []} />
{error &&
Errore: {error}
} {!error && myOutgoing === null && (
Caricamento deleghe…
)} {!error && myOutgoing !== null && myOutgoing.length === 0 && (
Nessuna delega uscente impostata.
)} {!error && myOutgoing && myOutgoing.length > 0 && ( {myOutgoing.map((d) => { const st = deriveState(d); return ( ); })}
Sostituto Periodo Motivazione Stato
{d.toUser || d.toPersonaId}
{d.toPersonaId !== d.toUser && (
{d.toPersonaId}
)} 		{d.fromDate ? new Date(d.fromDate).toLocaleDateString('it-IT') : '—'} {' → '} {d.toDate ? new Date(d.toDate).toLocaleDateString('it-IT') : '∞'} {d.reason || '—'} {st.label}
)}
); } // ============================================================ // FASE 19 — CreateDelegationModal: form self-service per delega temporanea // ============================================================ function CreateDelegationModal({ open, onClose, onCreated, currentUser, personas }) { const today = new Date().toISOString().slice(0, 10); const tomorrow = new Date(Date.now() + 86400 * 1000).toISOString().slice(0, 10); const oneWeek = new Date(Date.now() + 7 * 86400 * 1000).toISOString().slice(0, 10); const [toPersonaId, setToPersonaId] = React.useState(''); const [fromDate, setFromDate] = React.useState(tomorrow); const [toDate, setToDate] = React.useState(oneWeek); const [reason, setReason] = React.useState(''); const [submitting, setSubmitting] = React.useState(false); const [error, setError] = React.useState(null); React.useEffect(() => { if (open) { setToPersonaId(''); setFromDate(tomorrow); setToDate(oneWeek); setReason(''); setError(null); } // eslint-disable-next-line react-hooks/exhaustive-deps }, [open]); if (!open) return null; const eligible = (personas || []).filter((p) => p.id !== currentUser?.id && (p.active !== false)); const dateInvalid = fromDate >= toDate; const canSubmit = toPersonaId && fromDate && toDate && !dateInvalid && !submitting; const submit = async () => { if (!canSubmit || !currentUser?.id) return; setSubmitting(true); setError(null); try { const r = await fetch('/api/config/delegations', { method: 'POST', credentials: 'same-origin', headers: { 'Content-Type': 'application/json', 'X-Actor-Persona-Id': currentUser.id }, body: JSON.stringify({ fromPersonaId: currentUser.id, toPersonaId, fromDate, toDate, reason: reason.trim() || null, active: true, }), }); const j = await r.json().catch(() => ({})); if (!r.ok) { const issue = j.issues?.[0]?.message || j.error || 'HTTP ' + r.status; throw new Error(issue); } onCreated && onCreated(j.data); } catch (e) { setError(String(e?.message || e)); } finally { setSubmitting(false); } }; return (
e.target === e.currentTarget && onClose()} style={{ position: 'fixed', inset: 0, background: 'rgba(0,0,0,.4)', display: 'grid', placeItems: 'center', zIndex: 1000 }}>

Nuova delega uscente

setToPersonaId(id || '')} personasFallback={personas || []} excludeIds={currentUser?.id ? [currentUser.id] : []} placeholder="Cerca sostituto…" />
{eligible.length === 0 && (
Nessuna persona disponibile come sostituto.
)}
setFromDate(e.target.value)} style={{ width: '100%', fontSize: 12 }} data-field="fromDate"/>
setToDate(e.target.value)} style={{ width: '100%', fontSize: 12 }} data-field="toDate"/>
{dateInvalid && (
La data di fine deve essere dopo l'inizio.
)}