1 Commits

23 changed files with 17955 additions and 5245 deletions

View File

@@ -11,56 +11,6 @@ Journal technique de la V2. Décisions, anomalies, points bloquants, TODOs.
--- ---
## 2026-05-08 — Fix mobile + chatbot prod (cause racine résolue)
**Commits :** session loggée sur main (pushé sur gitea)
**Pattern :** pilote direct, 2 batches successifs, ~3h, 11 fichiers
### Cause racine bug "chatbot Carte 1 == Carte 2"
`/api/chatbot-reseaux` était **404 en prod** (jamais déployé) — explique pourquoi 5 cycles de fix précédents (ChatbotReseaux.vue prop endpoint, useRoute fallback, useMarkdown direct, etc.) n'ont rien donné : le code source était correct depuis le début. Le rebuild + redeploy de cette session résout le bug.
**Verif :** `curl -s -X POST https://aep.trans-former.fr/api/chatbot-reseaux` → 200 + réponse distincte de `/api/chatbot`.
### Batch 1 — fixes mobile principaux
- Hamburger app.vue : ajout Jobs + Manifeste + Soutenir, ré-ordonnancement (Manifeste dans 2e groupe avec À propos/Soutenir/Signaler)
- BandeauBas.vue : FAB cœur jaune mobile retiré (Soutenir migré dans hamburger via lien Liberapay direct)
- agences.vue mobile : 3e onglet "Graphe" ajouté + masquage MobileSheet en mode graphe (canvas fullscreen)
- a-propos.vue : section 1 "Mission" retirée (devient pop-up Carte 1) + `overflow-x: hidden` sur `.apropos-page` + retrait `white-space: nowrap` problématique sur `.badge-detail`
- pages/manifeste.vue : nouvelle page (texte version `manifeste-page-carto-V1.md`, sans le diagramme ASCII pour V1 web)
- components/MissionPopup.vue : nouveau composant générique (props `title`, `ctaLabel`, `storageKey`, slot pour contenu, `:slotted()` pour styles)
- index.vue : intégration MissionPopup + bouton (i) `position:fixed` bottom-left + auto-show 1ère visite via `localStorage.aep_mission_seen`
- trouver-du-taf.vue : toggle "Filtres [N] [chevron]" mobile-only (`@media max-width: 767px`) avec `taff-filters-collapsible` max-height transition
- FicheModal.vue + FicheModalV2.vue : sur mobile `top: 76px` + `max-height: calc(100dvh - 92px)` au lieu de `top: 50% translate(-50%, -50%)` + `max-height: 90vh` qui mordait sur le header
### Batch 2 — pop-up Carte 2, logo, intro Jobs, labels graphe
- agences.vue : pop-up Réseaux AEP avec MissionPopup (storageKey `aep_reseaux_seen`, ctaLabel "Explorer les 120 réseaux") + bouton (i) flottant
- app.vue logo header : badge AEP + 2 spans `logo-line-1` ("Architecture") / `logo-line-2` ("d'Écologie Politique") avec font-size responsive (0.7rem mobile → 0.85rem ≥1024)
- trouver-du-taf.vue : `<details class="taff-pedago" open>` avec 3 blocs (deux onglets, trois étiquettes, cinq axes) + onglet "Plateformes B2C" → "Pour archi indépendants"
- GraphView.vue : `d3NodeSelection.filter(type==='structure').append('text')` avec class `graph-struct-label`, `dy: -(d.r + 5)`, font-size 9.5px, halo via `paint-order: stroke; stroke: var(--nav-bg)` (style global non-scoped pour piercer D3)
### Bug d'opération à retenir
Lors du 1er déploiement batch 2, `bash deploy.sh` semblait OK (HTTP 200) mais le HTML en prod ne contenait pas les modifs. **Cause** : Dropbox sync a effacé `.output/` entre `npm run build` et le tar SCP — le tar a uploadé un `.output` quasi-vide. Solution : 2e cycle clean (`Remove-Item .nuxt/dist + .output`) + rebuild + redeploy avec `yes y |` (skip confirm interactif `.env diff`).
**Réflexe à intégrer** : après build, vérifier `grep -o "<un-fragment-de-modif>" .output/public/_nuxt/*.js | head` AVANT le deploy. Si 0 match → ne pas deploy, rebuild.
### Bug de communication à retenir
Jules a signalé "le logo n'a pas marché", "B2C pas renommé", "hamburger pas modifié" alors que le HTML en prod contenait bien les modifs (vérifié curl avec `?nc=$(date +%s)`). **Cause** : cache navigateur / service worker Nuxt. Réflexe à mettre en place pour /done de toute session web : si Jules dit "ça n'apparaît pas", vérifier curl en bypass cache AVANT de chercher un bug. Si match curl → demander hard refresh (Ctrl+Shift+R).
### Reste à faire (batch 3)
Voir `0 INBOX/PROMPTS/cascade-megaboum/REPRISE-aep-carto-fix-batch3.md` :
- Bouton "+" → sélecteur 3 cartes (Entraide/Réseaux/Jobs)
- Pop-up explication 5 axes Jobs (paragraphe par axe)
- Pop-up Carte 1 visibilité (option à clarifier avec Jules)
- GraphView Carte 1 (centres = hashtags, couche échelle activable) — gros chantier session dédiée
---
## 2026-04-27 — Session V3 : Finition mobile + Blog Liberapay + 3 deploys ## 2026-04-27 — Session V3 : Finition mobile + Blog Liberapay + 3 deploys
**Commit :** `a02a555` — feat(mobile): accordéon outremer, hamburger nav, logo AEP, fiches cliquables, chatbot fullscreen **Commit :** `a02a555` — feat(mobile): accordéon outremer, hamburger nav, logo AEP, fiches cliquables, chatbot fullscreen

112
app.vue
View File

@@ -51,11 +51,12 @@
Codev Codev
</NuxtLink> </NuxtLink>
<NuxtLink <NuxtLink
to="/media" to="/rag"
class="nav-tab" class="nav-tab"
:class="{ 'nav-tab--active': route.path === '/media' }" :class="{ 'nav-tab--active': route.path === '/rag' }"
> >
MEDIA RAG
<span class="nav-tab-badge">en construction</span>
</NuxtLink> </NuxtLink>
</nav> </nav>
@@ -107,52 +108,14 @@
> >
Signaler Signaler
</NuxtLink> </NuxtLink>
<!-- Proposer — popover 3 choix --> <!-- Proposer une ressource -->
<div class="hidden sm:block relative" ref="proposerAnchor" data-proposer-popover>
<button
@click="proposerOpen = !proposerOpen"
class="px-3 py-1.5 rounded-lg text-sm font-semibold transition-all hover:opacity-80 inline-flex items-center gap-1"
style="background: var(--nav-accent); color: var(--nav-text);"
aria-label="Proposer une contribution"
>
+ Proposer
</button>
<div
v-if="proposerOpen"
class="absolute right-0 top-full mt-1 rounded-lg shadow-lg min-w-[240px] py-1"
style="background: var(--nav-surface); border: 1px solid var(--nav-bg-alt); z-index: 9999;"
>
<NuxtLink <NuxtLink
to="/contribuer" to="/contribuer"
class="flex items-center justify-between px-4 py-2.5 text-sm font-medium transition-opacity hover:opacity-70" class="px-3 py-1.5 rounded-lg text-sm font-semibold transition-all hover:opacity-80 hidden sm:inline-flex items-center gap-1"
style="color: var(--nav-text);" style="background: var(--nav-accent); color: var(--nav-text);"
@click="proposerOpen = false"
> >
<span>Fiche Entraide <span style="color: var(--nav-text-muted); font-weight: 400; font-size: 0.7rem; display: block;">Carte 1 — Écosystème archi</span></span> + Proposer
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0; color: var(--nav-text-muted);"><polyline points="9 18 15 12 9 6"/></svg>
</NuxtLink> </NuxtLink>
<div style="height: 1px; background: var(--nav-bg-alt); margin: 2px 0;"></div>
<NuxtLink
to="/contribuer-reseau"
class="flex items-center justify-between px-4 py-2.5 text-sm font-medium transition-opacity hover:opacity-70"
style="color: var(--nav-text);"
@click="proposerOpen = false"
>
<span>Réseau / collectif <span style="color: var(--nav-text-muted); font-weight: 400; font-size: 0.7rem; display: block;">Carte 2 — Réseaux AEP</span></span>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0; color: var(--nav-text-muted);"><polyline points="9 18 15 12 9 6"/></svg>
</NuxtLink>
<div style="height: 1px; background: var(--nav-bg-alt); margin: 2px 0;"></div>
<NuxtLink
to="/contribuer-job"
class="flex items-center justify-between px-4 py-2.5 text-sm font-medium transition-opacity hover:opacity-70"
style="color: var(--nav-text);"
@click="proposerOpen = false"
>
<span>Plateforme jobs <span style="color: var(--nav-text-muted); font-weight: 400; font-size: 0.7rem; display: block;">Carte 3 — Jobs archi</span></span>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0; color: var(--nav-text-muted);"><polyline points="9 18 15 12 9 6"/></svg>
</NuxtLink>
</div>
</div>
<!-- Toggle dark mode --> <!-- Toggle dark mode -->
<button <button
@@ -174,40 +137,18 @@
</svg> </svg>
</button> </button>
<!-- Mobile : contribuer icône → popover --> <!-- Mobile : contribuer icône -->
<div class="sm:hidden relative" data-proposer-popover> <NuxtLink
<button to="/contribuer"
@click="proposerOpen = !proposerOpen" class="sm:hidden p-2 rounded-lg"
class="p-2 rounded-lg"
style="background: var(--nav-accent); color: var(--nav-text);" style="background: var(--nav-accent); color: var(--nav-text);"
title="Contribuer" title="Contribuer une fiche"
aria-label="Contribuer" aria-label="Contribuer"
> >
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"> <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
<line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/> <line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/>
</svg> </svg>
</button>
<div
v-if="proposerOpen"
class="absolute right-0 top-full mt-1 rounded-lg shadow-lg min-w-[220px] py-1"
style="background: var(--nav-surface); border: 1px solid var(--nav-bg-alt); z-index: 9999;"
>
<NuxtLink to="/contribuer" class="flex items-center justify-between px-4 py-2.5 text-sm font-medium transition-opacity hover:opacity-70" style="color: var(--nav-text);" @click="proposerOpen = false">
<span>Fiche Entraide</span>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0; color: var(--nav-text-muted);"><polyline points="9 18 15 12 9 6"/></svg>
</NuxtLink> </NuxtLink>
<div style="height: 1px; background: var(--nav-bg-alt); margin: 2px 0;"></div>
<NuxtLink to="/contribuer-reseau" class="flex items-center justify-between px-4 py-2.5 text-sm font-medium transition-opacity hover:opacity-70" style="color: var(--nav-text);" @click="proposerOpen = false">
<span>Réseau / collectif</span>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0; color: var(--nav-text-muted);"><polyline points="9 18 15 12 9 6"/></svg>
</NuxtLink>
<div style="height: 1px; background: var(--nav-bg-alt); margin: 2px 0;"></div>
<NuxtLink to="/contribuer-job" class="flex items-center justify-between px-4 py-2.5 text-sm font-medium transition-opacity hover:opacity-70" style="color: var(--nav-text);" @click="proposerOpen = false">
<span>Plateforme jobs</span>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="flex-shrink:0; color: var(--nav-text-muted);"><polyline points="9 18 15 12 9 6"/></svg>
</NuxtLink>
</div>
</div>
<!-- Hamburger mobile (lg:hidden) — toujours en dernier à droite --> <!-- Hamburger mobile (lg:hidden) — toujours en dernier à droite -->
<div class="lg:hidden relative"> <div class="lg:hidden relative">
@@ -234,7 +175,7 @@
<NuxtLink to="/" class="block px-4 py-2.5 text-sm font-medium transition-opacity hover:opacity-70" :style="route.path === '/' ? 'color: var(--nav-primary-solid); font-weight: 700;' : 'color: var(--nav-text);'">Écosystème Entraide Architecture</NuxtLink> <NuxtLink to="/" class="block px-4 py-2.5 text-sm font-medium transition-opacity hover:opacity-70" :style="route.path === '/' ? 'color: var(--nav-primary-solid); font-weight: 700;' : 'color: var(--nav-text);'">Écosystème Entraide Architecture</NuxtLink>
<NuxtLink to="/agences" class="block px-4 py-2.5 text-sm transition-opacity hover:opacity-70" :style="route.path === '/agences' ? 'color: var(--nav-primary-solid); font-weight: 700;' : 'color: var(--nav-text);'">Réseaux AEP</NuxtLink> <NuxtLink to="/agences" class="block px-4 py-2.5 text-sm transition-opacity hover:opacity-70" :style="route.path === '/agences' ? 'color: var(--nav-primary-solid); font-weight: 700;' : 'color: var(--nav-text);'">Réseaux AEP</NuxtLink>
<NuxtLink to="/trouver-du-taf" class="block px-4 py-2.5 text-sm transition-opacity hover:opacity-70" :style="route.path === '/trouver-du-taf' ? 'color: var(--nav-primary-solid); font-weight: 700;' : 'color: var(--nav-text);'">Jobs</NuxtLink> <NuxtLink to="/trouver-du-taf" class="block px-4 py-2.5 text-sm transition-opacity hover:opacity-70" :style="route.path === '/trouver-du-taf' ? 'color: var(--nav-primary-solid); font-weight: 700;' : 'color: var(--nav-text);'">Jobs</NuxtLink>
<NuxtLink to="/media" class="block px-4 py-2.5 text-sm transition-opacity hover:opacity-70" :style="route.path === '/media' ? 'color: var(--nav-primary-solid); font-weight: 700;' : 'color: var(--nav-text);'">MEDIA</NuxtLink> <NuxtLink to="/rag" class="block px-4 py-2.5 text-sm transition-opacity hover:opacity-70" style="color: var(--nav-text);">RAG</NuxtLink>
<NuxtLink to="/codev" class="block px-4 py-2.5 text-sm transition-opacity hover:opacity-70" :style="route.path.startsWith('/codev') ? 'color: var(--nav-primary-solid); font-weight: 700;' : 'color: var(--nav-text);'">Codev</NuxtLink> <NuxtLink to="/codev" class="block px-4 py-2.5 text-sm transition-opacity hover:opacity-70" :style="route.path.startsWith('/codev') ? 'color: var(--nav-primary-solid); font-weight: 700;' : 'color: var(--nav-text);'">Codev</NuxtLink>
<div style="height: 1px; background: var(--nav-bg-alt); margin: 4px 0;"></div> <div style="height: 1px; background: var(--nav-bg-alt); margin: 4px 0;"></div>
<NuxtLink to="/manifeste" class="block px-4 py-2.5 text-sm transition-opacity hover:opacity-70" :style="route.path === '/manifeste' ? 'color: var(--nav-primary-solid); font-weight: 700;' : 'color: var(--nav-text-muted);'">Manifeste</NuxtLink> <NuxtLink to="/manifeste" class="block px-4 py-2.5 text-sm transition-opacity hover:opacity-70" :style="route.path === '/manifeste' ? 'color: var(--nav-primary-solid); font-weight: 700;' : 'color: var(--nav-text-muted);'">Manifeste</NuxtLink>
@@ -264,31 +205,6 @@ const route = useRoute()
const hamburgerOpen = ref(false) const hamburgerOpen = ref(false)
watch(() => route.path, () => { hamburgerOpen.value = false }) watch(() => route.path, () => { hamburgerOpen.value = false })
// ── Popover "+ Proposer" ─────────────────────────────────────────────────
const proposerOpen = ref(false)
const proposerAnchor = ref<HTMLElement | null>(null)
function onClickOutsideProposer(e: MouseEvent) {
// Ferme si le clic est hors de tout élément portant data-proposer-popover
const target = e.target as HTMLElement
if (!target.closest('[data-proposer-popover]')) {
proposerOpen.value = false
}
}
watch(proposerOpen, (open) => {
if (open) {
// Délai court pour ne pas attraper le clic d'ouverture lui-même
setTimeout(() => document.addEventListener('click', onClickOutsideProposer, true), 10)
} else {
document.removeEventListener('click', onClickOutsideProposer, true)
}
})
onUnmounted(() => {
document.removeEventListener('click', onClickOutsideProposer, true)
})
// ── Dark mode ───────────────────────────────────────────────────────────── // ── Dark mode ─────────────────────────────────────────────────────────────
const isDark = ref(false) const isDark = ref(false)

File diff suppressed because one or more lines are too long

View File

