diff --git a/internal/loki/ui/index.html b/internal/loki/ui/index.html
index 204a216..e9a4aee 100644
--- a/internal/loki/ui/index.html
+++ b/internal/loki/ui/index.html
@@ -2052,6 +2052,44 @@ html[data-files="1"] #files-btn{color:var(--accent)}
#criteria-list li.crit-pending{color:var(--dim)}
.rolebadge{display:inline-block;margin-left:6px;padding:0 6px;border:1px solid var(--accent);border-radius:3px;color:var(--accent);font-size:9px;letter-spacing:.05em;text-transform:uppercase;vertical-align:middle}
+
+/* ── Réglages en modale ─────────────────────────────────────────────────────
+ Deux volets : nav des sections à gauche, LE panneau choisi à droite. Les
+ panneaux réutilisent tels quels les gabarits de la barre latérale (.slist,
+ .switchrow, .subhead…), seuls la coque et le routage sont neufs. */
+#side-settings-btn{display:flex;align-items:center;gap:8px;width:100%;margin:8px 0 0;padding:10px 12px;
+ background:none;border:0;border-top:1px solid var(--border);border-radius:0;box-shadow:none;
+ font-size:13px;color:var(--text);cursor:pointer;text-align:left}
+#side-settings-btn:hover{background:var(--bubble)}
+#side-settings-btn svg{flex:none;opacity:.7}
+.set-card{max-width:860px;height:min(660px,92vh)}
+.set-shell{display:flex;flex:1;min-height:0}
+.set-nav{flex:0 0 200px;border-right:1px solid var(--border);overflow-y:auto;
+ padding:10px 8px;display:flex;flex-direction:column;gap:2px}
+.set-nav-h{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--dim);margin:12px 8px 4px}
+.set-nav-h:first-child{margin-top:2px}
+.set-nav button{display:flex;align-items:center;gap:8px;width:100%;margin:0;padding:7px 10px;
+ background:none;border:0;border-radius:3px;box-shadow:none;
+ font-size:12.5px;color:var(--text);cursor:pointer;text-align:left}
+.set-nav button:hover{background:var(--bubble)}
+.set-nav button.active{background:var(--bubble);font-weight:600}
+.set-nav button .sbadge{margin-left:auto}
+.set-body{flex:1;min-width:0;overflow-y:auto;padding:16px}
+.set-pane{display:none}
+.set-pane.active{display:block}
+.set-pane-h{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;margin:0 0 12px}
+.set-pane-h>span:first-child{flex:1;min-width:0}
+/* Téléphone : la nav passe en rangée défilante au-dessus du panneau, et la
+ modale prend tout l'écran — un panneau de réglages ne se lit pas en timbre. */
+@media(max-width:720px){
+ .set-ov{padding:0}
+ .set-card{max-width:none;height:100vh;height:100dvh;max-height:none;border-radius:0;border:0}
+ .set-shell{flex-direction:column}
+ .set-nav{flex:none;flex-direction:row;align-items:center;overflow-x:auto;overflow-y:hidden;
+ border-right:0;border-bottom:1px solid var(--border);padding:8px;white-space:nowrap}
+ .set-nav-h{display:none}
+ .set-nav button{width:auto;flex:none}
+}
/* Nom du modèle qui a produit la réponse, à côté de « Loki ». Discret (gris,
pas de capitales forcées) et borné : un nom de .gguf peut être très long,
il s'ellipse au lieu de pousser l'étiquette hors de la bulle. */
@@ -2155,302 +2193,14 @@ html[data-files="1"] #files-btn{color:var(--accent)}
latérale par défaut, c'est les discussions et la machine. Les sections
ouvertes par programme (journal du moteur, installation llama.cpp)
passent par openDetails(), qui déplie aussi les parents. -->
- Réglages
-
- Journal du moteur
-
-
-
-
-
-
- Emplacements
-
-
-
- Config active
-
…
-
- Presets
-
-
- Mode agent
-
-
-
-
Mémoire?
-
-
-
- Voir la mémoire
-
-
-
-
-
-
-
-
-
-
-
-
-
Accès internet?Ajoute les outils web_search / web_open / web_read / web_grep. Le moteur intégré ne demande aucune installation. Le moteur Crawl4AI exige un serveur que tu héberges toi-même (ex. docker run -d -p 11235:11235 --shm-size=1g unclecode/crawl4ai:latest) mais exécute le JavaScript des pages. Actifs seulement si le mode agent est actif.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
enregistré automatiquement en quittant le champ
-
-
-
-
-
-
-
-
Serveurs MCP?Connecte des serveurs MCP (Model Context Protocol) pour donner de nouveaux outils à l'IA : accès fichiers, bases de données, APIs métier… stdio = programme lancé localement (npx/uvx/binaire) · http = serveur distant. ⚠ un serveur stdio exécute du code sur cette machine, au même titre que le shell.
-
-
-
-
(aucun serveur — ajoute un serveur fichiers, une base de données, une API…)
-
-
-
-
-
-
-
-
-
Paramètres
-
-
-
-
-
- Tâches planifiées
-
-
-
-
-
Le mode agent est désactivé : les tâches s'exécuteront mais l'IA n'aura aucun outil pour agir (envoyer un mail, lire des fichiers…). Active le mode agent ci-dessus.
-
-
-
(aucune tâche — ex. « toutes les 2 h, relève mes mails et prépare des brouillons de réponse »)
-
-
-
-
- System prompt
-
-
-
-
- Moteur
-
-
-
-
-
-
Moteur llama.cpp
-
-
-
-
-
-
-
-
Télécharge llama-server et ses bibliothèques depuis l'image officielle
- (~170 Mo), sans reconstruire l'image de Loki. Le nouveau moteur est essayé
- avant d'être adopté ; celui de l'image reste intact et récupérable en un clic.
-
-
-
-
-
-
llama.cpp précompilé conseillé
-
binaire officiel téléchargé tel quel, prêt en ~2 min
-
-
-
-
llama.cpp compilé conseillé
-
compilé ici pour votre machine — plus rapide, plus long à installer
-
-
-
-
llama.cpp personnalisé
-
un fork de llama.cpp pour modèles spéciaux (quant ternaire…)
-
-
-
-
-
-
▸ détails
-
-
-
-
-
Service du moteur?Démarre, redémarre ou arrête llama-server — le processus qui charge le modèle et répond. Un redémarrage recharge le modèle du preset actif (quelques secondes à quelques minutes selon sa taille).
-
-
-
-
-
-
-
-
-
-
-
Paramètres
-
-
- Identité
-
-
- Ton prénomaffiché sur tes messages
-
-
-
-
- Ton avatar
-
-
-
- Avatar de Loki
-
-
-
-
- Apparence
-
-
-
-
Affichage
-
-
-
-
-
-
-
- Accès OpenAI
-
Endpoint compatible OpenAI?Branchez n'importe quel client compatible OpenAI (OpenCode, Continue, Cursor, Open WebUI…) sur cette adresse — le modèle s'y appelle loki. L'endpoint est servi par Loki sur le port de cette interface : aucun autre port à ouvrir. Si une clé est définie, le client doit envoyer Authorization: Bearer <clé>.
-
-
-
Adresse de l'endpoint — modèle loki
-
-
-
-
-
-
-
-
Adresse publique — facultative?Le nom de domaine ou l'IP par lesquels on atteint cette interface, par exemple ia.exemple.fr ou 192.168.1.20:8090. Laissez vide et l'adresse affichée suit celle de votre navigateur. Renseignez-la si vous passez par un reverse proxy ou un nom de domaine : Loki ne voit alors qu'un appel interne et ne peut pas la deviner. Sans https://, il est ajouté.
-
-
-
-
-
-
-
Clé API?Protège l'endpoint des complétions — vérifiée par Loki et par le moteur. Indispensable dès que l'adresse ci-dessus est joignable par d'autres. Modifier la clé redémarre le moteur.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Actions
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+ Réglages
+
+
+
+
+
+
+
Journal du moteur
+
+
+
+
+
+
+ Emplacements
+
+
+
+
+
Config active
+
…
+
+
+
Presets
+
+
+
+
Mode agent
+
+
+
+
Mémoire?
+
+
+
+ Voir la mémoire
+
+
+
+
+
+
+
+
+
+
+
+
+
Accès internet?Ajoute les outils web_search / web_open / web_read / web_grep. Le moteur intégré ne demande aucune installation. Le moteur Crawl4AI exige un serveur que tu héberges toi-même (ex. docker run -d -p 11235:11235 --shm-size=1g unclecode/crawl4ai:latest) mais exécute le JavaScript des pages. Actifs seulement si le mode agent est actif.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
enregistré automatiquement en quittant le champ
+
+
+
+
+
+
+
+
Serveurs MCP?Connecte des serveurs MCP (Model Context Protocol) pour donner de nouveaux outils à l'IA : accès fichiers, bases de données, APIs métier… stdio = programme lancé localement (npx/uvx/binaire) · http = serveur distant. ⚠ un serveur stdio exécute du code sur cette machine, au même titre que le shell.
+
+
+
+
(aucun serveur — ajoute un serveur fichiers, une base de données, une API…)
+
+
+
+
+
+
+
+
+
Paramètres
+
+
+
+
+
+
+
Tâches planifiées
+
+
+
+
+
Le mode agent est désactivé : les tâches s'exécuteront mais l'IA n'aura aucun outil pour agir (envoyer un mail, lire des fichiers…). Active le mode agent ci-dessus.
+
+
+
(aucune tâche — ex. « toutes les 2 h, relève mes mails et prépare des brouillons de réponse »)
+
+
+
+
+
+
System prompt
+
+
+
+
+
+
Moteur
+
+
+
+
+
+
Moteur llama.cpp
+
+
+
+
+
+
+
+
Télécharge llama-server et ses bibliothèques depuis l'image officielle
+ (~170 Mo), sans reconstruire l'image de Loki. Le nouveau moteur est essayé
+ avant d'être adopté ; celui de l'image reste intact et récupérable en un clic.
+
+
+
+
+
+
llama.cpp précompilé conseillé
+
binaire officiel téléchargé tel quel, prêt en ~2 min
+
+
+
+
llama.cpp compilé conseillé
+
compilé ici pour votre machine — plus rapide, plus long à installer
+
+
+
+
llama.cpp personnalisé
+
un fork de llama.cpp pour modèles spéciaux (quant ternaire…)
+
+
+
+
+
+
▸ détails
+
+
+
+
+
Service du moteur?Démarre, redémarre ou arrête llama-server — le processus qui charge le modèle et répond. Un redémarrage recharge le modèle du preset actif (quelques secondes à quelques minutes selon sa taille).
+
+
+
+
+
+
+
+
+
+
+
+
Identité
+
+
+ Ton prénomaffiché sur tes messages
+
+
+
+
+ Ton avatar
+
+
+
+ Avatar de Loki
+
+
+
+
+
+
Apparence
+
+
+
+
Affichage
+
+
+
+
+
+
+
+
+
Accès OpenAI
+
Endpoint compatible OpenAI?Branchez n'importe quel client compatible OpenAI (OpenCode, Continue, Cursor, Open WebUI…) sur cette adresse — le modèle s'y appelle loki. L'endpoint est servi par Loki sur le port de cette interface : aucun autre port à ouvrir. Si une clé est définie, le client doit envoyer Authorization: Bearer <clé>.
+
+
+
Adresse de l'endpoint — modèle loki
+
+
+
+
+
+
+
+
Adresse publique — facultative?Le nom de domaine ou l'IP par lesquels on atteint cette interface, par exemple ia.exemple.fr ou 192.168.1.20:8090. Laissez vide et l'adresse affichée suit celle de votre navigateur. Renseignez-la si vous passez par un reverse proxy ou un nom de domaine : Loki ne voit alors qu'un appel interne et ne peut pas la deviner. Sans https://, il est ajouté.
+
+
+
+
+
+
+
Clé API?Protège l'endpoint des complétions — vérifiée par Loki et par le moteur. Indispensable dès que l'adresse ci-dessus est joignable par d'autres. Modifier la clé redémarre le moteur.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Actions
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -7978,6 +8062,14 @@ async function loadConversations(){
let r;
try{ r = await jget('/api/conversations'); }catch(_){ return; }
CONVS = r.conversations || [];
+ // La plus récente EN TÊTE. Le serveur trie déjà par date d'activité, mais son
+ // tri STABLE laissait une discussion toute neuve SOUS celle qu'on vient de
+ // quitter (les deux sont touchées dans la même seconde) : on départage par la
+ // date de création, puis par l'ordre du fichier d'index (création croissante).
+ const ord = new Map(CONVS.map((c, i) => [c.id, i]));
+ CONVS.sort((a, b) => (b.updated || 0) - (a.updated || 0)
+ || (b.created || 0) - (a.created || 0)
+ || ord.get(b.id) - ord.get(a.id));
CONV_ACTIVE = r.active || '';
CONV_BUSY = !!r.busy;
renderConversations();
@@ -8287,6 +8379,12 @@ function openDetails(el){
if(typeof el === 'string') el = document.getElementById(el);
while(el){
if(el.tagName === 'DETAILS') el.open = true;
+ // La cible vit dans un panneau de la modale de réglages : ouvrir la modale
+ // sur ce panneau. C'est ce qui garde tous les appelants historiques
+ // (pastille d'état, jobs moteur) valides depuis la refonte en modale.
+ if(el.classList && el.classList.contains('set-pane') && typeof openSettings === 'function'){
+ openSettings(el.dataset.pane);
+ }
el = el.parentElement;
}
}
@@ -8921,4 +9019,41 @@ async function runTaskNow(){
st.style.color = 'var(--err)';
}
}
+// ─── Réglages en modale ──────────────────────────────────────────────────────
+// Toutes les sections de réglages vivent dans une modale à deux volets : la nav
+// des sections à gauche, LE panneau choisi à droite. La barre latérale ne garde
+// que les discussions et le moniteur machine — visuellement plus simple, et
+// chaque section dispose enfin de toute la largeur.
+//
+// Les ids historiques des sections (svc-log-box, lc-details, tasks-details…)
+// sont posés sur les .set-pane : openDetails() (18-shell.js) les résout vers le
+// bon panneau, si bien que tous les chemins existants — pastille d'état du
+// moteur, pastille d'installation, jobs llama.cpp — rouvrent la modale au bon
+// endroit sans changer une ligne de leurs appelants.
+let SET_LAST = 'config';
+// Panneaux à contenu paresseux : chargés à l'affichage — l'équivalent de
+// l'ancien ontoggle des .
+const SET_HOOKS = {
+ 'engine-log': () => { loadSvcLog(); showPaths(); },
+};
+function openSettings(pane){
+ showModal('settings-modal');
+ settingsShow(pane || SET_LAST);
+}
+function closeSettings(){ hideModal('settings-modal'); }
+function settingsShow(pane){
+ SET_LAST = pane;
+ document.querySelectorAll('#set-nav [data-pane]').forEach(b => b.classList.toggle('active', b.dataset.pane === pane));
+ document.querySelectorAll('#set-body .set-pane').forEach(s => s.classList.toggle('active', s.dataset.pane === pane));
+ const body = document.getElementById('set-body');
+ if(body) body.scrollTop = 0;
+ const h = SET_HOOKS[pane]; if(h) h();
+}
+// Échap ferme la modale — capture:false, donc les modales à confirmation
+// (ask-modal, qui écoute en capture) gardent la main quand elles sont ouvertes.
+document.addEventListener('keydown', e => {
+ if(e.key !== 'Escape') return;
+ const m = document.getElementById('settings-modal');
+ if(m && m.classList.contains('show')) closeSettings();
+});