From a9e586cda15e918a076444675dc4c5e43b0a9969 Mon Sep 17 00:00:00 2001
From: Yvv <yves@pervier.com>
Date: Sat, 18 Jul 2026 09:07:02 +0200
Subject: [PATCH] =?UTF-8?q?refactor(moods):=20adopte=20le=20layer=20@yvv/n?=
 =?UTF-8?q?uxt-base=20pour=20le=20m=C3=A9canisme=20d'ambiances?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- nuxt.config: extends ['../../yvv-nuxt-base']
- useMood.ts: délègue à useMood(moods) du layer, exporté useLibreMood
  (évite la collision avec l'auto-import du layer)
- MoodSwitcher.vue + app.vue: appellent useLibreMood()
- moods.css inchangé (couleurs = identité projet)

Mécanisme partagé (application DOM, persistance, sync color-mode) mutualisé
sans toucher le contrat CSS. Vérifié headless (Playwright) : 4 moods × light/dark
× desktop/mobile OK, persistance au reload OK, zéro erreur JS, zéro régression.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 frontend/app/app.vue                          |  2 +-
 .../app/components/common/MoodSwitcher.vue    |  2 +-
 frontend/app/composables/useMood.ts           | 54 +++----------------
 frontend/nuxt.config.ts                       |  1 +
 4 files changed, 9 insertions(+), 50 deletions(-)

diff --git a/frontend/app/app.vue b/frontend/app/app.vue
index e5fd63b..cbe60b0 100644
--- a/frontend/app/app.vue
+++ b/frontend/app/app.vue
@@ -6,7 +6,7 @@ const decisionsStore = useDecisionsStore()
 const protocolsStore = useProtocolsStore()
 const mandatesStore = useMandatesStore()
 const route = useRoute()
-const { initMood } = useMood()
+const { initMood } = useLibreMood()
 
 const navigationItems = [
   {
diff --git a/frontend/app/components/common/MoodSwitcher.vue b/frontend/app/components/common/MoodSwitcher.vue
index 1e3aa81..21d8870 100644
--- a/frontend/app/components/common/MoodSwitcher.vue
+++ b/frontend/app/components/common/MoodSwitcher.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-const { currentMood, moods, setMood } = useMood()
+const { currentMood, moods, setMood } = useLibreMood()
 </script>
 
 <template>
diff --git a/frontend/app/composables/useMood.ts b/frontend/app/composables/useMood.ts
index da92ab6..caab598 100644
--- a/frontend/app/composables/useMood.ts
+++ b/frontend/app/composables/useMood.ts
@@ -1,4 +1,7 @@
-import type { Ref } from 'vue'
+// Ambiances libreDecision — délègue le mécanisme au layer @yvv/nuxt-base.
+// Les couleurs (identité du projet) restent dans assets/css/moods.css (classes .mood-*).
+// Le layer fournit l'auto-import `useMood(moods, options)` ; on l'enveloppe ici
+// sous le nom `useLibreMood` pour éviter la collision avec ce composable auto-importé.
 
 export interface Mood {
   id: string
@@ -9,8 +12,6 @@ export interface Mood {
   isDark: boolean
 }
 
-const STORAGE_KEY = 'libredecision_mood'
-
 const moods: Mood[] = [
   { id: 'peps', label: 'Peps', description: 'Chaud et tonique', icon: 'i-lucide-sun', color: '#d44a10', isDark: false },
   { id: 'zen', label: 'Zen', description: 'Nature vivante', icon: 'i-lucide-leaf', color: '#2e8b48', isDark: false },
@@ -18,49 +19,6 @@ const moods: Mood[] = [
   { id: 'grave', label: 'Grave', description: 'Ambre mineral', icon: 'i-lucide-shield', color: '#d8a030', isDark: true },
 ]
 
-const currentMood: Ref<string> = ref('peps')
-
-function applyMood(moodId: string) {
-  if (import.meta.server) return
-
-  const mood = moods.find(m => m.id === moodId)
-  if (!mood) return
-
-  const html = document.documentElement
-
-  // Remove all existing mood classes
-  moods.forEach(m => html.classList.remove(`mood-${m.id}`))
-
-  // Add the new mood class
-  html.classList.add(`mood-${moodId}`)
-
-  // Sync color-mode (light/dark) via Nuxt's useColorMode
-  const colorMode = useColorMode()
-  colorMode.preference = mood.isDark ? 'dark' : 'light'
-
-  // Persist choice
-  localStorage.setItem(STORAGE_KEY, moodId)
-
-  currentMood.value = moodId
-}
-
-function setMood(moodId: string) {
-  applyMood(moodId)
-}
-
-function initMood() {
-  if (import.meta.server) return
-
-  const saved = localStorage.getItem(STORAGE_KEY)
-  const moodId = saved && moods.some(m => m.id === saved) ? saved : 'peps'
-  applyMood(moodId)
-}
-
-export function useMood() {
-  return {
-    currentMood: readonly(currentMood),
-    moods,
-    setMood,
-    initMood,
-  }
+export function useLibreMood() {
+  return useMood(moods, { storageKey: 'libredecision_mood', defaultId: 'peps' })
 }
diff --git a/frontend/nuxt.config.ts b/frontend/nuxt.config.ts
index a4cfe84..92ee14f 100644
--- a/frontend/nuxt.config.ts
+++ b/frontend/nuxt.config.ts
@@ -1,4 +1,5 @@
 export default defineNuxtConfig({
+  extends: ['../../yvv-nuxt-base'],
   compatibilityDate: '2025-07-15',
   ssr: false,
   devtools: { enabled: false },