@@ -1,448 +0,0 @@
<template>
<!-- Mode overlay : bouton flottant bottom-right (legacy) -->
<template v-if="!inline">
<button v-if="!open" @click="open = true"
class="fixed bottom-6 right-6 z-[1000] flex items-center gap-2 px-4 rounded-full shadow-lg"
style="height:48px;background:var(--nav-primary);color:var(--nav-text-on-primary);font-size:0.875rem;font-weight:600;"
aria-label="Chatbot Pensees Ecologiques">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>
</svg>
<span>Pensees ?</span>
</button>
<Transition name="cpanel">
<div v-if="open" class="fixed bottom-6 right-6 z-[1000] flex flex-col"
style="width:min(360px,calc(100vw - 24px));max-height:60vh;background:var(--nav-surface);border-radius:14px;box-shadow:0 8px 32px rgba(26,34,56,0.22);overflow:hidden;border:1px solid var(--nav-bg-alt);"
role="dialog" aria-modal="true" aria-label="RAG Pensees Ecologiques">
<!-- Header overlay -->
<div class="flex items-center justify-between px-4 py-3 shrink-0" style="border-bottom:1px solid var(--nav-bg-alt);background:var(--nav-bg);">
<div>
<p class="text-sm font-bold" style="color:var(--nav-text);">RAG Pensees Ecologiques</p>
<p class="text-xs" style="color:var(--nav-text-muted);">{{ corpusCount }} auteurs ingeres</p>
</div>
<button @click="open = false" class="flex items-center justify-center w-7 h-7 rounded-full hover:opacity-70"
style="background:var(--nav-bg-alt);color:var(--nav-text-muted);" aria-label="Fermer">
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round">
<line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/>
</svg>
</button>
</div>
<!-- Corpus toggle overlay -->
<div class="shrink-0 px-3 pt-2 pb-1" style="background:var(--nav-bg);border-bottom:1px solid var(--nav-bg-alt);">
<div class="flex gap-1" role="group" aria-label="Choisir le corpus">
<button v-for="opt in corpusOptions" :key="opt.value" @click="setCorpus(opt.value)" :title="opt.tooltip"
class="flex-1 px-2 py-1 rounded text-xs font-medium transition-colors"
:style="corpus === opt.value ? 'background:var(--nav-primary);color:var(--nav-text-on-primary);' : 'background:var(--nav-bg-alt);color:var(--nav-text-muted);'"
:aria-pressed="corpus === opt.value">{{ opt.label }}</button>
</div>
</div>
<!-- Messages overlay -->
<div ref="msgElOverlay" class="flex-1 overflow-y-auto px-4 py-3 flex flex-col gap-3" style="min-height:0;">
<div v-if="messages.length === 0" style="font-size:0.8rem;color:var(--nav-text-muted);line-height:1.5;">
<template v-if="corpus === 'pensees'">Pose une question sur les pensees ecologiques...</template>
<template v-else-if="corpus === 'projets'">Pose une question sur les projets d'architecture de Jules...</template>
<template v-else>Pose une question sur les pensees ecologiques ancrees dans les projets archi de Jules.</template>
</div>
<template v-for="(msg, i) in messages" :key="i">
<div v-if="msg.role === 'user'" class="self-end max-w-[85%] px-3 py-2 rounded-xl text-sm"
style="background:var(--nav-primary);color:var(--nav-text-on-primary);font-weight:500;">{{ msg.content }}</div>
<div v-else class="self-start max-w-full">
<div class="px-3 py-2 rounded-xl text-sm leading-relaxed" style="background:var(--nav-bg-alt);color:var(--nav-text);"
v-html="renderMd(stripSrc(msg.content))" />
<div v-if="filteredSources(msg.content).length" class="mt-1.5">
<button @click="toggled[i] = !toggled[i]" class="flex items-center gap-1 text-xs hover:opacity-70" style="color:var(--nav-text-muted);">
<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"
:style="`transform:rotate(${toggled[i] ? 90 : 0}deg);transition:transform 0.15s`"><polyline points="9 18 15 12 9 6"/></svg>
Sources ({{ filteredSources(msg.content).length }})
</button>
<div v-if="toggled[i]" class="mt-1 flex flex-col gap-1">
<div v-for="(s, si) in filteredSources(msg.content)" :key="si" class="px-2 py-1 rounded text-xs"
style="background:var(--nav-bg-alt);color:var(--nav-text-muted);border-left:2px solid var(--nav-primary-solid);">
<span style="font-weight:600;color:var(--nav-text);">[{{ si + 1 }}]</span> {{ s }}
</div>
</div>
</div>
</div>
</template>
<div v-if="loading" class="self-start px-3 py-2 rounded-xl" style="background:var(--nav-bg-alt);">
<span class="dots"><span/><span style="animation-delay:150ms"/><span style="animation-delay:300ms"/></span>
</div>
<div v-if="err" class="text-xs px-3 py-2 rounded-xl" style="background:#fee;color:#c0392b;">{{ err }}</div>
</div>
<!-- Input overlay -->
<div class="shrink-0 px-3 py-3" style="border-top:1px solid var(--nav-bg-alt);">
<div class="flex items-center gap-2" style="position:relative;">
<!-- Hashtag autocomplete dropdown (Slack/Discord pattern, au-dessus de l'input) -->
<div v-if="hashtagDropdownOpen && hashtagSuggestions.length"
class="hashtag-dropdown"
style="position:absolute;bottom:100%;left:0;right:0;margin-bottom:6px;max-height:220px;overflow-y:auto;background:var(--nav-surface);border:1px solid var(--nav-bg-alt);border-radius:8px;box-shadow:0 -4px 12px rgba(0,0,0,0.12);z-index:50;">
<div v-for="(auteur, idx) in hashtagSuggestions" :key="auteur.id"
@mousedown.prevent="applyHashtagSuggestion(auteur)"
@mouseenter="hashtagSelectedIndex = idx"
class="px-3 py-2 cursor-pointer text-sm"
:style="idx === hashtagSelectedIndex ? 'background:var(--nav-primary);color:var(--nav-text-on-primary);' : 'color:var(--nav-text);'">
<span style="font-weight:600;">#{{ auteur.id }}</span>
<span :style="idx === hashtagSelectedIndex ? 'opacity:0.85;margin-left:8px;font-size:0.78rem;' : 'opacity:0.65;margin-left:8px;font-size:0.78rem;color:var(--nav-text-muted);'">{{ auteur.nom }}</span>
</div>
</div>
<input ref="inputElOverlay" v-model="q" type="text" placeholder="Ta question, tape #auteur pour cibler" maxlength="500"
class="flex-1 px-3 py-2 rounded-lg text-sm outline-none"
style="background:var(--nav-bg);color:var(--nav-text);border:1px solid var(--nav-bg-alt);"
@keydown="onInputKeydown" />
<button @click="send" :disabled="loading || !q.trim()"
class="flex items-center justify-center w-9 h-9 rounded-lg"
:style="loading||!q.trim() ? 'background:var(--nav-bg-alt);opacity:0.5;cursor:not-allowed;' : 'background:var(--nav-primary);cursor:pointer;'"
aria-label="Envoyer">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="color:white;">
<line x1="22" y1="2" x2="11" y2="13"/><polygon points="22 2 15 22 11 13 2 9 22 2"/>
</svg>
</button>
</div>
</div>
</div>
</Transition>
</template>
<!-- Mode inline : remplit 100% de son parent slot -->
<div v-else
class="flex flex-col w-full h-full"
style="background:var(--nav-surface);overflow:hidden;"
role="region" aria-label="RAG Pensees Ecologiques">
<!-- Header inline -->
<div class="flex items-center justify-between px-4 py-2 shrink-0" style="border-bottom:1px solid var(--nav-bg-alt);background:var(--nav-bg);">
<div>
<p class="text-sm font-bold" style="color:var(--nav-text);">RAG Pensees Ecologiques</p>
<p class="text-xs" style="color:var(--nav-text-muted);">{{ corpusCount }} auteurs ingeres</p>
</div>
</div>
<!-- Corpus toggle inline -->
<div class="shrink-0 px-3 pt-2 pb-1" style="background:var(--nav-bg);border-bottom:1px solid var(--nav-bg-alt);">
<div class="flex gap-1" role="group" aria-label="Choisir le corpus">
<button v-for="opt in corpusOptions" :key="opt.value" @click="setCorpus(opt.value)" :title="opt.tooltip"
class="flex-1 px-2 py-1 rounded text-xs font-medium transition-colors"
:style="corpus === opt.value ? 'background:var(--nav-primary);color:var(--nav-text-on-primary);' : 'background:var(--nav-bg-alt);color:var(--nav-text-muted);'"
:aria-pressed="corpus === opt.value">{{ opt.label }}</button>
</div>
</div>
<!-- Messages inline -->
<div ref="msgElInline" class="flex-1 overflow-y-auto px-4 py-3 flex flex-col gap-3" style="min-height:0;">
<div v-if="messages.length === 0" style="font-size:0.8rem;color:var(--nav-text-muted);line-height:1.5;">
<template v-if="corpus === 'pensees'">Pose une question sur les pensees ecologiques : ecosocialisme, decroissance, ecofeminismes, technocritique, deep ecology...</template>
<template v-else-if="corpus === 'projets'">Pose une question sur les projets d'architecture de Jules : Butte Pinson, strategie thermique, partis pris constructifs...</template>
<template v-else>Pose une question sur les pensees ecologiques ancrees dans les projets archi de Jules (corpus croise, defaut).</template>
</div>
<template v-for="(msg, i) in messages" :key="i">
<div v-if="msg.role === 'user'" class="self-end max-w-[85%] px-3 py-2 rounded-xl text-sm"
style="background:var(--nav-primary);color:var(--nav-text-on-primary);font-weight:500;">{{ msg.content }}</div>
<div v-else class="self-start max-w-full">
<div class="px-3 py-2 rounded-xl text-sm leading-relaxed" style="background:var(--nav-bg-alt);color:var(--nav-text);"
v-html="renderMd(stripSrc(msg.content))" />
<div v-if="filteredSources(msg.content).length" class="mt-1.5">
<button @click="toggled[i] = !toggled[i]" class="flex items-center gap-1 text-xs hover:opacity-70" style="color:var(--nav-text-muted);">
<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"
:style="`transform:rotate(${toggled[i] ? 90 : 0}deg);transition:transform 0.15s`"><polyline points="9 18 15 12 9 6"/></svg>
Sources ({{ filteredSources(msg.content).length }})
</button>
<div v-if="toggled[i]" class="mt-1 flex flex-col gap-1">
<div v-for="(s, si) in filteredSources(msg.content)" :key="si" class="px-2 py-1 rounded text-xs"
style="background:var(--nav-bg-alt);color:var(--nav-text-muted);border-left:2px solid var(--nav-primary-solid);">
<span style="font-weight:600;color:var(--nav-text);">[{{ si + 1 }}]</span> {{ s }}
</div>
</div>
</div>
</div>
</template>
<div v-if="loading" class="self-start px-3 py-2 rounded-xl" style="background:var(--nav-bg-alt);">
<span class="dots"><span/><span style="animation-delay:150ms"/><span style="animation-delay:300ms"/></span>
</div>
<div v-if="err" class="text-xs px-3 py-2 rounded-xl" style="background:#fee;color:#c0392b;">{{ err }}</div>
</div>
<!-- Input inline -->
<div class="shrink-0 px-3 py-3" style="border-top:1px solid var(--nav-bg-alt);">
<div class="flex items-center gap-2" style="position:relative;">
<!-- Hashtag autocomplete dropdown (Slack/Discord pattern, au-dessus de l'input) -->
<div v-if="hashtagDropdownOpen && hashtagSuggestions.length"
class="hashtag-dropdown"
style="position:absolute;bottom:100%;left:0;right:0;margin-bottom:6px;max-height:220px;overflow-y:auto;background:var(--nav-surface);border:1px solid var(--nav-bg-alt);border-radius:8px;box-shadow:0 -4px 12px rgba(0,0,0,0.12);z-index:50;">
<div v-for="(auteur, idx) in hashtagSuggestions" :key="auteur.id"
@mousedown.prevent="applyHashtagSuggestion(auteur)"
@mouseenter="hashtagSelectedIndex = idx"
class="px-3 py-2 cursor-pointer text-sm"
:style="idx === hashtagSelectedIndex ? 'background:var(--nav-primary);color:var(--nav-text-on-primary);' : 'color:var(--nav-text);'">
<span style="font-weight:600;">#{{ auteur.id }}</span>
<span :style="idx === hashtagSelectedIndex ? 'opacity:0.85;margin-left:8px;font-size:0.78rem;' : 'opacity:0.65;margin-left:8px;font-size:0.78rem;color:var(--nav-text-muted);'">{{ auteur.nom }}</span>
</div>
</div>
<input ref="inputElInline" v-model="q" type="text" placeholder="Ta question, tape #auteur pour cibler" maxlength="500"
class="flex-1 px-3 py-2 rounded-lg text-sm outline-none"
style="background:var(--nav-bg);color:var(--nav-text);border:1px solid var(--nav-bg-alt);"
@keydown="onInputKeydown" />
<button @click="send" :disabled="loading || !q.trim()"
class="flex items-center justify-center w-9 h-9 rounded-lg"
:style="loading||!q.trim() ? 'background:var(--nav-bg-alt);opacity:0.5;cursor:not-allowed;' : 'background:var(--nav-primary);cursor:pointer;'"
aria-label="Envoyer">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="color:white;">
<line x1="22" y1="2" x2="11" y2="13"/><polygon points="22 2 15 22 11 13 2 9 22 2"/>
</svg>
</button>
</div>
</div>
</div>
</template>
<script setup lang="ts">
interface Message { role: 'user' | 'assistant'; content: string }
interface AuteurMini { id: string; nom: string }
type CorpusMode = 'pensees' | 'projets' | 'both'
const CORPUS_STORAGE_KEY = 'chatbot-pensees-corpus'
const PROJECT_SOURCE_PATTERNS = [/butte.?pinson/i, /butte_pinson/i]
function isProjectSource(s: string): boolean {
return PROJECT_SOURCE_PATTERNS.some(p => p.test(s))
}
const corpusOptions: { value: CorpusMode; label: string; tooltip: string }[] = [
{ value: 'pensees', label: 'Pensees', tooltip: 'Corpus FRACAS uniquement (auteurs ecologie politique)' },
{ value: 'projets', label: 'Projets', tooltip: 'Projets archi de Jules uniquement' },
{ value: 'both', label: 'Croise*', tooltip: 'Projets ancres + pensees en eclairage (defaut)' },
]
const props = defineProps<{
auteurContext?: string | null
inline?: boolean
}>()
const open = ref(false)
const q = ref('')
const messages = ref<Message[]>([])
const loading = ref(false)
const err = ref('')
const toggled = ref<Record<number, boolean>>({})
const msgElOverlay = ref<HTMLElement | null>(null)
const msgElInline = ref<HTMLElement | null>(null)
const inputElOverlay = ref<HTMLInputElement | null>(null)
const inputElInline = ref<HTMLInputElement | null>(null)
const corpusCount = 18
const corpus = ref<CorpusMode>('both')
// Phase 8.E : hashtag mentions
const auteursIngeres = ref<AuteurMini[]>([])
const hashtagSuggestions = ref<AuteurMini[]>([])
const hashtagDropdownOpen = ref(false)
const hashtagSelectedIndex = ref(0)
function getActiveInput(): HTMLInputElement | null {
return props.inline ? inputElInline.value : inputElOverlay.value
}
function detectHashtagAtCursor(input: string, cursorPos: number): { start: number; partial: string } | null {
const before = input.slice(0, cursorPos)
const m = before.match(/#([a-z0-9-]*)$/i)
if (!m) return null
return { start: m.index ?? 0, partial: (m[1] || '').toLowerCase() }
}
function updateHashtagSuggestions() {
const el = getActiveInput()
const cursorPos = el?.selectionStart ?? q.value.length
const detection = detectHashtagAtCursor(q.value, cursorPos)
// Ouvrir dès que le # est présent (partial vide accepté pour afficher la liste)
if (!detection) {
hashtagDropdownOpen.value = false
return
}
const partial = detection.partial
const list = partial.length === 0
? auteursIngeres.value.slice(0, 8)
: auteursIngeres.value
.filter(a => a.id.toLowerCase().includes(partial) || a.nom.toLowerCase().includes(partial))
.slice(0, 8)
hashtagSuggestions.value = list
hashtagDropdownOpen.value = list.length > 0
hashtagSelectedIndex.value = 0
}
function applyHashtagSuggestion(auteur: AuteurMini) {
const el = getActiveInput()
const cursorPos = el?.selectionStart ?? q.value.length
const detection = detectHashtagAtCursor(q.value, cursorPos)
if (!detection) return
const before = q.value.slice(0, detection.start)
const after = q.value.slice(cursorPos)
const insert = '#' + auteur.id + ' '
q.value = before + insert + after
hashtagDropdownOpen.value = false
nextTick(() => {
const focusEl = getActiveInput()
if (!focusEl) return
focusEl.focus()
const newPos = before.length + insert.length
focusEl.setSelectionRange(newPos, newPos)
})
}
function onInputKeydown(e: KeyboardEvent) {
if (hashtagDropdownOpen.value && hashtagSuggestions.value.length > 0) {
if (e.key === 'ArrowDown') {
e.preventDefault()
hashtagSelectedIndex.value = (hashtagSelectedIndex.value + 1) % hashtagSuggestions.value.length
return
}
if (e.key === 'ArrowUp') {
e.preventDefault()
hashtagSelectedIndex.value = (hashtagSelectedIndex.value - 1 + hashtagSuggestions.value.length) % hashtagSuggestions.value.length
return
}
if (e.key === 'Enter' || e.key === 'Tab') {
e.preventDefault()
applyHashtagSuggestion(hashtagSuggestions.value[hashtagSelectedIndex.value])
return
}
if (e.key === 'Escape') {
e.preventDefault()
hashtagDropdownOpen.value = false
return
}
}
if (e.key === 'Enter') {
e.preventDefault()
send()
}
}
watch(q, () => {
updateHashtagSuggestions()
})
onMounted(async () => {
const saved = window.localStorage.getItem(CORPUS_STORAGE_KEY) as CorpusMode | null
if (saved && ['pensees', 'projets', 'both'].includes(saved)) {
corpus.value = saved
}
// Chargement liste auteurs ingérés pour autocomplete hashtag
try {
const data = await $fetch<any>('/data/auteurs-pensees.json')
auteursIngeres.value = (data?.auteurs ?? [])
.filter((a: any) => a.ingere === true)
.map((a: any) => ({ id: String(a.id), nom: String(a.nom) }))
} catch (e) {
console.error('Erreur chargement auteurs-pensees.json pour hashtag', e)
}
})
function setCorpus(val: CorpusMode) {
corpus.value = val
window.localStorage.setItem(CORPUS_STORAGE_KEY, val)
}
watch(open, (val) => {
if (!val) return
nextTick(() => inputElOverlay.value?.focus())
if (props.auteurContext && messages.value.length === 0)
q.value = `Quelles sont les theses centrales de ${props.auteurContext} ?`
})
watch(() => props.auteurContext, (ctx) => {
if (!ctx) return
if (!props.inline && !open.value) open.value = true
if (messages.value.length === 0) q.value = `Quelles sont les theses centrales de ${ctx} ?`
})
async function send() {
const query = q.value.trim()
if (!query || loading.value) return
// Extraire le premier hashtag matchant un auteur ingéré
let auteurSlug: string | null = null
const matches = [...query.matchAll(/#([a-z0-9-]+)/gi)]
for (const m of matches) {
const slug = m[1].toLowerCase()
if (auteursIngeres.value.find(a => a.id === slug)) {
auteurSlug = slug
break
}
}
// Premier hashtag non-matché (pour info utilisateur si jamais ne match aucun)
let auteurSlugUnmatched: string | null = null
if (!auteurSlug && matches.length > 0) {
auteurSlugUnmatched = matches[0][1].toLowerCase()
}
err.value = ''
messages.value.push({ role: 'user', content: query })
q.value = ''
hashtagDropdownOpen.value = false
loading.value = true
await nextTick()
scrollBottom()
try {
const res = await $fetch<any>('/api/chatbot-pensees', {
method: 'POST',
body: {
query,
mode: 'hybrid',
corpus: corpus.value,
auteur_slug: auteurSlug ?? auteurSlugUnmatched,
},
})
let responseText = res.response ?? ''
if (res.auteur_unmatched) {
responseText = `*(Aucun livre de #${res.auteur_unmatched} n'est ingéré dans le RAG. Je réponds depuis la carte entière.)*\n\n` + responseText
}
messages.value.push({ role: 'assistant', content: responseText })
} catch (e: any) {
const s = e?.response?.status ?? e?.statusCode
err.value = s === 429 ? 'Limite atteinte.' : s === 503 ? 'RAG indisponible.' : 'Erreur, reessaie.'
} finally {
loading.value = false
await nextTick()
scrollBottom()
}
}
function scrollBottom() {
const el = props.inline ? msgElInline.value : msgElOverlay.value
if (el) el.scrollTop = el.scrollHeight
}
function renderMd(t: string) {
return '<p>' + t.replace(/\*\*(.+?)\*\*/g, '<strong>$1</strong>').replace(/\*(.+?)\*/g, '<em>$1</em>').replace(/\n\n/g, '</p><p>').replace(/\n/g, '<br>') + '</p>'
}
function stripSrc(t: string) { return t.replace(/\n*(?:Sources?|References?)\s*:[\s\S]*$/i, '').trim() }
function parseSrc(t: string): string[] {
const bloc = t.match(/\n*(?:Sources?|References?)\s*:\n?([\s\S]+?)$/i)
if (bloc) return bloc[1].split('\n').map(l => l.replace(/^[-*\d.[\]]+\s*/, '').trim()).filter(l => l.length > 3)
return [...new Set([...t.matchAll(/\[([^\]]{5,80})\]/g)].filter(m => m[1].includes(' - ')).map(m => m[1]))]
}
function filteredSources(t: string): string[] {
const all = parseSrc(t)
if (corpus.value === 'both') return all
if (corpus.value === 'projets') return all.filter(s => isProjectSource(s))
return all.filter(s => !isProjectSource(s))
}
</script>
<style scoped>
.cpanel-enter-active { transition: opacity 0.2s, transform 0.22s cubic-bezier(0.34,1.56,0.64,1); }
.cpanel-leave-active { transition: opacity 0.18s, transform 0.15s ease-in; }
.cpanel-enter-from { opacity: 0; transform: translateY(12px) scale(0.95); }
.cpanel-leave-to { opacity: 0; transform: translateY(8px) scale(0.97); }
.dots span { display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--nav-text-muted);margin:0 2px;animation:bounce 1s infinite; }
@keyframes bounce { 0%,80%,100%{transform:translateY(0)}40%{transform:translateY(-5px)} }
</style>

View File

@@ -52,10 +52,9 @@
<div class="chatbot-body-inner" ref="messagesContainer"> <div class="chatbot-body-inner" ref="messagesContainer">
<!-- Onboarding --> <!-- Onboarding -->
<div v-if="messages.length === 0" class="onboarding-bubble"> <div v-if="messages.length === 0" class="onboarding-bubble">
<p>Je connais les structures d'entraide pour architectes référencées sur cette carte — appui juridique, technique, économique, formation, santé mentale, gestion d'agence</p> <p>Explore les 120 structures de la carte par la conversation. Je peux t'aider à trouver des collectifs, agences ou réseaux selon ta situation, ta pratique ou tes inspirations du moment.</p>
<p>Décris ta situation, je te propose les fiches les plus pertinentes.</p> <p class="example">Exemple : "Je cherche des acteurs de la rénovation de maisons individuelles en France, plutôt en milieu rural, avec des approches biosourcées ou low-tech."</p>
<p class="example">Exemple : "Architecte salarié, litige avec mon employeur, besoin d'un appui juridique droit du travail, Île-de-France."</p> <p style="margin-top: 8px; font-size: 0.72rem; opacity: 0.6;">Propulsé par Mistral FR - serveur européen souverain, zéro rétention.</p>
<p style="margin-top: 8px; font-size: 0.72rem; opacity: 0.6;">Propulsé par Mistral FR serveur européen souverain, zéro rétention.</p>
</div> </div>
<!-- Messages --> <!-- Messages -->

View File

@@ -1,16 +1,38 @@
<template> <template>
<div class="space-y-1"> <div class="space-y-1.5">
<p class="filter-label">ÉCHELLE</p> <p class="text-xs font-bold uppercase tracking-widest" style="color: var(--nav-text-muted);">Échelle</p>
<div class="chips-row"> <!-- Inline sur 1 ligne même pattern que FonctionFilter -->
<span <div class="flex flex-wrap gap-x-4 gap-y-1.5">
<label
v-for="option in ECHELLES" v-for="option in ECHELLES"
:key="option" :key="option"
class="chip" class="flex items-center gap-1.5 cursor-pointer select-none transition-opacity"
>
<!-- Case carrée -->
<span
class="flex items-center justify-center shrink-0 transition-all"
style="width: 18px; height: 18px; border: 1.5px solid; border-radius: 3px;"
:style="isSelected(option) :style="isSelected(option)
? 'background: var(--nav-primary); color: var(--nav-text-on-primary); font-weight: 600;' ? 'background: var(--nav-primary); border-color: var(--nav-primary); color: #ffffff;'
: 'background: var(--nav-bg-alt); color: var(--nav-text-muted);'" : 'background: var(--nav-bg-alt); border-color: rgba(26,34,56,0.25); color: transparent;'"
@click="toggle(option)" >
<svg v-if="isSelected(option)" width="11" height="11" viewBox="0 0 12 12" fill="none">
<polyline points="2,6 5,9 10,3" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</span>
<!-- Label -->
<span
class="text-sm leading-tight"
:style="isSelected(option) ? 'color: var(--nav-text); font-weight: 600;' : 'color: var(--nav-text);'"
>{{ option }}</span> >{{ option }}</span>
<!-- Input réel (masqué) -->
<input
type="checkbox"
class="sr-only"
:checked="isSelected(option)"
@change="toggle(option)"
/>
</label>
</div> </div>
</div> </div>
</template> </template>
@@ -39,24 +61,3 @@ function toggle(option: string) {
} }
} }
</script> </script>
<style scoped>
.filter-label {
font-size: 0.7rem;
font-weight: 700;
letter-spacing: 0.08em;
color: var(--nav-text-muted);
display: block;
margin-bottom: 4px;
text-transform: uppercase;
}
.chips-row { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 4px; }
.chip {
cursor: pointer;
padding: 3px 10px;
border-radius: 9999px;
font-size: 0.75rem;
transition: all 0.15s;
user-select: none;
}
</style>

View File

@@ -1,98 +0,0 @@
<template>
<Teleport to="body">
<Transition name="backdrop">
<div v-if="open && auteur" class="fixed inset-0 z-[1500]" style="background: rgba(26,34,56,0.55);" @click="emit('close')" aria-hidden="true" />
</Transition>
<Transition name="modal">
<div v-if="open && auteur" class="fixed z-[1501] left-1/2 flex flex-col"
style="top:50%;transform:translate(-50%,-50%);width:min(520px,94vw);max-height:85vh;background:var(--nav-bg);border-radius:14px;box-shadow:0 16px 64px rgba(26,34,56,0.28);overflow:hidden;"
role="dialog" aria-modal="true">
<!-- Header -->
<div class="flex items-start justify-between px-5 py-4 shrink-0"
:style="`border-bottom: 3px solid ${ecoleColor}; background: var(--nav-surface);`">
<div class="flex-1 min-w-0">
<div class="flex items-center gap-2 flex-wrap">
<span class="px-2 py-0.5 rounded-full text-xs font-semibold" :style="`background:${ecoleColor}22;color:${ecoleColor};`">{{ ecoleLabel }}</span>
<span v-for="eid in auteur.ecoles.filter(e => e !== auteur.ecole_principale)" :key="eid"
class="px-2 py-0.5 rounded-full text-xs" :style="`background:${getEcoleColor(eid)}22;color:${getEcoleColor(eid)};`">{{ getEcoleLabel(eid) }}</span>
</div>
<h2 class="mt-2 font-bold text-lg leading-tight" style="color:var(--nav-text);">{{ auteur.nom }}</h2>
<p class="text-sm" style="color:var(--nav-text-muted);">{{ auteur.dates }}</p>
</div>
<button @click="emit('close')" class="ml-3 shrink-0 flex items-center justify-center w-8 h-8 rounded-full hover:opacity-70"
style="background:var(--nav-bg-alt);color:var(--nav-text-muted);" aria-label="Fermer">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round">
<line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/>
</svg>
</button>
</div>
<!-- Body -->
<div class="flex-1 overflow-y-auto px-5 py-4 flex flex-col gap-4">
<p class="text-sm leading-relaxed" style="color:var(--nav-text);">{{ auteur.bio_courte }}</p>
<div v-if="auteur.theses_cles.length">
<p class="text-xs font-bold uppercase tracking-widest mb-2" style="color:var(--nav-text-muted);">Theses cles</p>
<ul class="flex flex-col gap-1.5">
<li v-for="t in auteur.theses_cles" :key="t" class="flex items-start gap-2 text-sm" style="color:var(--nav-text);">
<span class="mt-1.5 w-1.5 h-1.5 rounded-full shrink-0" :style="`background:${ecoleColor};`"></span>
<span>{{ t }}</span>
</li>
</ul>
</div>
<div v-if="auteur.livres_rag.length">
<p class="text-xs font-bold uppercase tracking-widest mb-2" style="color:var(--nav-text-muted);">Livres dans le RAG</p>
<div class="flex flex-col gap-2">
<div v-for="l in auteur.livres_rag" :key="l.slug" class="flex items-start gap-3 p-3 rounded-lg" style="background:var(--nav-bg-alt);">
<div class="flex-1 min-w-0">
<p class="text-sm font-semibold leading-snug" style="color:var(--nav-text);">{{ l.titre }}</p>
<p class="text-xs mt-0.5" style="color:var(--nav-text-muted);">{{ l.annee }}</p>
</div>
<div class="flex gap-1 shrink-0">
<span v-for="c in l.couches" :key="c" class="px-1.5 py-0.5 rounded text-xs" style="background:var(--nav-surface);color:var(--nav-text-muted);">{{ c }}</span>
</div>
</div>
</div>
</div>
</div>
<!-- Footer -->
<div class="shrink-0 px-5 py-3 border-t" style="border-color:var(--nav-bg-alt);">
<button @click="emit('interroger-rag', auteurId!)" class="w-full py-2.5 rounded-lg text-sm font-semibold hover:opacity-80"
:style="`background:${ecoleColor};color:white;`">
Interroger le RAG sur {{ auteur.nom.split(' ').pop() }}
</button>
</div>
</div>
</Transition>
</Teleport>
</template>
<script setup lang="ts">
interface LivreRag { slug: string; titre: string; annee: number; couches: string[] }
interface AuteurData { id: string; nom: string; dates: string; ecoles: string[]; ecole_principale: string; livres_rag: LivreRag[]; theses_cles: string[]; bio_courte: string }
interface EcoleData { id: string; label: string; color: string }
interface PenseesData { ecoles: EcoleData[]; auteurs: AuteurData[] }
const props = defineProps<{ open: boolean; auteurId: string | null; data: PenseesData | null }>()
const emit = defineEmits<{ close: []; 'interroger-rag': [auteurId: string] }>()
const auteur = computed<AuteurData | null>(() => {
if (!props.auteurId || !props.data) return null
return props.data.auteurs.find(a => a.id === props.auteurId) ?? null
})
const ecoleColor = computed(() => props.data?.ecoles.find(e => e.id === auteur.value?.ecole_principale)?.color ?? '#888')
const ecoleLabel = computed(() => props.data?.ecoles.find(e => e.id === auteur.value?.ecole_principale)?.label ?? '')
function getEcoleColor(id: string) { return props.data?.ecoles.find(e => e.id === id)?.color ?? '#888' }
function getEcoleLabel(id: string) { return props.data?.ecoles.find(e => e.id === id)?.label ?? id }
function onKey(e: KeyboardEvent) { if (e.key === 'Escape' && props.open) emit('close') }
onMounted(() => window.addEventListener('keydown', onKey))
onUnmounted(() => window.removeEventListener('keydown', onKey))
</script>
<style scoped>
.backdrop-enter-active,.backdrop-leave-active { transition: opacity 0.2s; }
.backdrop-enter-from,.backdrop-leave-to { opacity: 0; }
.modal-enter-active { transition: opacity 0.2s, transform 0.22s cubic-bezier(0.34,1.56,0.64,1); }
.modal-leave-active { transition: opacity 0.18s, transform 0.18s ease-in; }
.modal-enter-from { opacity: 0; transform: translate(-50%,-48%) scale(0.94); }
.modal-leave-to { opacity: 0; transform: translate(-50%,-48%) scale(0.96); }
</style>

View File

@@ -1,33 +1,35 @@
<template> <template>
<div class="space-y-1.5">
<p class="text-xs font-bold uppercase tracking-widest" style="color: var(--nav-text-muted);">Fonction</p>
<div class="space-y-1"> <div class="space-y-1">
<!-- Label + toggle collapse -->
<div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px;">
<p class="filter-label" style="margin-bottom: 0;">
FONCTION
<span v-if="modelValue.length" style="font-weight: 400; text-transform: none; letter-spacing: 0; font-size: 0.65rem; margin-left: 4px;">({{ modelValue.length }} active{{ modelValue.length > 1 ? 's' : '' }})</span>
</p>
<button <button
@click="toggleCollapse"
style="font-size: 0.7rem; color: var(--nav-text-muted); background: none; border: none; cursor: pointer; text-decoration: underline; padding: 0; white-space: nowrap;"
>{{ isOpen ? 'Replier' : 'Fonctions (' + FONCTIONS.length + ')' }}</button>
</div>
<!-- Chips (visible si ouvert ou si des fonctions sont actives) -->
<div v-if="isOpen" class="chips-row">
<span
v-for="fn in FONCTIONS" v-for="fn in FONCTIONS"
:key="fn" :key="fn"
class="chip"
:style="modelValue.includes(fn)
? 'background: var(--nav-primary); color: var(--nav-text-on-primary); font-weight: 600;'
: 'background: var(--nav-bg-alt); color: var(--nav-text-muted);'"
@click="toggle(fn)" @click="toggle(fn)"
:aria-pressed="modelValue.includes(fn)"
class="flex items-center gap-2.5 w-full rounded px-1 py-0.5 transition-all text-left hover:opacity-80"
:style="modelValue.includes(fn) ? 'background: rgba(26,34,56,0.06);' : ''"
>
<!-- Case : affiche le rang de priorité si actif, sinon le nombre d'orgs -->
<span
class="flex items-center justify-center shrink-0 text-xs font-bold transition-all"
style="width: 24px; height: 24px; border: 1.5px solid; border-radius: 4px;"
:style="modelValue.includes(fn)
? 'background: var(--nav-primary); border-color: var(--nav-primary); color: var(--nav-text-on-primary);'
: 'background: var(--nav-bg-alt); border-color: var(--nav-bg-alt); color: var(--nav-text-muted);'"
>
{{ modelValue.includes(fn) ? (modelValue.indexOf(fn) + 1) : (counts[fn] ?? 0) }}
</span>
<!-- Label -->
<span
class="text-sm leading-tight"
:style="modelValue.includes(fn) ? 'color: var(--nav-text); font-weight: 600;' : 'color: var(--nav-text);'"
>{{ fn }}</span> >{{ fn }}</span>
</button>
</div> </div>
<!-- Effacer (visible même replié si filtres actifs) -->
<p v-if="modelValue.length" class="text-xs pt-0.5" style="color: var(--nav-text-muted);"> <p v-if="modelValue.length" class="text-xs pt-0.5" style="color: var(--nav-text-muted);">
<button @click="emit('update:modelValue', [])" class="underline hover:opacity-70">Effacer</button> {{ modelValue.length }} actif{{ modelValue.length > 1 ? 's' : '' }}
<button @click="emit('update:modelValue', [])" class="ml-2 underline hover:opacity-70">Effacer</button>
</p> </p>
</div> </div>
</template> </template>
@@ -55,25 +57,6 @@ const emit = defineEmits<{
'update:modelValue': [value: string[]] 'update:modelValue': [value: string[]]
}>() }>()
// Replié par défaut, ouvre automatiquement quand des filtres sont actifs
const manuallyOpen = ref(false)
const isOpen = computed(() => {
return manuallyOpen.value || props.modelValue.length > 0
})
function toggleCollapse() {
// Si des filtres actifs forcent l'ouverture, on doit gérer le cas « forcer fermer »
if (isOpen.value) {
manuallyOpen.value = false
// Si des fonctions sont actives, le computed va les réouvrir — on les efface
// Non : on laisse le choix à l'utilisateur. On toggle juste manuallyOpen.
// Quand replié avec filtres actifs, l'indicateur "(N actives)" reste visible.
} else {
manuallyOpen.value = true
}
}
function toggle(fn: string) { function toggle(fn: string) {
if (props.modelValue.includes(fn)) { if (props.modelValue.includes(fn)) {
emit('update:modelValue', props.modelValue.filter(f => f !== fn)) emit('update:modelValue', props.modelValue.filter(f => f !== fn))
@@ -82,23 +65,3 @@ function toggle(fn: string) {
} }
} }
</script> </script>
<style scoped>
.filter-label {
font-size: 0.7rem;
font-weight: 700;
letter-spacing: 0.08em;
color: var(--nav-text-muted);
display: block;
text-transform: uppercase;
}
.chips-row { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 4px; }
.chip {
cursor: pointer;
padding: 3px 10px;
border-radius: 9999px;
font-size: 0.75rem;
transition: all 0.15s;
user-select: none;
}
</style>

View File

@@ -877,7 +877,6 @@ onUnmounted(() => {
/* Labels des structures dans le graphe (D3 injecte les <text>, donc style global) */ /* Labels des structures dans le graphe (D3 injecte les <text>, donc style global) */
.graph-view .graph-struct-label { .graph-view .graph-struct-label {
fill: var(--nav-text); fill: var(--nav-text);
opacity: 0.7;
paint-order: stroke; paint-order: stroke;
stroke: var(--nav-bg); stroke: var(--nav-bg);
stroke-width: 3px; stroke-width: 3px;

View File

@@ -0,0 +1,30 @@
<template>
<div class="media-tab-backend" style="padding: 2rem; overflow-y: auto;">
<div style="max-width: 640px;">
<h2 style="font-weight: 700; font-size: 1.1rem; margin-bottom: 0.75rem; color: var(--nav-text);">LightRAG backend</h2>
<p style="font-size: 0.9rem; line-height: 1.6; color: var(--nav-text); margin-bottom: 0.5rem;">
Voici l'interface brute du <strong>LightRAG</strong> qui alimente la carte des pensées écologiques.
C'est la "cuisine" du RAG : ingestion de documents, extraction d'entités, relations, requêtes.
</p>
</div>
<!-- PLACEHOLDER — DNS en attente
TODO: Décommenter iframe + supprimer placeholder une fois lightrag.trans-former.fr propagé.
DNS A record à créer sur OVH : lightrag → 178.104.106.195 TTL 300
-->
<div style="margin-top: 1.5rem; padding: 2rem; border: 2px dashed var(--nav-bg-alt, #ddd); border-radius: 8px; text-align: center; color: var(--nav-text-muted);">
<p style="font-size: 1rem; font-weight: 600; margin-bottom: 0.5rem;">⏳ Backend en cours d'exposition publique bientôt accessible.</p>
<p style="font-size: 0.85rem;">L'interface LightRAG sera disponible ici dès la mise en place du sous-domaine <code>lightrag.trans-former.fr</code>.</p>
</div>
<!--
<iframe
src="https://lightrag.trans-former.fr/"
style="width: 100%; height: 70vh; border: 1px solid var(--nav-bg-alt, #ddd); border-radius: 8px; margin-top: 1.5rem;"
title="LightRAG backend AEP — lecture seule"
sandbox="allow-same-origin allow-scripts"
loading="lazy"
/>
-->
</div>
</template>

View File

@@ -0,0 +1,67 @@
<template>
<div class="media-tab-projets" style="padding: 1.5rem; overflow-y: auto;">
<div style="max-width: 70ch; margin-bottom: 1.5rem;">
<h2 style="font-weight: 700; font-size: 1.1rem; margin-bottom: 0.5rem; color: var(--nav-text);">PFE engagés</h2>
<p style="font-size: 0.9rem; line-height: 1.6; color: var(--nav-text);">
Mutualiser le savoir. Voici les PFE engagés publiés en ligne dont nous avons connaissance.
Partage-nous le lien de ton travail si tu veux participer à cette initiative.
</p>
</div>
<div class="projets-grid">
<article v-for="p in projets" :key="p.id" class="projet-card">
<img v-if="p.thumb" :src="p.thumb" :alt="p.titre" class="projet-thumb" loading="lazy" />
<div v-else class="projet-thumb projet-thumb--placeholder">📐</div>
<h3 style="font-weight: 600; font-size: 0.95rem; margin: 0.5rem 0 0.25rem; color: var(--nav-text);">{{ p.titre }}</h3>
<p style="font-size: 0.8rem; color: var(--nav-text-muted); margin-bottom: 0.5rem;">
{{ (p.auteurs || []).filter((a: string) => a !== 'Inconnu').join(', ') }}
<template v-if="p.ecole && p.ecole !== 'Inconnu'"> · {{ p.ecole }}</template>
<template v-if="p.annee && p.annee !== 'Inconnu'"> · {{ p.annee }}</template>
</p>
<p style="font-size: 0.875rem; line-height: 1.5; color: var(--nav-text); flex: 1; margin-bottom: 0.75rem;">{{ p.description }}</p>
<a v-if="p.url" :href="p.url" target="_blank" rel="noopener" style="color: var(--nav-primary-solid, #3b6ea5); font-weight: 600; font-size: 0.875rem; text-decoration: none;">
Découvrir
</a>
<span v-if="p.link_status === 'broken'" style="color: #e67e22; font-size: 0.8rem; display: block; margin-top: 0.25rem;"> Lien d'origine cassé</span>
</article>
</div>
<p style="margin-top: 2rem; font-size: 0.875rem; color: var(--nav-text-muted);">
Tu as un PFE engagé à partager ? <a href="mailto:contact@trans-former.fr" style="color: var(--nav-primary-solid);">Écris-moi</a>.
</p>
</div>
</template>
<script setup lang="ts">
const { data: pfeData } = await useFetch<{ projets: any[] }>('/data/pfe-engages.json')
const projets = computed(() => pfeData.value?.projets ?? [])
</script>
<style scoped>
.projets-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 1.25rem;
}
.projet-card {
border: 1px solid var(--nav-bg-alt, #eee);
border-radius: 10px;
padding: 1rem;
display: flex;
flex-direction: column;
background: var(--nav-surface);
}
.projet-thumb {
width: 100%;
height: 140px;
object-fit: cover;
border-radius: 6px;
background: var(--nav-bg-alt, #f5f5f5);
display: flex;
align-items: center;
justify-content: center;
font-size: 2rem;
}
</style>

View File

@@ -0,0 +1,604 @@
<template>
<div class="media-visuel">
<!-- Conteneur split / plein ecran -->
<div class="layout-container">
<!-- Slot carte D3 -->
<div
class="carte-slot"
:class="[
layoutMode === 'split' ? 'carte-split' : '',
layoutMode === 'carte-full' ? 'carte-full' : '',
layoutMode === 'chatbot-full' ? 'carte-hidden' : '',
]"
:style="layoutMode === 'split' ? { flexBasis: carteFlexBasis } : {}"
style="position: relative;"
>
<ClientOnly>
<CartePensees
ref="cartePenseesRef"
:data="penseesData"
:active="true"
@select-auteur="onSelectAuteur"
@select-ecole="onSelectEcole"
/>
<template #fallback>
<div class="w-full h-full flex items-center justify-center" style="color: var(--nav-text-muted);">
Chargement de la carte...
</div>
</template>
</ClientOnly>
<!-- Overlay PDF FRACAS -->
<div
v-if="showFracasPdf"
class="fracas-overlay"
:style="{ opacity: fracasOpacity / 100 }"
>
<embed
src="/cartes/carte-fracas-bonpote-v2.pdf"
type="application/pdf"
style="width: 100%; height: 100%;"
/>
</div>
</div>
<!-- Barre de toggle -->
<div class="layout-toggle-bar shrink-0">
<button
@click="setLayoutMode('carte-full')"
:class="{ active: layoutMode === 'carte-full' }"
class="toggle-btn"
title="Carte en plein ecran"
>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<polyline points="15 3 21 3 21 9"/><polyline points="9 21 3 21 3 15"/>
<line x1="21" y1="3" x2="14" y2="10"/><line x1="3" y1="21" x2="10" y2="14"/>
</svg>
Carte plein ecran
</button>
<button
v-if="layoutMode !== 'split'"
@click="setLayoutMode('split')"
class="toggle-btn"
title="Vue partagee"
>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<rect x="3" y="3" width="18" height="18" rx="2"/><line x1="3" y1="12" x2="21" y2="12"/>
</svg>
Vue partagee
</button>
<button
@click="setLayoutMode('chatbot-full')"
:class="{ active: layoutMode === 'chatbot-full' }"
class="toggle-btn"
title="Chatbot en plein ecran"
>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>
</svg>
Chatbot plein ecran
</button>
<button
@click="setLayoutMode('bonpote')"
:class="{ active: layoutMode === 'bonpote' }"
class="toggle-btn"
title="A propos de la carte FRACAS Bonpote V2"
style="margin-left: auto;"
>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<circle cx="12" cy="12" r="10"/><polyline points="12 8 12 12 14 14"/>
</svg>
Bonpote V2
</button>
<!-- Toggle PDF FRACAS -->
<label class="layer-toggle" title="Superposer la carte FRACAS Bonpote V2 en PDF">
<input type="checkbox" v-model="showFracasPdf" />
📄 Carte FRACAS (PDF)
</label>
<input
v-if="showFracasPdf"
type="range"
min="0"
max="100"
v-model.number="fracasOpacity"
class="opacity-slider"
:title="`Opacité ${fracasOpacity}%`"
/>
</div>
<!-- Poignee draggable (visible uniquement en mode split, pas sur mobile) -->
<div
v-if="layoutMode === 'split'"
class="split-handle"
@mousedown.prevent="onHandleMousedown"
title="Redimensionner"
>
<span class="split-handle-grip"></span>
</div>
<!-- Slot chatbot inline -->
<div
class="chatbot-slot"
:class="[
layoutMode === 'split' ? 'chatbot-split' : '',
layoutMode === 'chatbot-full' ? 'chatbot-full-mode' : '',
layoutMode === 'carte-full' ? 'chatbot-hidden' : '',
]"
:style="layoutMode === 'split' ? { flexBasis: chatbotFlexBasis } : {}"
>
<ClientOnly>
<ChatbotPensees :auteurContext="chatbotAuteur" :inline="true" />
</ClientOnly>
</div>
<!-- Vue Bonpote V2 -->
<div
v-if="layoutMode === 'bonpote'"
class="flex-1 overflow-y-auto px-6 py-8"
style="max-width: 680px; margin: 0 auto;"
>
<div class="mb-6">
<p class="text-xs font-bold uppercase tracking-widest mb-2" style="color: var(--nav-text-muted);">Reference editoriale</p>
<h2 class="text-xl font-bold mb-3" style="color: var(--nav-text);">Carte FRACAS des pensees ecologiques</h2>
<p class="text-sm leading-relaxed mb-4" style="color: var(--nav-text);">
FRACAS (Familles, Racines et Arpentages des Courants et Alternatives Solidaires) est une carte des ecoles de pensee ecologique publiee par Bonpote en octobre 2024. Elle reference ~140 auteurs et autrices reparti-es en 10 ecoles de pensee, depuis l'ecosocialisme jusqu'a l'ethique environnementale.
</p>
<p class="text-sm leading-relaxed mb-6" style="color: var(--nav-text);">
Le RAG ATIS est construit sur cette reference : chaque auteur ingere dans la bibliotheque correspond a une entree de la carte FRACAS. Les ecoles de pensee, les positions et les couleurs de notre carte sont transposees 1:1 depuis Bonpote V2.
</p>
<div class="flex flex-col gap-3">
<a href="https://bonpote.com/la-carte-des-pensees-ecologiques/"
target="_blank" rel="noopener"
class="flex items-center gap-3 px-4 py-3 rounded-lg hover:opacity-80 transition-opacity"
style="background: var(--nav-primary, #3b6ea5); color: white; font-size: 0.875rem; font-weight: 600; text-decoration: none;">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg>
Lire l'article Bonpote + carte interactive
</a>
<a href="https://bonpote.com/wp-content/uploads/2024/10/FRACAS_BONPOTE_CARTE_VERSO_V2-OCT2024.pdf"
target="_blank" rel="noopener"
class="flex items-center gap-3 px-4 py-3 rounded-lg hover:opacity-80 transition-opacity"
style="background: var(--nav-bg-alt); color: var(--nav-text); font-size: 0.875rem; font-weight: 500; text-decoration: none;">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>
Telecharger le poster PDF (recto/verso)
</a>
<button
@click="setLayoutMode('split')"
class="flex items-center gap-3 px-4 py-3 rounded-lg hover:opacity-80 transition-opacity text-left"
style="background: var(--nav-bg-alt); color: var(--nav-text); font-size: 0.875rem; font-weight: 500; border: none; cursor: pointer;">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>
Interroger le RAG ATIS sur ces pensees
</button>
</div>
</div>
<div>
<p class="text-xs font-bold uppercase tracking-widest mb-3" style="color: var(--nav-text-muted);">Les 10 ecoles de pensee (FRACAS V2)</p>
<div class="flex flex-col gap-2">
<div v-for="ecole in (penseesData?.ecoles ?? [])" :key="ecole.id"
class="flex items-start gap-3 px-3 py-2 rounded-lg"
style="background: var(--nav-bg-alt);">
<span class="w-3 h-3 rounded-full shrink-0 mt-1" :style="`background:${ecole.color};`"></span>
<div>
<p class="text-sm font-semibold" style="color: var(--nav-text);">{{ ecole.label }}</p>
<p class="text-xs mt-0.5 leading-relaxed" style="color: var(--nav-text-muted);">{{ ecole.description }}</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Fiche auteur modal -->
<FicheAuteur
:open="ficheOpen"
:auteurId="ficheAuteurId"
:data="penseesData"
@close="ficheOpen = false"
@interroger-rag="onInterrogerRag"
/>
<!-- Fiche ecole modal -->
<FicheEcole
:open="ficheEcoleOpen"
:ecoleId="ficheEcoleId"
:data="penseesData"
@close="ficheEcoleOpen = false"
@select-auteur="onSelectAuteurFromEcole"
@interroger-ecole="onInterrogerEcole"
/>
<!-- Modal info RAG -->
<Teleport to="body">
<Transition name="backdrop">
<div v-if="ragInfoOpen" class="fixed inset-0 z-[2000]" style="background:rgba(26,34,56,0.55);" @click="ragInfoOpen = false" aria-hidden="true" />
</Transition>
<Transition name="modal">
<div v-if="ragInfoOpen" class="fixed z-[2001] left-1/2 flex flex-col"
style="top:50%;transform:translate(-50%,-50%);width:min(580px,94vw);max-height:85vh;background:var(--nav-bg);border-radius:14px;box-shadow:0 16px 64px rgba(26,34,56,0.28);overflow:hidden;"
role="dialog" aria-modal="true" aria-label="A propos du RAG FRACAS">
<div class="flex items-center justify-between px-5 py-4 shrink-0"
style="border-bottom:2px solid var(--nav-bg-alt);background:var(--nav-surface);">
<h2 class="font-bold text-base" style="color:var(--nav-text);">FRACAS - Bibliotheque des pensees ecologiques</h2>
<button @click="ragInfoOpen = false" class="ml-3 shrink-0 flex items-center justify-center w-8 h-8 rounded-full hover:opacity-70"
style="background:var(--nav-bg-alt);color:var(--nav-text-muted);" aria-label="Fermer">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round">
<line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/>
</svg>
</button>
</div>
<div class="flex-1 overflow-y-auto px-5 py-4" style="color:var(--nav-text);font-size:0.875rem;line-height:1.6;">
<p class="mb-3">Une bibliotheque parlante politisee - des pensees ecologiques de gauche, organisees pour aider a creer une pensee complexe et nuancee, critiquer le recit dominant et soutenir des alternatives concretes et des projets collectifs.</p>
<p class="mb-4" style="color:var(--nav-text-muted);font-size:0.8rem;">Projet open source, ouvert a toutes et a tous - <a href="https://bonpote.com/la-carte-des-pensees-ecologiques/" target="_blank" rel="noopener" style="text-decoration:underline;">article + carte FRACAS Bonpote V2</a>.</p>
<div class="flex flex-col gap-3">
<div class="p-3 rounded-lg" style="background:var(--nav-bg-alt);">
<p class="font-semibold mb-1" style="font-size:0.8rem;color:var(--nav-text-muted);text-transform:uppercase;letter-spacing:0.05em;">Ce qu'est un RAG</p>
<p>Les textes sont vectorises dans un espace de 662 dimensions - chaque livre devient un nuage de points semantiques. La proximite entre les points capture la proximite entre les idees, pas les mots.</p>
</div>
<div class="p-3 rounded-lg" style="background:var(--nav-bg-alt);">
<p class="font-semibold mb-1" style="font-size:0.8rem;color:var(--nav-text-muted);text-transform:uppercase;letter-spacing:0.05em;">Chunking intelligent</p>
<p>Lors de l'ingestion, nous selectionnons les entites cles (concepts, auteurs, relations entre idees) plutot que de decouper mecaniquement les textes.</p>
</div>
<div class="p-3 rounded-lg" style="background:var(--nav-bg-alt);">
<p class="font-semibold mb-2" style="font-size:0.8rem;color:var(--nav-text-muted);text-transform:uppercase;letter-spacing:0.05em;">Trois couches d'analyse</p>
<div class="flex flex-col gap-1.5">
<div class="flex gap-2"><span class="font-semibold" style="min-width:70px;">Fond</span><span>Les idees, les theses, les arguments - ce qu'on interroge directement.</span></div>
<div class="flex gap-2"><span class="font-semibold" style="min-width:70px;">Forme</span><span>Les modeles narratifs, la rhetorique, la construction argumentative.</span></div>
<div class="flex gap-2"><span class="font-semibold" style="min-width:70px;">Structure</span><span>L'architecture des livres - comment les auteurs construisent leur pensee.</span></div>
</div>
</div>
</div>
</div>
</div>
</Transition>
</Teleport>
</div>
</template>
<script setup lang="ts">
interface EcoleData { id: string; label: string; description: string; color: string; x_hint: number; y_hint: number }
interface LivreRag { slug: string; titre: string; annee: number; couches: string[] }
interface AuteurData { id: string; nom: string; dates: string; ecoles: string[]; ecole_principale: string; livres_rag: LivreRag[]; theses_cles: string[]; bio_courte: string }
interface PenseesData { meta: any; ecoles: EcoleData[]; auteurs: AuteurData[] }
type LayoutMode = 'split' | 'carte-full' | 'chatbot-full' | 'bonpote'
const STORAGE_KEY = 'media-layout-mode'
const SPLIT_RATIO_KEY = 'media-split-ratio'
const DEFAULT_SPLIT_RATIO = 0.66
const ficheOpen = ref(false)
const ficheAuteurId = ref<string | null>(null)
const ficheEcoleOpen = ref(false)
const ficheEcoleId = ref<string | null>(null)
const ragInfoOpen = ref(false)
const chatbotAuteur = ref<string | null>(null)
const layoutMode = ref<LayoutMode>('split')
const cartePenseesRef = ref<{ triggerResize: () => void } | null>(null)
// Toggle PDF FRACAS
const showFracasPdf = ref(false)
const fracasOpacity = ref(60)
// Props injectées depuis le parent (penseesData)
const props = defineProps<{ penseesData: PenseesData | null }>()
// Ratio de la carte vs chatbot en mode split (0.2 a 0.8)
const splitRatio = ref(DEFAULT_SPLIT_RATIO)
const carteFlexBasis = computed(() => `${splitRatio.value * 100}%`)
const chatbotFlexBasis = computed(() => `${(1 - splitRatio.value) * 100}%`)
// Logique poignee draggable
let dragStartY = 0
let dragStartRatio = DEFAULT_SPLIT_RATIO
let containerHeight = 0
function onHandleMousedown(e: MouseEvent) {
dragStartY = e.clientY
dragStartRatio = splitRatio.value
const container = (e.target as HTMLElement)?.closest('.layout-container') as HTMLElement | null
containerHeight = container ? container.clientHeight : window.innerHeight
window.addEventListener('mousemove', onHandleMousemove)
window.addEventListener('mouseup', onHandleMouseup)
}
function onHandleMousemove(e: MouseEvent) {
const delta = e.clientY - dragStartY
const newRatio = dragStartRatio + delta / containerHeight
splitRatio.value = Math.min(0.80, Math.max(0.20, newRatio))
}
function onHandleMouseup() {
window.removeEventListener('mousemove', onHandleMousemove)
window.removeEventListener('mouseup', onHandleMouseup)
if (typeof window !== 'undefined') {
localStorage.setItem(SPLIT_RATIO_KEY, String(splitRatio.value))
}
cartePenseesRef.value?.triggerResize()
}
onMounted(() => {
if (typeof window !== 'undefined') {
const saved = localStorage.getItem(STORAGE_KEY) as LayoutMode | null
if (saved && ['split', 'carte-full', 'chatbot-full', 'bonpote'].includes(saved)) {
layoutMode.value = saved
}
const savedRatio = parseFloat(localStorage.getItem(SPLIT_RATIO_KEY) ?? '')
if (!isNaN(savedRatio) && savedRatio >= 0.20 && savedRatio <= 0.80) {
splitRatio.value = savedRatio
}
if (!localStorage.getItem('rag-fracas-info-seen')) {
ragInfoOpen.value = true
localStorage.setItem('rag-fracas-info-seen', '1')
}
}
})
function setLayoutMode(mode: LayoutMode) {
layoutMode.value = mode
if (typeof window !== 'undefined') {
localStorage.setItem(STORAGE_KEY, mode)
}
if (mode !== 'chatbot-full') {
setTimeout(() => {
cartePenseesRef.value?.triggerResize()
}, 350)
}
}
watch(layoutMode, (v) => {
if (typeof window !== 'undefined') {
localStorage.setItem(STORAGE_KEY, v)
}
})
function onSelectAuteur(id: string) {
ficheAuteurId.value = id
ficheOpen.value = true
chatbotAuteur.value = null
}
function onSelectEcole(id: string) {
ficheEcoleId.value = id
ficheEcoleOpen.value = true
}
function onSelectAuteurFromEcole(auteurId: string) {
ficheEcoleOpen.value = false
onSelectAuteur(auteurId)
}
function onInterrogerEcole(ecoleId: string) {
ficheEcoleOpen.value = false
const ecole = props.penseesData?.ecoles.find(e => e.id === ecoleId)
chatbotAuteur.value = ecole?.label ?? null
if (layoutMode.value === 'carte-full') setLayoutMode('split')
}
function onInterrogerRag(auteurId: string) {
ficheOpen.value = false
const auteur = props.penseesData?.auteurs.find(a => a.id === auteurId)
chatbotAuteur.value = auteur?.nom ?? null
if (layoutMode.value === 'carte-full') {
setLayoutMode('split')
}
}
</script>
<style scoped>
.media-visuel {
flex: 1;
display: flex;
flex-direction: column;
overflow: hidden;
min-height: 0;
}
/* Conteneur des slots carte + toggle + chatbot */
.layout-container {
flex: 1;
display: flex;
flex-direction: column;
overflow: hidden;
min-height: 0;
}
/* --- Slot carte --- */
.carte-slot {
overflow: hidden;
position: relative;
transition: opacity 0.2s ease;
}
.carte-split {
flex: 0 0 66%;
min-height: 0;
opacity: 1;
}
.carte-full {
flex: 1 1 100%;
min-height: 0;
opacity: 1;
}
.carte-hidden {
flex: 0 0 0;
height: 0;
opacity: 0;
overflow: hidden;
}
/* --- Overlay PDF FRACAS --- */
.fracas-overlay {
position: absolute;
inset: 0;
z-index: 50;
pointer-events: none;
}
/* --- Barre de toggle --- */
.layout-toggle-bar {
flex-shrink: 0;
display: flex;
align-items: center;
gap: 6px;
padding: 4px 12px;
background: var(--nav-bg);
border-top: 1px solid rgba(180, 170, 160, 0.22);
border-bottom: 1px solid rgba(180, 170, 160, 0.22);
min-height: 38px;
flex-wrap: wrap;
}
.toggle-btn {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 4px 10px;
border-radius: 6px;
font-size: 0.75rem;
font-weight: 500;
cursor: pointer;
background: var(--nav-bg-alt);
color: var(--nav-text-muted);
border: 1px solid transparent;
transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.toggle-btn:hover {
background: var(--nav-surface);
color: var(--nav-text);
}
.toggle-btn.active {
background: var(--nav-primary);
color: var(--nav-text-on-primary);
border-color: var(--nav-primary);
}
/* --- Toggle layer PDF FRACAS --- */
.layer-toggle {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 4px 10px;
border-radius: 6px;
font-size: 0.75rem;
font-weight: 500;
cursor: pointer;
background: var(--nav-bg-alt);
color: var(--nav-text-muted);
border: 1px solid transparent;
user-select: none;
margin-left: 4px;
}
.layer-toggle input[type="checkbox"] {
margin: 0;
cursor: pointer;
}
.opacity-slider {
width: 80px;
cursor: pointer;
accent-color: var(--nav-primary, #3b6ea5);
}
/* --- Poignee draggable entre carte et chatbot --- */
.split-handle {
flex-shrink: 0;
height: 8px;
display: flex;
align-items: center;
justify-content: center;
cursor: row-resize;
background: transparent;
position: relative;
z-index: 10;
user-select: none;
}
.split-handle:hover {
background: rgba(180, 170, 160, 0.18);
}
.split-handle-grip {
display: block;
width: 32px;
height: 4px;
border-radius: 2px;
background: repeating-linear-gradient(
to bottom,
rgba(160, 150, 140, 0.55) 0px,
rgba(160, 150, 140, 0.55) 1px,
transparent 1px,
transparent 3px
);
}
/* Masquer la poignee sur mobile (ratio fixe) */
@media (max-width: 767px) {
.split-handle {
display: none;
}
}
/* --- Slot chatbot --- */
.chatbot-slot {
overflow: hidden;
position: relative;
transition: opacity 0.2s ease;
border-top: 1px solid rgba(180, 170, 160, 0.28);
}
.chatbot-split {
flex: 0 0 34%;
min-height: 0;
opacity: 1;
}
.chatbot-full-mode {
flex: 1 1 100%;
min-height: 0;
opacity: 1;
}
.chatbot-hidden {
flex: 0 0 0;
height: 0;
opacity: 0;
overflow: hidden;
}
/* --- Transitions modal RAG info --- */
.backdrop-enter-active,.backdrop-leave-active { transition: opacity 0.2s; }
.backdrop-enter-from,.backdrop-leave-to { opacity: 0; }
.modal-enter-active { transition: opacity 0.2s, transform 0.22s cubic-bezier(0.34,1.56,0.64,1); }
.modal-leave-active { transition: opacity 0.18s, transform 0.18s ease-in; }
.modal-enter-from { opacity: 0; transform: translate(-50%,-48%) scale(0.94); }
.modal-leave-to { opacity: 0; transform: translate(-50%,-48%) scale(0.96); }
/* --- Responsive mobile (<768px) --- */
@media (max-width: 767px) {
.carte-split {
flex: 0 0 60vh;
height: 60vh;
}
.chatbot-split {
flex: 0 0 calc(40vh - 38px);
height: calc(40vh - 38px);
}
.toggle-btn span,
.toggle-btn {
font-size: 0.7rem;
padding: 3px 7px;
}
}
</style>

View File

@@ -23,7 +23,6 @@ export default defineNuxtConfig({
codevPassword: 'merci', // NUXT_CODEV_PASSWORD - défaut "merci", overridable codevPassword: 'merci', // NUXT_CODEV_PASSWORD - défaut "merci", overridable
codevBaseId: '', // NUXT_CODEV_BASE_ID - base NocoDB (ex: pipilvsi7dibo80) codevBaseId: '', // NUXT_CODEV_BASE_ID - base NocoDB (ex: pipilvsi7dibo80)
codevAdminPassword: 'admin2026', // NUXT_CODEV_ADMIN_PASSWORD codevAdminPassword: 'admin2026', // NUXT_CODEV_ADMIN_PASSWORD
ragPeUrl: process.env.NUXT_RAG_PE_URL || 'http://localhost:9621',
}, },
// Leaflet ne fonctionne pas en SSR — forcer le rendu côté client // Leaflet ne fonctionne pas en SSR — forcer le rendu côté client

View File

@@ -128,12 +128,6 @@
: 'color: var(--nav-text-muted); border-bottom: 2px solid transparent;'" : 'color: var(--nav-text-muted); border-bottom: 2px solid transparent;'"
@click="desktopMapView = 'graphe'" @click="desktopMapView = 'graphe'"
>Vue graphique</button> >Vue graphique</button>
<NuxtLink
to="/media"
class="px-5 py-2 text-sm font-medium transition-colors"
style="color: var(--nav-text-muted); border-bottom: 2px solid transparent;"
active-class="!color-nav-text"
>Média</NuxtLink>
</div> </div>
<!-- Carte Métropole desktop --> <!-- Carte Métropole desktop -->
@@ -225,11 +219,6 @@
: 'color: var(--nav-text-muted); border-bottom: 2px solid transparent;'" : 'color: var(--nav-text-muted); border-bottom: 2px solid transparent;'"
@click="mobileMapView = 'graphe'" @click="mobileMapView = 'graphe'"
>Graphe</button> >Graphe</button>
<NuxtLink
to="/media"
class="flex-1 py-2 text-sm font-medium transition-colors text-center"
style="color: var(--nav-text-muted); border-bottom: 2px solid transparent;"
>Média</NuxtLink>
</div> </div>
<div class="lg:hidden flex-1 relative overflow-hidden"> <div class="lg:hidden flex-1 relative overflow-hidden">
@@ -414,11 +403,6 @@
@update:modelValue="chatbotOpen = $event" @update:modelValue="chatbotOpen = $event"
/> />
<!-- CHATBOT PENSEES (desktop, tous onglets) -->
<ClientOnly>
<ChatbotPensees />
</ClientOnly>
<!-- POP-UP MISSION RÉSEAUX AEP --> <!-- POP-UP MISSION RÉSEAUX AEP -->
<button <button
class="reseaux-info-btn" class="reseaux-info-btn"

View File

@@ -201,19 +201,10 @@
</div> </div>
</div> </div>
<!-- Filtres FONCTION chips flex-wrap + toggle collapse --> <!-- Filtres FONCTION chips flex-wrap -->
<div class="mt-2"> <div class="mt-2">
<div style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px;"> <span class="text-xs font-bold uppercase tracking-wide block mb-1" style="color: var(--nav-text-muted);">FONCTION</span>
<span class="text-xs font-bold uppercase tracking-wide" style="color: var(--nav-text-muted);"> <div class="flex flex-wrap gap-1">
FONCTION
<span v-if="fonctions.length" style="font-weight: 400; text-transform: none; letter-spacing: 0; font-size: 0.65rem; margin-left: 4px;">({{ fonctions.length }} active{{ fonctions.length > 1 ? 's' : '' }})</span>
</span>
<button
@click="mobileFonctionsOpen = !mobileFonctionsOpen"
style="font-size: 0.65rem; color: var(--nav-text-muted); background: none; border: none; cursor: pointer; text-decoration: underline; padding: 0; white-space: nowrap;"
>{{ mobileFonctionsOpen || fonctions.length ? (mobileFonctionsOpen ? 'Replier' : 'Afficher') : 'Fonctions (' + FONCTIONS.length + ')' }}</button>
</div>
<div v-if="mobileFonctionsOpen || fonctions.length" class="flex flex-wrap gap-1">
<span <span
v-for="fn in FONCTIONS" v-for="fn in FONCTIONS"
:key="fn" :key="fn"
@@ -374,7 +365,6 @@ const ficheModalOpen = ref(false)
const ficheModalId = ref<number | null>(null) const ficheModalId = ref<number | null>(null)
const mobileMapView = ref<'metropole' | 'outremer'>('metropole') const mobileMapView = ref<'metropole' | 'outremer'>('metropole')
const missionOpen = ref(false) const missionOpen = ref(false)
const mobileFonctionsOpen = ref(false)
onMounted(() => { onMounted(() => {
try { try {

View File

@@ -1,414 +1,63 @@
<template> <template>
<div class="media-page" style="background: var(--nav-bg);"> <div class="media-page" style="background: var(--nav-bg);">
<nav class="subtabs" style="display:flex; gap:0; border-bottom: 1px solid var(--nav-bg-alt); background: var(--nav-surface); padding: 0 1rem;">
<!-- ZONE PRINCIPALE (pleine largeur, pas de sidebar) -->
<main class="media-main">
<!-- Header onglet -->
<div class="shrink-0 px-5 py-3"
style="background: var(--nav-surface); border-bottom: 1px solid var(--nav-bg-alt);">
<h1 class="font-bold text-base" style="color: var(--nav-text);">ATIS Media</h1>
<p class="text-xs mt-0.5" style="color: var(--nav-text-muted);">
{{ corpusCount }} auteurs ingeres dans le RAG - carte FRACAS Bonpote V2
</p>
</div>
<!-- Conteneur split / plein ecran -->
<div class="layout-container">
<!-- Slot carte D3 -->
<div
class="carte-slot"
:class="[
layoutMode === 'split' ? 'carte-split' : '',
layoutMode === 'carte-full' ? 'carte-full' : '',
layoutMode === 'chatbot-full' ? 'carte-hidden' : '',
]"
:style="layoutMode === 'split' ? { flexBasis: carteFlexBasis } : {}"
>
<ClientOnly>
<CartePensees
ref="cartePenseesRef"
:data="penseesData"
:active="true"
@select-auteur="onSelectAuteur"
/>
<template #fallback>
<div class="w-full h-full flex items-center justify-center" style="color: var(--nav-text-muted);">
Chargement de la carte...
</div>
</template>
</ClientOnly>
</div>
<!-- Barre de toggle -->
<div class="layout-toggle-bar shrink-0">
<button <button
@click="setLayoutMode('carte-full')" :class="['subtab-btn', { active: tab === 'visuel' }]"
:class="{ active: layoutMode === 'carte-full' }" @click="tab = 'visuel'"
class="toggle-btn"
title="Carte en plein ecran"
> >
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"> 🌳 RAG visuel
<polyline points="15 3 21 3 21 9"/><polyline points="9 21 3 21 3 15"/>
<line x1="21" y1="3" x2="14" y2="10"/><line x1="3" y1="21" x2="10" y2="14"/>
</svg>
Carte plein ecran
</button> </button>
<button <button
v-if="layoutMode !== 'split'" :class="['subtab-btn', { active: tab === 'backend' }]"
@click="setLayoutMode('split')" @click="tab = 'backend'"
class="toggle-btn"
title="Vue partagee"
> >
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"> LightRAG backend
<rect x="3" y="3" width="18" height="18" rx="2"/><line x1="3" y1="12" x2="21" y2="12"/>
</svg>
Vue partagee
</button> </button>
<button <button
@click="setLayoutMode('chatbot-full')" :class="['subtab-btn', { active: tab === 'projets' }]"
:class="{ active: layoutMode === 'chatbot-full' }" @click="tab = 'projets'"
class="toggle-btn"
title="Chatbot en plein ecran"
> >
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"> 📚 Projets
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>
</svg>
Chatbot plein ecran
</button> </button>
</div> </nav>
<!-- Poignee draggable (visible uniquement en mode split, pas sur mobile) -->
<div
v-if="layoutMode === 'split'"
class="split-handle"
@mousedown.prevent="onHandleMousedown"
title="Redimensionner"
>
<span class="split-handle-grip"></span>
</div>
<!-- Slot chatbot inline -->
<div
class="chatbot-slot"
:class="[
layoutMode === 'split' ? 'chatbot-split' : '',
layoutMode === 'chatbot-full' ? 'chatbot-full-mode' : '',
layoutMode === 'carte-full' ? 'chatbot-hidden' : '',
]"
:style="layoutMode === 'split' ? { flexBasis: chatbotFlexBasis } : {}"
>
<ClientOnly>
<ChatbotPensees :auteurContext="chatbotAuteur" :inline="true" />
</ClientOnly>
</div>
</div>
</main>
<!-- Fiche auteur modal -->
<FicheAuteur
:open="ficheOpen"
:auteurId="ficheAuteurId"
:data="penseesData"
@close="ficheOpen = false"
@interroger-rag="onInterrogerRag"
/>
<MediaTabVisuel v-if="tab === 'visuel'" />
<MediaTabBackend v-else-if="tab === 'backend'" />
<MediaTabProjets v-else-if="tab === 'projets'" />
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
interface EcoleData { id: string; label: string; description: string; color: string; x_hint: number; y_hint: number } const route = useRoute()
interface LivreRag { slug: string; titre: string; annee: number; couches: string[] } const router = useRouter()
interface AuteurData { id: string; nom: string; dates: string; ecoles: string[]; ecole_principale: string; livres_rag: LivreRag[]; theses_cles: string[]; bio_courte: string }
interface PenseesData { meta: any; ecoles: EcoleData[]; auteurs: AuteurData[] }
type LayoutMode = 'split' | 'carte-full' | 'chatbot-full' const tab = ref<'visuel' | 'backend' | 'projets'>(
(['visuel', 'backend', 'projets'].includes(route.query.tab as string)
? route.query.tab as 'visuel' | 'backend' | 'projets'
: 'visuel')
)
const STORAGE_KEY = 'media-layout-mode' watch(tab, (newTab) => {
const SPLIT_RATIO_KEY = 'media-split-ratio' router.replace({ query: { ...route.query, tab: newTab } })
const DEFAULT_SPLIT_RATIO = 0.66
const ficheOpen = ref(false)
const ficheAuteurId = ref<string | null>(null)
const chatbotAuteur = ref<string | null>(null)
const penseesData = ref<PenseesData | null>(null)
const layoutMode = ref<LayoutMode>('split')
const cartePenseesRef = ref<{ triggerResize: () => void } | null>(null)
// Ratio de la carte vs chatbot en mode split (0.2 a 0.8)
const splitRatio = ref(DEFAULT_SPLIT_RATIO)
const carteFlexBasis = computed(() => `${splitRatio.value * 100}%`)
const chatbotFlexBasis = computed(() => `${(1 - splitRatio.value) * 100}%`)
// Phase 8.D : compteur = auteurs ingere:true uniquement (32 reels, pas 171 total)
const corpusCount = computed(() => penseesData.value?.auteurs.filter(a => a.ingere).length ?? 0)
// Logique poignee draggable
let dragStartY = 0
let dragStartRatio = DEFAULT_SPLIT_RATIO
let containerHeight = 0
function onHandleMousedown(e: MouseEvent) {
dragStartY = e.clientY
dragStartRatio = splitRatio.value
// Hauteur du layout-container (carte + handle + chatbot)
const container = (e.target as HTMLElement)?.closest('.layout-container') as HTMLElement | null
containerHeight = container ? container.clientHeight : window.innerHeight
window.addEventListener('mousemove', onHandleMousemove)
window.addEventListener('mouseup', onHandleMouseup)
}
function onHandleMousemove(e: MouseEvent) {
const delta = e.clientY - dragStartY
const newRatio = dragStartRatio + delta / containerHeight
splitRatio.value = Math.min(0.80, Math.max(0.20, newRatio))
}
function onHandleMouseup() {
window.removeEventListener('mousemove', onHandleMousemove)
window.removeEventListener('mouseup', onHandleMouseup)
if (typeof window !== 'undefined') {
localStorage.setItem(SPLIT_RATIO_KEY, String(splitRatio.value))
}
// Notifier D3 du resize apres relachement
cartePenseesRef.value?.triggerResize()
}
onMounted(async () => {
// Restaurer le mode de layout depuis localStorage
if (typeof window !== 'undefined') {
const saved = localStorage.getItem(STORAGE_KEY) as LayoutMode | null
if (saved && ['split', 'carte-full', 'chatbot-full'].includes(saved)) {
layoutMode.value = saved
}
const savedRatio = parseFloat(localStorage.getItem(SPLIT_RATIO_KEY) ?? '')
if (!isNaN(savedRatio) && savedRatio >= 0.20 && savedRatio <= 0.80) {
splitRatio.value = savedRatio
}
}
try {
penseesData.value = await $fetch<PenseesData>('/data/auteurs-pensees.json')
} catch (e) {
console.error('Erreur chargement auteurs-pensees.json', e)
}
}) })
// Persister + reset D3 apres transition useHead({ title: 'AEP - Media' })
function setLayoutMode(mode: LayoutMode) {
layoutMode.value = mode
if (typeof window !== 'undefined') {
localStorage.setItem(STORAGE_KEY, mode)
}
// Restart simulation D3 apres la fin de la transition CSS (300ms)
if (mode !== 'chatbot-full') {
setTimeout(() => {
cartePenseesRef.value?.triggerResize()
}, 350)
}
}
watch(layoutMode, (v) => {
if (typeof window !== 'undefined') {
localStorage.setItem(STORAGE_KEY, v)
}
})
function onSelectAuteur(id: string) {
ficheAuteurId.value = id
ficheOpen.value = true
chatbotAuteur.value = null
}
function onInterrogerRag(auteurId: string) {
ficheOpen.value = false
const auteur = penseesData.value?.auteurs.find(a => a.id === auteurId)
chatbotAuteur.value = auteur?.nom ?? null
// Basculer en split pour que le chatbot soit visible
if (layoutMode.value === 'carte-full') {
setLayoutMode('split')
}
}
useHead({ title: 'AEP - Media - Carte FRACAS Bonpote' })
</script> </script>
<style scoped> <style scoped>
/* Page container : flex column, prend toute la hauteur viewport */ .media-page { display: flex; flex-direction: column; height: 100%; overflow: hidden; }
.media-page { .subtabs { display: flex; gap: 0; flex-shrink: 0; }
display: flex; .subtab-btn {
height: 100%; padding: 10px 18px;
overflow: hidden; font-size: 0.85rem;
}
.media-main {
flex: 1;
display: flex;
flex-direction: column;
overflow: hidden;
position: relative;
}
/* Conteneur des slots carte + toggle + chatbot */
.layout-container {
flex: 1;
display: flex;
flex-direction: column;
overflow: hidden;
min-height: 0;
}
/* --- Slot carte --- */
.carte-slot {
overflow: hidden;
position: relative;
transition: opacity 0.2s ease;
}
.carte-split {
flex: 0 0 66%;
min-height: 0;
opacity: 1;
}
.carte-full {
flex: 1 1 100%;
min-height: 0;
opacity: 1;
}
.carte-hidden {
flex: 0 0 0;
height: 0;
opacity: 0;
overflow: hidden;
}
/* --- Barre de toggle --- */
.layout-toggle-bar {
flex-shrink: 0;
display: flex;
align-items: center;
gap: 6px;
padding: 4px 12px;
background: var(--nav-bg);
border-top: 1px solid rgba(180, 170, 160, 0.22);
border-bottom: 1px solid rgba(180, 170, 160, 0.22);
min-height: 38px;
}
.toggle-btn {
display: inline-flex;
align-items: center;
gap: 5px;
padding: 4px 10px;
border-radius: 6px;
font-size: 0.75rem;
font-weight: 500; font-weight: 500;
background: none;
border: none;
border-bottom: 2px solid transparent;
cursor: pointer; cursor: pointer;
background: var(--nav-bg-alt);
color: var(--nav-text-muted); color: var(--nav-text-muted);
border: 1px solid transparent; transition: color 0.15s, border-color 0.15s;
transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.toggle-btn:hover {
background: var(--nav-surface);
color: var(--nav-text);
}
.toggle-btn.active {
background: var(--nav-primary);
color: var(--nav-text-on-primary);
border-color: var(--nav-primary);
}
/* --- Poignee draggable entre carte et chatbot --- */
.split-handle {
flex-shrink: 0;
height: 8px;
display: flex;
align-items: center;
justify-content: center;
cursor: row-resize;
background: transparent;
position: relative;
z-index: 10;
user-select: none;
}
.split-handle:hover {
background: rgba(180, 170, 160, 0.18);
}
.split-handle-grip {
display: block;
width: 32px;
height: 4px;
border-radius: 2px;
background: repeating-linear-gradient(
to bottom,
rgba(160, 150, 140, 0.55) 0px,
rgba(160, 150, 140, 0.55) 1px,
transparent 1px,
transparent 3px
);
}
/* Masquer la poignee sur mobile (ratio fixe) */
@media (max-width: 767px) {
.split-handle {
display: none;
}
}
/* --- Slot chatbot --- */
.chatbot-slot {
overflow: hidden;
position: relative;
transition: opacity 0.2s ease;
border-top: 1px solid rgba(180, 170, 160, 0.28);
}
.chatbot-split {
flex: 0 0 34%;
min-height: 0;
opacity: 1;
}
.chatbot-full-mode {
flex: 1 1 100%;
min-height: 0;
opacity: 1;
}
.chatbot-hidden {
flex: 0 0 0;
height: 0;
opacity: 0;
overflow: hidden;
}
/* --- Responsive mobile (<768px) --- */
/* Stack vertical : carte 60vh + chatbot 40vh en mode split */
@media (max-width: 767px) {
.carte-split {
flex: 0 0 60vh;
height: 60vh;
}
.chatbot-split {
flex: 0 0 calc(40vh - 38px);
height: calc(40vh - 38px);
}
.toggle-btn span,
.toggle-btn {
font-size: 0.7rem;
padding: 3px 7px;
}
} }
.subtab-btn:hover { color: var(--nav-text); }
.subtab-btn.active { color: var(--nav-primary-solid); border-bottom-color: var(--nav-primary-solid); font-weight: 600; }
</style> </style>

38
pages/rag.vue Normal file
View File

@@ -0,0 +1,38 @@
<template>
<div class="flex flex-col items-center justify-center h-full gap-6" style="background: var(--nav-bg);">
<div class="text-center max-w-md px-6">
<div
class="inline-flex items-center justify-center w-14 h-14 rounded-2xl mb-5"
style="background: var(--nav-bg-alt);"
>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" style="color: var(--nav-text-muted);">
<path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"/>
<polyline points="3.27 6.96 12 12.01 20.73 6.96"/>
<line x1="12" y1="22.08" x2="12" y2="12"/>
</svg>
</div>
<h1 class="text-2xl font-bold mb-3" style="color: var(--nav-text);">RAG Retrieval Augmented Generation</h1>
<p class="text-sm leading-relaxed mb-6" style="color: var(--nav-text-muted);">
Une base de connaissances interrogeable par IA textes, rapports, manifestes et ressources documentaires sur l'architecture d'écologie politique.
</p>
<p class="text-xs font-semibold uppercase tracking-widest mb-6" style="color: var(--nav-text-muted); opacity: 0.6;">
Bientôt disponible
</p>
<NuxtLink
to="/"
class="inline-flex items-center gap-2 px-4 py-2 rounded-xl text-sm font-semibold transition-all hover:opacity-80"
style="background: var(--nav-primary); color: var(--nav-text-on-primary);"
>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" aria-hidden="true">
<line x1="19" y1="12" x2="5" y2="12"/>
<polyline points="12 19 5 12 12 5"/>
</svg>
Retour à l'écosystème
</NuxtLink>
</div>
</div>
</template>
<script setup lang="ts">
useHead({ title: 'RAG AEP (bientôt disponible)' })
</script>

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,99 @@
{
"tree": {
"name": "FMHY — Sélection AEP",
"children": [
{
"name": "IA & LLM",
"children": [
{ "name": "DeepSeek", "url": "https://chat.deepseek.com/", "desc": "DeepSeek V3.2 — modèle libre puissant, sans limite, compte requis" },
{ "name": "Mistral Chat", "url": "https://chat.mistral.ai/", "desc": "Mistral Large 3, natif français, sans limite" },
{ "name": "Google AI Studio", "url": "https://aistudio.google.com/app/prompts/new_chat", "desc": "Gemini 3.1 Pro + API gratuite, idéal pour expérimenter" },
{ "name": "Kimi", "url": "https://www.kimi.com/", "desc": "Kimi K2.6 Thinking — raisonnement avancé, login requis" },
{ "name": "NVIDIA NIM", "url": "https://build.nvidia.com/models", "desc": "Multi-modèles libres (Kimi, Qwen, GLM) sans compte" },
{ "name": "NotebookLM", "url": "https://notebooklm.google.com/", "desc": "Chatbot sur tes propres documents, prise de notes augmentée" },
{ "name": "Ollama", "url": "https://ollama.com/", "desc": "Héberger des modèles IA localement, toutes plateformes" },
{ "name": "Open WebUI", "url": "https://openwebui.com/", "desc": "Interface web pour LLMs locaux (Ollama), self-hostable" },
{ "name": "LM Studio", "url": "https://lmstudio.ai/", "desc": "Appli desktop pour modèles IA locaux, sans cloud" },
{ "name": "Perplexity", "url": "https://www.perplexity.ai/", "desc": "Moteur de recherche IA avec sources citées" }
]
},
{
"name": "Recherche & articles",
"children": [
{ "name": "SciSpace", "url": "https://scispace.com/", "desc": "Chatbot sur publications scientifiques, explications simplifiées" },
{ "name": "Alphaxiv", "url": "https://www.alphaxiv.org/", "desc": "Chatbot sur les papiers de recherche arxiv" },
{ "name": "Unpaywall", "url": "https://unpaywall.org/", "desc": "Accès libre aux articles académiques — extension navigateur" },
{ "name": "Bypass Paywalls Clean", "url": "https://gitflic.ru/project/magnolia1234/bpc_uploads", "desc": "Extension pour bypasser les paywalls d'articles de presse" },
{ "name": "Freedium", "url": "https://freedium-mirror.cfd/", "desc": "Accéder aux articles Medium sans abonnement" }
]
},
{
"name": "Livres & archives",
"children": [
{ "name": "Anna's Archive", "url": "https://annas-archive.gl/", "desc": "Meta-search des bibliothèques libres (Z-Lib, LibGen, Sci-Hub)" },
{ "name": "Z-Library", "url": "https://z-lib.gd/", "desc": "Bibliothèque de livres/articles, téléchargement direct" },
{ "name": "Library Genesis", "url": "https://libgen.li/", "desc": "Livres techniques, universitaires, comics en accès libre" },
{ "name": "Internet Archive", "url": "https://archive.org/details/texts", "desc": "Livres, magazines, archives historiques numérisés" },
{ "name": "Project Gutenberg", "url": "https://www.gutenberg.org/", "desc": "Classiques du domaine public, 70k+ livres" },
{ "name": "Open Library", "url": "https://openlibrary.org/", "desc": "Bibliothèque libre, emprunt numérique de livres" }
]
},
{
"name": "Cours & formation",
"children": [
{ "name": "MIT OpenCourseWare", "url": "https://ocw.mit.edu/", "desc": "Cours MIT en accès libre — toutes disciplines, niveau universitaire" },
{ "name": "Khan Academy", "url": "https://www.khanacademy.org/", "desc": "Cours gratuits et interactifs, toutes matières, du lycée au supérieur" },
{ "name": "edX", "url": "https://www.edx.org/", "desc": "MOOCs certifiants des meilleures universités mondiales" },
{ "name": "Learn Anything", "url": "https://learn-anything.xyz/", "desc": "Moteur de recherche de parcours d'apprentissage structurés" },
{ "name": "OpenCulture", "url": "https://www.openculture.com/", "desc": "Cours, films, livres audio en accès libre, liens curatés" },
{ "name": "Appropedia", "url": "https://www.appropedia.org/", "desc": "Wiki de la durabilité, technologies appropriées, habitat écologique" }
]
},
{
"name": "Outils dev & infra",
"children": [
{ "name": "Free for Developers", "url": "https://free-for.dev/", "desc": "Index exhaustif des outils gratuits pour développeurs" },
{ "name": "DevDocs", "url": "https://devdocs.io/", "desc": "Documentation développeur unifiée, consultable hors ligne" },
{ "name": "N8N", "url": "https://n8n.io/", "desc": "Automatisation de workflows open source, self-hostable" },
{ "name": "NocoDB", "url": "https://github.com/nocodb/nocodb", "desc": "Base de données no-code open source, alternative Airtable" },
{ "name": "Crontab Guru", "url": "https://crontab.guru/", "desc": "Éditeur de tâches cron avec explication lisible" },
{ "name": "Dokploy", "url": "https://github.com/dokploy/dokploy", "desc": "Déploiement d'apps auto-hébergé, alternative Coolify/Heroku" },
{ "name": "Open Source Guides", "url": "https://opensource.guide/", "desc": "Guides pour contribuer et gérer des projets open source" }
]
},
{
"name": "Texte & documents",
"children": [
{ "name": "DeepL", "url": "https://www.deepl.com/translator", "desc": "Traduction IA, meilleure qualité disponible en FR/EN/DE" },
{ "name": "Paperless-ngx", "url": "https://docs.paperless-ngx.com/", "desc": "Gestion documentaire self-hosted avec OCR et indexation" },
{ "name": "Whisper (OpenAI)", "url": "https://github.com/openai/whisper", "desc": "Transcription audio open source, multi-langues, qualité professionnelle" },
{ "name": "GitHub Gists", "url": "https://gist.github.com/", "desc": "Partage de snippets code / notes, versionné, dans l'écosystème git" },
{ "name": "PrivateBin", "url": "https://privatebin.net/", "desc": "Pastebin chiffré zero-knowledge, self-hostable" },
{ "name": "LibreTranslate", "url": "https://libretranslate.com/", "desc": "Traducteur FOSS, self-hostable, sans tracking" }
]
},
{
"name": "Vie privée & sécurité",
"children": [
{ "name": "uBlock Origin", "url": "https://github.com/gorhill/uBlock", "desc": "Bloqueur de publicités et trackers — le plus efficace du marché" },
{ "name": "Bitwarden", "url": "https://bitwarden.com/", "desc": "Gestionnaire de mots de passe open source, cloud ou self-hosted" },
{ "name": "KeePassXC", "url": "https://keepassxc.org/", "desc": "Gestionnaire de mots de passe local, base chiffrée, sans cloud" },
{ "name": "Pi-Hole", "url": "https://pi-hole.net/", "desc": "Bloqueur de pub DNS pour tout le réseau domestique, self-hosted" },
{ "name": "SponsorBlock", "url": "https://sponsor.ajay.app/", "desc": "Extension pour skipper les segments sponsorisés sur YouTube" },
{ "name": "AdGuard Home", "url": "https://adguard.com/en/adguard-home/overview.html", "desc": "Alternative Pi-Hole, DNS adblocking self-hosted pour tout le réseau" }
]
},
{
"name": "Documentaires & médias",
"children": [
{ "name": "Films For Action", "url": "https://www.filmsforaction.org/", "desc": "Films documentaires engagés, alternatives sociales et écologiques" },
{ "name": "ARTE (replay)", "url": "https://www.arte.tv/", "desc": "Documentaires et programmes culturels FR/DE, replay gratuit" },
{ "name": "Documentary+", "url": "https://www.docplus.com/", "desc": "Plateforme de documentaires en streaming gratuit" },
{ "name": "TED Talks", "url": "https://www.ted.com/", "desc": "Conférences inspirantes sur science, société, design, architecture" }
]
}
]
},
"source": "fmhy.net (sélection AEP 2026-05-22)",
"total_entries": 50
}

View File

@@ -0,0 +1,70 @@
{
"projets": [
{
"id": "quartier-2030",
"titre": "Votre quartier en 2030",
"auteurs": ["Inconnu"],
"annee": "2020",
"ecole": "Inconnu",
"url": "https://quartier-2030.firebaseapp.com/",
"description": "Exploration prospective confrontant smart city, no future, résilience et deep ecology à l'échelle du quartier. Le travail donne à voir plusieurs futurs urbains contrastés, de l'utopie technologique au retrait radical, en laissant le visiteur naviguer entre les scénarios. Un travail d'orfèvre pour sortir de la pensée linéaire sur la ville.",
"thumb": null,
"link_status": "ok"
},
{
"id": "seine-nature",
"titre": "Seine — nature urbaine",
"auteurs": ["Inconnu"],
"annee": "2019",
"ecole": "Inconnu",
"url": "http://www.seine.natureurbaine.com/00_index/page_theme/theme.html",
"description": "Projet de transformation territoriale collective autour de la Seine, pensé comme une démarche systémique et pluridisciplinaire. L'intervention se concentre sur les marges périurbaines, traitées par une logique d'acupuncture : des micro-interventions précises pour enclencher des dynamiques plus larges. L'approche refuse le grand projet unique au profit d'un réseau de petites transformations.",
"thumb": null,
"link_status": "ok"
},
{
"id": "tmip",
"titre": "TMIP — Transformation de la Maison Individuelle Périurbaine",
"auteurs": ["Jules Nény"],
"annee": "2019",
"ecole": "ENSA Paris-Belleville",
"url": "https://issuu.com/transformationresilientes/docs/tmip_archijeunes_cstb_",
"description": "Étude de la maison périurbaine sous l'angle des Gilets jaunes : comment ce lieu de vie concentre les tensions entre émancipation individuelle et dépendance structurelle (voiture, énergie, services). Le projet propose un réseau de micro-infrastructures partagées pour transformer ces maisons isolées en systèmes résilients interconnectés. Publié avec ARCHI'JEUNES et le CSTB.",
"thumb": null,
"link_status": "ok"
},
{
"id": "filiere-bois",
"titre": "Enquête sur les paysages forestiers franciliens",
"auteurs": ["Quid Architecture"],
"annee": "2021",
"ecole": "Inconnu",
"url": "https://www.faireparis.com/fr/projets/faire-2021/enquete-sur-les-paysages-forestiers-franciliens-2159.html",
"description": "Projet lauréat FAIRE 2021. Enquête sur les dysfonctionnements de la filière bois en Île-de-France, aux interfaces entre sylviculteurs, scieries, artisans et maîtres d'ouvrage. Le travail cartographie les ruptures de filière et propose des interventions concrètes pour réparer les liens entre forêt et construction. Une démarche systémique rare dans les études architecturales.",
"thumb": null,
"link_status": "ok"
},
{
"id": "jeu-champagne",
"titre": "Jeu de rôle Champagne PFE — Plateau",
"auteurs": ["Inconnu"],
"annee": "2020",
"ecole": "Inconnu",
"url": "https://campfe2020.wixsite.com/champagnepfe/plateau",
"description": "Dispositif ludique et coopératif développé comme outil de médiation entre acteurs d'un territoire. Le jeu de rôle permet de traverser des problèmes complexes en engageant simultanément des parties prenantes aux intérêts divergents. Une exploration de l'architecture comme processus collectif plutôt que comme objet produit.",
"thumb": null,
"link_status": "ok"
},
{
"id": "transition-agricole",
"titre": "Transition agricole — réinvestissement de fermes traditionnelles",
"auteurs": ["Inconnu"],
"annee": "2020",
"ecole": "Inconnu",
"url": "https://www.calameo.com/books/007306483e0b23edb1db7",
"description": "Projet sur la transformation de fermes traditionnelles dans une logique agricole moderne et diversifiée. L'étude explore comment l'architecture peut accompagner les transitions d'usage des bâtiments ruraux, en articulant patrimonial et fonctionnel. Voir aussi le projet complémentaire sur la Seine aval : https://www.calameo.com/books/007063623f4d4b800b01d",
"thumb": null,
"link_status": "ok"
}
]
}

View File

@@ -1,376 +0,0 @@
// Build auteurs-pensees.json v3.0 — Phase 8.A
// Sync corpus JSON unifié : Bonpote authors + LightRAG ingestion flags
import fs from 'node:fs';
import path from 'node:path';
const JSON_PATH = 'C:\\Users\\jules\\Dropbox\\ATIS - IPCJRA\\1 PROJETS\\TECH - infra VPS, website pro, RAG\\nav-carte\\public\\data\\auteurs-pensees.json';
// === LightRAG slug prefixes (from /documents endpoint 2026-05-12) ===
const LIGHTRAG_PREFIX_TO_AUTHOR_SLUG = {
bookchin: 'murray-bookchin',
brand: 'steward-brand',
carson: 'rachel-carson',
charbonneau: 'bernard-charbonneau',
descola: 'philippe-descola',
despret: 'vinciane-despret',
eaubonne: 'francoise-deaubonne',
ellul: 'jacques-ellul',
federici: 'silvia-federici',
ferdinand: 'malcolm-ferdinand',
figueres: 'christiana-figueres',
georgescu: 'nicholas-georgescu-roegen',
gorz: 'andre-gorz',
graeber: 'david-graeber',
keith: 'david-keith',
klein: 'naomi-klein',
kropotkine: 'pierre-kropotkine',
latouche: 'serge-latouche',
latour: 'bruno-latour',
lowy: 'michael-lowy',
malm: 'andreas-malm',
marx: 'karl-marx',
meadows: 'donella-meadows',
morizot: 'baptiste-morizot',
naess: 'arne-naess',
ouassak: 'fatima-ouassak',
reclus: 'elisee-reclus',
saito: 'kohei-saito',
servigne: 'pablo-servigne',
shiva: 'vandana-shiva',
stengers: 'isabelle-stengers',
vettese: 'troy-vettese',
};
const INGESTED_AUTHOR_SLUGS = new Set(Object.values(LIGHTRAG_PREFIX_TO_AUTHOR_SLUG));
// === Bonpote authors (nom, dates, ecole_principale, ecoles_secondaires[]) ===
const BONPOTE_AUTHORS = [
// Éco-anarchisme
['Pierre Kropotkine', '1842-1921', 'eco-anarchisme', []],
['Élisée Reclus', '1830-1905', 'eco-anarchisme', []],
['Murray Bookchin', '1921-2006', 'eco-anarchisme', []],
['David Graeber', '1961-2020', 'eco-anarchisme', []],
['James C. Scott', '1936-2024', 'eco-anarchisme', []],
['Marshall Sahlins', '1930-2021', 'eco-anarchisme', []],
['Pierre Clastres', '1934-1977', 'eco-anarchisme', []],
['Cornélius Castoriadis', '1922-1997', 'eco-anarchisme', []],
['David Harvey', '1935-', 'eco-anarchisme', ['ecosocialisme']],
['Henri Lefebvre', '1901-1991', 'eco-anarchisme', ['ecosocialisme']],
['Émile Gravelle', '1855-1920', 'eco-anarchisme', []],
['Henri Zisly', '1872-1945', 'eco-anarchisme', []],
['Edward Carpenter', '1844-1929', 'eco-anarchisme', []],
['William Morris', '1834-1896', 'eco-anarchisme', []],
['John Ruskin', '1819-1900', 'eco-anarchisme', []],
['Kirkpatrick Sale', '1937-', 'eco-anarchisme', []],
['Wendell Berry', '1934-', 'eco-anarchisme', []],
['Kristin Ross', '1953-', 'eco-anarchisme', []],
['Theodore Kaczynski', '1942-2023', 'eco-anarchisme', ['technocritique']],
['Saint-Simon', '1760-1825', 'eco-anarchisme', []],
['Auguste Comte', '1798-1857', 'eco-anarchisme', []],
['Alberto Magnaghi', '1941-2023', 'eco-anarchisme', []],
['Peter Berg', '1937-2011', 'eco-anarchisme', []],
['Andreas Malm', '1977-', 'ecosocialisme', ['eco-anarchisme']],
// Écosocialisme
['Karl Marx', '1818-1883', 'ecosocialisme', []],
['Friedrich Engels', '1820-1895', 'ecosocialisme', []],
['Rosa Luxemburg', '1871-1919', 'ecosocialisme', []],
['Walter Benjamin', '1892-1940', 'ecosocialisme', []],
['John Maynard Keynes', '1883-1946', 'ecosocialisme', []],
['Pascal Lamy', '1947-', 'ecosocialisme', []],
['Ann Pettifor', '1947-', 'ecosocialisme', []],
['Holly Jean Buck', '', 'ecosocialisme', []],
['Cédric Durand', '1975-', 'ecosocialisme', []],
['Kim Stanley Robinson', '1952-', 'ecosocialisme', []],
['André Gorz', '1923-2007', 'ecosocialisme', ['decroissance', 'technocritique']],
['Kohei Saito', '1987-', 'ecosocialisme', ['decroissance']],
['Razmig Keucheyan', '1975-', 'ecosocialisme', []],
['Dominique Méda', '1962-', 'ecosocialisme', []],
['Dominique Bourg', '1953-', 'ecosocialisme', []],
['Troy Vettese', '', 'ecosocialisme', []],
['Loïc Blondiaux', '1962-', 'ecosocialisme', []],
['Drew Pendergrass', '', 'ecosocialisme', []],
['Jason W. Moore', '', 'ecosocialisme', []],
["James O'Connor", '1930-2017', 'ecosocialisme', []],
['Herman Daly', '1938-2022', 'ecosocialisme', ['capitalisme-vert']],
['John Bellamy Foster', '1953-', 'ecosocialisme', []],
['Michael Löwy', '1938-', 'ecosocialisme', []],
['Joel Kovel', '1936-2018', 'ecosocialisme', []],
['Naomi Klein', '1970-', 'ecosocialisme', []],
// Technocritique
['Jacques Ellul', '1912-1994', 'technocritique', []],
['Bernard Charbonneau', '1910-1996', 'technocritique', []],
['Lewis Mumford', '1895-1990', 'technocritique', []],
['Alain Caillé', '1944-', 'technocritique', []],
['Hans Jonas', '1903-1993', 'technocritique', ['ethiques-environnementales']],
['Herbert Marcuse', '1898-1979', 'technocritique', []],
['Günther Anders', '1902-1992', 'technocritique', []],
['Pierre Fournier', '1937-1973', 'technocritique', []],
['Alexandre Grothendieck', '1928-2014', 'technocritique', []],
['Patrick Viveret', '1948-', 'technocritique', []],
['Philippe Bihouix', '1971-', 'technocritique', []],
['Jean Baudrillard', '1929-2007', 'technocritique', []],
['Serge Latouche', '1940-', 'decroissance', ['technocritique']],
['Ivan Illich', '1926-2002', 'technocritique', ['decroissance']],
['Leopold Kohr', '1909-1994', 'technocritique', ['decroissance']],
['Ernst Schumacher', '1911-1977', 'technocritique', ['decroissance']],
['Nicholas Georgescu-Roegen', '1906-1994', 'decroissance', ['technocritique']],
// Écoféminismes
["Françoise d'Eaubonne", '1920-2005', 'ecofeminismes', []],
['Vandana Shiva', '1952-', 'ecofeminismes', ['ecologies-decoloniales']],
['Starhawk', '1951-', 'ecofeminismes', []],
['Ariel Salleh', '1944-', 'ecofeminismes', []],
['Maria Mies', '1931-2023', 'ecofeminismes', []],
['Carolyn Merchant', '1936-', 'ecofeminismes', []],
['Silvia Federici', '1942-', 'ecofeminismes', []],
['Val Plumwood', '1939-2008', 'ecofeminismes', []],
['Susan Griffin', '1943-', 'ecofeminismes', []],
['Veronika Bennholdt-Thomsen', '1944-', 'ecofeminismes', []],
['Geneviève Pruvost', '1973-', 'ecofeminismes', []],
['Donna Haraway', '1944-', 'ecofeminismes', ['pensees-vivant']],
['Émilie Hache', '', 'ecofeminismes', []],
['Joanna Macy', '1929-', 'ecofeminismes', ['ethiques-environnementales']],
// Capitalisme vert
['Bill Gates', '1955-', 'capitalisme-vert', []],
['Christiana Figueres', '1956-', 'capitalisme-vert', []],
['Nicholas Stern', '1946-', 'capitalisme-vert', []],
['Jeffrey Sachs', '1954-', 'capitalisme-vert', []],
['Jared Diamond', '1937-', 'capitalisme-vert', ['decroissance']],
['Jørgen Randers', '1945-', 'capitalisme-vert', ['decroissance']],
['Donella Meadows', '1941-2001', 'decroissance', ['capitalisme-vert']],
['Dennis Meadows', '1942-', 'decroissance', ['capitalisme-vert']],
['Kate Raworth', '1970-', 'capitalisme-vert', []],
['Al Gore', '1948-', 'capitalisme-vert', []],
['Hal Harvey', '1960-', 'capitalisme-vert', []],
['Laurence Tubiana', '1951-', 'capitalisme-vert', []],
['Amory Lovins', '1947-', 'capitalisme-vert', []],
['David Pearce', '1959-', 'capitalisme-vert', []],
['Kerry Turner', '1948-', 'capitalisme-vert', []],
['David Keith', '1963-', 'capitalisme-vert', []],
['Ted Nordhaus', '1965-', 'capitalisme-vert', []],
['Michael Shellenberger', '1971-', 'capitalisme-vert', []],
['Pavan Sukhdev', '1960-', 'capitalisme-vert', []],
['Janine Benyus', '1958-', 'capitalisme-vert', []],
['Robert Costanza', '1950-', 'capitalisme-vert', []],
['Peter Kareiva', '1951-', 'capitalisme-vert', []],
['Michelle Marvier', '', 'capitalisme-vert', []],
['Robert Lalasz', '1915-2003', 'capitalisme-vert', []],
['Steward Brand', '1938-', 'capitalisme-vert', []],
['Paul Crutzen', '1933-2021', 'capitalisme-vert', []],
['Kenneth Boulding', '1910-1993', 'capitalisme-vert', []],
['Eugene Odum', '1913-2002', 'capitalisme-vert', []],
['Howard Odum', '1924-2002', 'capitalisme-vert', []],
['Jean-Marc Jancovici', '1962-', 'capitalisme-vert', []],
['Yves Cochet', '1946-', 'capitalisme-vert', ['decroissance']],
['Pablo Servigne', '1978-', 'decroissance', ['capitalisme-vert']],
['Gauthier Chapelle', '1968-', 'decroissance', ['capitalisme-vert']],
// Écologies décoloniales
['Malcom Ferdinand', '1985-', 'ecologies-decoloniales', []],
['Frantz Fanon', '1925-1961', 'ecologies-decoloniales', []],
['Édouard Glissant', '1928-2011', 'ecologies-decoloniales', []],
['Aimé Césaire', '1913-2008', 'ecologies-decoloniales', []],
['Mohamad Amer Meziane', '', 'ecologies-decoloniales', []],
['Chico Mendes', '1944-1988', 'ecologies-decoloniales', []],
['Joan Martínez Alier', '1939-', 'ecologies-decoloniales', []],
['Arturo Escobar', '1951-', 'ecologies-decoloniales', []],
['Sous-commandant Marcos', '1957-', 'ecologies-decoloniales', []],
['Alberto Acosta', '1948-', 'ecologies-decoloniales', []],
['Jérôme Baschet', '1960-', 'ecologies-decoloniales', []],
['Fatima Ouassak', '1976-', 'ecofeminismes', ['ecologies-decoloniales']],
['William Acker', '1991-', 'ecologies-decoloniales', []],
['Giorgos Kallis', '1972-', 'ecologies-decoloniales', ['decroissance']],
['Bernard Lambert', '1931-1984', 'ecologies-decoloniales', []],
// Écofascismes
['Alain de Benoist', '1943-', 'ecofascismes', []],
['Paul Ralph Ehrlich', '1932-', 'ecofascismes', []],
['Garrett Hardin', '1915-2003', 'ecofascismes', []],
['Edward Osborne Wilson', '1929-2021', 'ecofascismes', []],
['Thomas Malthus', '1803-1882', 'ecofascismes', []],
['David Foreman', '1946-2022', 'ecofascismes', []],
['Piero San Giorgio', '1971-', 'ecofascismes', []],
// Éthique environnementale
['Arne Næss', '1912-2009', 'ethiques-environnementales', []],
['Rachel Carson', '1907-1964', 'ethiques-environnementales', []],
['Aldo Leopold', '1887-1948', 'ethiques-environnementales', []],
['Imanishi Kinji', '1902-1992', 'ethiques-environnementales', []],
['Paul Watson', '1950-', 'ethiques-environnementales', []],
['John Muir', '1838-1914', 'ethiques-environnementales', []],
['Edward Abbey', '1927-1989', 'ethiques-environnementales', []],
['John Baird Callicott', '1941-', 'ethiques-environnementales', []],
['Bill Mollison', '1928-2016', 'ethiques-environnementales', []],
['David Holmgren', '1955-', 'ethiques-environnementales', []],
['Peter Singer', '1946-', 'ethiques-environnementales', []],
['Pierre Rabhi', '1938-2021', 'ethiques-environnementales', []],
['Rob Hopkins', '1968-', 'ethiques-environnementales', []],
['Cyril Dion', '1978-', 'ethiques-environnementales', []],
['Gandhi', '1869-1948', 'ethiques-environnementales', []],
['Gifford Pinchot', '1865-1946', 'ethiques-environnementales', []],
['Lanza del Vasto', '1901-1981', 'ethiques-environnementales', []],
['Jorge Mario Bergoglio', '1936-', 'ethiques-environnementales', []],
['Gary Snyder', '1930-', 'ethiques-environnementales', []],
['Henry David Thoreau', '1817-1862', 'ethiques-environnementales', []],
['Ralph Waldo Emerson', '1803-1882', 'ethiques-environnementales', []],
['José Bové', '1953-', 'ethiques-environnementales', []],
['Glenn Albrecht', '1953-', 'ethiques-environnementales', []],
// Pensées du vivant
['Bruno Latour', '1947-2022', 'pensees-vivant', []],
['Isabelle Stengers', '1949-', 'pensees-vivant', []],
['Vinciane Despret', '1959-', 'pensees-vivant', []],
['Baptiste Morizot', '1983-', 'pensees-vivant', []],
['Philippe Descola', '1949-', 'pensees-vivant', []],
['Eduardo Viveiros de Castro', '1951-', 'pensees-vivant', []],
['Anna Tsing', '1952-', 'pensees-vivant', []],
['Deborah Bird Rose', '1946-2018', 'pensees-vivant', []],
['Lynn Margulis', '1938-2011', 'pensees-vivant', []],
['James Lovelock', '1919-2022', 'pensees-vivant', []],
['Serge Moscovici', '1925-2014', 'pensees-vivant', []],
['Theodore Roszak', '1933-2011', 'pensees-vivant', []],
['Baruch Spinoza', '1632-1677', 'pensees-vivant', []],
];
// Special slug overrides (match v2.1 IDs + ligatures)
const NAME_TO_SLUG_OVERRIDES = {
'Malcom Ferdinand': 'malcolm-ferdinand',
"Françoise d'Eaubonne": 'francoise-deaubonne',
'Donella Meadows': 'donella-meadows',
'Dennis Meadows': 'dennis-meadows',
'Arne Næss': 'arne-naess',
'Jørgen Randers': 'jorgen-randers',
};
function slugify(name) {
// Pre-process special ligatures and chars not handled by NFKD
let pre = name
.replace(/[æÆ]/g, 'ae')
.replace(/[øØ]/g, 'o')
.replace(/[œŒ]/g, 'oe')
.replace(/ß/g, 'ss');
// Remove diacritical marks
const noAccent = pre.normalize('NFKD').replace(/[̀-ͯ]/g, '');
return noAccent
.toLowerCase()
.replace(/[^a-z0-9]+/g, '-')
.replace(/^-+|-+$/g, '');
}
function getAuthorSlug(name) {
if (NAME_TO_SLUG_OVERRIDES[name]) return NAME_TO_SLUG_OVERRIDES[name];
return slugify(name);
}
function main() {
const raw = fs.readFileSync(JSON_PATH, 'utf-8');
const data = JSON.parse(raw);
const existingBySlug = {};
for (const a of data.auteurs) existingBySlug[a.id] = a;
const newAuthors = [];
const seenSlugs = new Set();
for (const [nom, dates, ecolePrincipale, ecolesSecondaires] of BONPOTE_AUTHORS) {
const slug = getAuthorSlug(nom);
if (seenSlugs.has(slug)) {
console.error(`DUPLICATE SKIP: ${nom} -> ${slug}`);
continue;
}
seenSlugs.add(slug);
const ingere = INGESTED_AUTHOR_SLUGS.has(slug);
const ecoles = [ecolePrincipale, ...ecolesSecondaires];
if (existingBySlug[slug]) {
// Preserve enriched entry
const entry = { ...existingBySlug[slug], ingere };
newAuthors.push(entry);
} else {
// New minimal entry
const bioProvisoire = ingere
? `Auteur·ice ingéré·e dans le RAG ATIS, bio à enrichir lors de PRG-5.`
: `Théoricien·ne présent·e sur le poster Bonpote (${ecolePrincipale}), non ingéré·e dans le RAG ATIS.`;
newAuthors.push({
id: slug,
nom,
dates,
ecoles,
ecole_principale: ecolePrincipale,
livres_rag: [],
theses_cles_attendues: [],
bio_courte_provisoire: bioProvisoire,
ingere,
});
}
}
// Preserve any v2.1 author not in Bonpote list
for (const [slug, entry] of Object.entries(existingBySlug)) {
if (!seenSlugs.has(slug)) {
const copy = { ...entry };
if (!('ingere' in copy)) copy.ingere = INGESTED_AUTHOR_SLUGS.has(slug);
newAuthors.push(copy);
seenSlugs.add(slug);
console.error(`NOTE: preserved v2.1 author not in Bonpote canonical: ${slug}`);
}
}
const auteursCount = newAuthors.length;
const auteursIngeresCount = newAuthors.filter(a => a.ingere).length;
data.meta.version = '3.0';
data.meta.updated = '2026-05-12';
data.meta.auteurs_count = auteursCount;
data.meta.auteurs_ingeres_count = auteursIngeresCount;
data.meta.source = 'FRACAS Bonpote V2 oct 2024 + LightRAG corpus 12/05/2026 (v3.0 sync)';
data.meta.note_v3_0 = 'Phase 8.A sync corpus unifie : ~140 auteurs Bonpote integres, flag ingere:true/false selon LightRAG VPS. Auteurs non-ingeres = entrees minimales (bio provisoire, livres_rag vide), a enrichir lors de PRG-4/PRG-5.';
data.auteurs = newAuthors;
fs.writeFileSync(JSON_PATH, JSON.stringify(data, null, 2), 'utf-8');
// Validate parse-back
const parsedBack = JSON.parse(fs.readFileSync(JSON_PATH, 'utf-8'));
if (parsedBack.auteurs.length !== auteursCount) {
console.error('PARSE-BACK MISMATCH');
process.exit(1);
}
// Stats
const schoolsStats = {};
for (const a of newAuthors) {
const ep = a.ecole_principale || '?';
if (!schoolsStats[ep]) schoolsStats[ep] = { total: 0, ingere: 0 };
schoolsStats[ep].total++;
if (a.ingere) schoolsStats[ep].ingere++;
}
console.log('\n=== JSON v3.0 written ===');
console.log(`Total auteurs : ${auteursCount}`);
console.log(`Ingeres : ${auteursIngeresCount}`);
console.log(`Non-ingeres : ${auteursCount - auteursIngeresCount}`);
console.log(`Parse-back : OK (${parsedBack.auteurs.length} auteurs)`);
console.log('\nPer school (ecole_principale):');
const sortedSchools = Object.entries(schoolsStats).sort((a, b) => b[1].total - a[1].total);
for (const [school, st] of sortedSchools) {
console.log(` ${school.padEnd(30)} total=${String(st.total).padStart(3)} ingere=${String(st.ingere).padStart(3)} non-ing=${String(st.total - st.ingere).padStart(3)}`);
}
// Top 5 schools with most non-ingested
const nonIngStats = sortedSchools
.map(([k, v]) => [k, v.total - v.ingere])
.sort((a, b) => b[1] - a[1])
.slice(0, 5);
console.log('\nTop 5 ecoles avec le plus de non-ingeres (PRG-4 priorities):');
for (const [school, count] of nonIngStats) {
console.log(` ${school.padEnd(30)} non-ing=${count}`);
}
}
main();

View File

@@ -1,205 +0,0 @@
import type { H3Event } from 'h3'
import { readFileSync } from 'node:fs'
import { join } from 'node:path'
import { checkRateLimitJson } from '~/server/utils/rateLimitJson'
interface ChatbotPenseesRequest {
query: string
mode?: 'hybrid' | 'local' | 'global' | 'naive' | 'mix'
corpus?: 'pensees' | 'projets' | 'both'
filter_couche?: 'fond' | 'forme' | 'structure' | null
filter_ecole?: string | null
auteur_slug?: string | null
history?: Array<{ role: 'user' | 'assistant'; content: string }>
}
interface LightRAGReference {
reference_id?: string
file_path?: string
content?: string | null
}
interface LightRAGQueryResponse {
response: string
references?: LightRAGReference[]
}
interface AuteurMini {
id: string
nom: string
ingere?: boolean
}
const SYSTEM_PREFACE_PENSEES = `Tu es un agent du RAG Pensées Écologiques, infrastructure militante du collectif trans-former.fr.
Tu réponds en t'appuyant STRICTEMENT sur le corpus ingéré (auteurs FRACAS Bonpote : écosocialisme, éco-anarchisme, écoféminismes, écologies décoloniales, technocritique, pensées du vivant, décroissance...).
Règles :
- Cite les sources (auteur, livre) à chaque assertion importante.
- Si la question dépasse le corpus, dis-le clairement. Pas d'hallucination.
- Ton politique direct, pas de neutralité fade.
- Réponse en français, dense, sans délayage.
- Distingue les positions selon les écoles quand elles divergent.`
const SYSTEM_PREFACE_PROJETS = `Tu es un agent du RAG Projets de Jules Nény (architecte, collectif trans-former.fr).
Tu réponds STRICTEMENT à partir des documents projet (fichiers butte-pinson__*.md et autres projets archi de Jules).
N'utilise PAS le corpus FRACAS Pensées Écologiques pour répondre, sauf si l'usager te le demande explicitement.
Règles :
- Cite les sources (nom de projet, document) à chaque assertion importante.
- Si la question dépasse le corpus projet, dis-le clairement. Pas d'hallucination.
- Ton praticien réflexif : 1ère personne quand pertinent, narration située.
- Réponse en français, dense, sans délayage.`
const SYSTEM_PREFACE_BOTH = `Tu es un agent du RAG croisé Pensées x Projets de Jules Nény (architecte militant, collectif trans-former.fr).
CENTRE TA RÉPONSE sur les documents PROJETS (fichiers butte-pinson__*.md et autres projets archi).
Mobilise le corpus FRACAS Pensées (autres fichiers) UNIQUEMENT pour éclairer théoriquement les partis pris des projets, jamais l'inverse.
Pondération attendue : ~70% ancrage projet concret, ~30% éclairage théorique FRACAS.
Règles :
- Cite les sources (auteur ou nom de projet, document) à chaque assertion.
- Si un thème n'est pas couvert par les projets, dis-le clairement avant d'éventuellement étendre au corpus Pensées.
- Pas d'hallucination, pas d'extrapolation hors corpus.
- Ton praticien militant : direct, pas neutre, ancré dans la pratique architecturale.
- Réponse en français, dense, sans délayage.`
function buildPrefaceAuteur(nomAuteur: string, slug: string): string {
return `Tu réponds EXCLUSIVEMENT depuis les livres de ${nomAuteur} présents dans le RAG (fichiers commençant par "${slug}__").
Si la question sort du périmètre de cet auteur, indique-le et propose de l'aborder sans le hashtag pour interroger la carte entière. Reste fidèle au style et à la pensée de ${nomAuteur}. Cite toujours le livre.
Règles :
- Cite les sources (titre du livre) à chaque assertion.
- Pas d'hallucination. Si l'info n'est pas dans le corpus de cet auteur, dis-le.
- N'introduis JAMAIS d'autres auteurs sauf si ${nomAuteur} les commente explicitement.
- Ton politique direct, pas de neutralité fade.
- Réponse en français, dense, sans délayage.`
}
// Chargement (et cache) de la liste des auteurs ingérés pour validation du slug
let auteursIngeresCache: AuteurMini[] | null = null
function loadAuteursIngeres(): AuteurMini[] {
if (auteursIngeresCache) return auteursIngeresCache
try {
const jsonPath = join(process.cwd(), 'public', 'data', 'auteurs-pensees.json')
const raw = readFileSync(jsonPath, 'utf-8')
const data = JSON.parse(raw)
const list: AuteurMini[] = (data.auteurs ?? [])
.filter((a: any) => a.ingere === true)
.map((a: any) => ({ id: String(a.id), nom: String(a.nom), ingere: true }))
auteursIngeresCache = list
return list
} catch {
auteursIngeresCache = []
return []
}
}
export default defineEventHandler(async (event: H3Event) => {
const config = useRuntimeConfig(event)
// 1. Rate limit (20 req/jour/IP, IP hashée RGPD)
const ip =
getHeader(event, 'x-forwarded-for')?.split(',')[0].trim() ||
event.node.req.socket?.remoteAddress ||
'0.0.0.0'
const allowed = checkRateLimitJson(ip, 'chatbot-pensees', 20)
if (!allowed) {
throw createError({ statusCode: 429, message: 'Limite de 20 questions par jour atteinte.' })
}
// 2. Body parse + validation
const body = await readBody<ChatbotPenseesRequest>(event)
if (!body?.query || body.query.trim().length < 3 || body.query.trim().length > 500) {
throw createError({ statusCode: 400, message: 'Query invalide (3-500 caractères).' })
}
const query = body.query.trim()
const mode = body.mode || 'hybrid'
const corpus = body.corpus || 'both'
const ragUrl = (config.ragPeUrl as string) || 'http://localhost:9621'
// Validation auteur_slug (Phase 8.E) : match contre la liste des auteurs ingérés
const auteurSlug = body.auteur_slug?.trim().toLowerCase() || null
let nomAuteurMatch: string | null = null
if (auteurSlug) {
const ingeres = loadAuteursIngeres()
const auteur = ingeres.find(a => a.id === auteurSlug)
nomAuteurMatch = auteur?.nom ?? null
}
// Préface adaptative : auteur prioritaire si slug matché, sinon corpus
let systemPreface: string
if (auteurSlug && nomAuteurMatch) {
systemPreface = buildPrefaceAuteur(nomAuteurMatch, auteurSlug)
} else if (corpus === 'pensees') {
systemPreface = SYSTEM_PREFACE_PENSEES
} else if (corpus === 'projets') {
systemPreface = SYSTEM_PREFACE_PROJETS
} else {
systemPreface = SYSTEM_PREFACE_BOTH
}
// 3. Health guard — LightRAG down = erreur claire, pas de fallback hallucinatoire
try {
await $fetch(`${ragUrl}/health`, { timeout: 5000 })
} catch {
throw createError({
statusCode: 503,
message: 'RAG indisponible pour l\'instant — réessaie dans quelques minutes.',
})
}
// 4. Call LightRAG VPS — préface système injectée dans la query
const ragQuery = `${systemPreface}\n\nQuestion : ${query}`
// Construction du body : hl_keywords + ll_keywords si auteur ciblé
// NB : LightRAG ne supporte ni keyword_filter ni ids ni metadata_filter (preflight OpenAPI confirmé).
// hl_keywords / ll_keywords sont les seuls leviers natifs de priorisation par auteur.
const ragBody: Record<string, unknown> = { query: ragQuery, mode }
if (auteurSlug && nomAuteurMatch) {
ragBody.hl_keywords = [nomAuteurMatch, auteurSlug]
ragBody.ll_keywords = [auteurSlug]
}
let ragResponse: LightRAGQueryResponse
try {
ragResponse = await $fetch<LightRAGQueryResponse>(`${ragUrl}/query`, {
method: 'POST',
body: ragBody,
timeout: 90000,
})
} catch (e: any) {
const status = e?.response?.status
if (status === 429) {
throw createError({ statusCode: 429, message: 'RAG saturé — réessaie dans quelques instants.' })
}
throw createError({ statusCode: 504, message: 'RAG en cours de processing — réessaie dans quelques secondes.' })
}
// Fallback post-process : si auteur ciblé et que les references LightRAG remontent
// des chunks hors slug__, on l'indique pour transparence. La préface LLM est la garde principale.
let chunksOffTarget = 0
let chunksOnTarget = 0
if (auteurSlug && nomAuteurMatch && Array.isArray(ragResponse.references)) {
const slugPrefix = `${auteurSlug}__`
for (const ref of ragResponse.references) {
const fp = (ref.file_path ?? '').toLowerCase()
if (!fp) continue
if (fp.startsWith(slugPrefix)) chunksOnTarget++
else chunksOffTarget++
}
}
// 5. Retour formaté
return {
response: ragResponse.response ?? '',
mode,
corpus,
auteur: auteurSlug && nomAuteurMatch ? { slug: auteurSlug, nom: nomAuteurMatch } : null,
auteur_unmatched: auteurSlug && !nomAuteurMatch ? auteurSlug : null,
auteur_chunks: auteurSlug && nomAuteurMatch ? { on_target: chunksOnTarget, off_target: chunksOffTarget } : null,
filter: { couche: body.filter_couche ?? null, ecole: body.filter_ecole ?? null },
timestamp: new Date().toISOString(),
}
})