[#202] Authentification — Connexion utilisateur (JWT) (!5)

| Numéro du ticket | Titre du ticket |
|------------------|-----------------|
|      #202            |        Authentification — Connexion utilisateur (JWT)         |

## Description de la PR
[#202] Authentification — Connexion utilisateur (JWT)

## Modification du .env

## Check list

- [x] Pas de régression
- [ ] TU/TI/TF rédigée
- [x] TU/TI/TF OK
- [x] CHANGELOG modifié

Reviewed-on: https://gitea.malio.fr/MALIO-DEV/Ferme/pulls/5
Reviewed-by: THOLOT DECHENE Matthieu <matthieu@yuno.malio.fr>
Co-authored-by: tristan <tristan@yuno.malio.fr>
Co-committed-by: tristan <tristan@yuno.malio.fr>

frontend/layouts/auth.vue

@@ -0,0 +1,7 @@
+<template>
+  <div class="min-h-screen bg-primary-500 from-primary-50 via-white to-neutral-100 text-neutral-900">
+    <main class="mx-auto flex min-h-screen w-full max-w-[720px] items-center px-6 py-12">
+      <slot />
+    </main>
+  </div>
+</template>

frontend/layouts/default.vue

@@ -9,7 +9,7 @@
             LOGO
           </span>
                 </NuxtLink>
-                <nav class="mx-8 flex gap-8 text-2xl font-bold uppercase text-white">
+                <nav class="mx-8 flex flex-1 gap-8 text-2xl font-bold uppercase text-white">
                     <NuxtLink to="/" custom v-slot="{ href, navigate, isExactActive }">
                         <a
                             :href="href"
@@ -29,6 +29,13 @@
                         </a>
                     </NuxtLink>
                 </nav>
+                <button
+                    type="button"
+                    class="ml-auto text-xl font-bold uppercase text-white transition hover:opacity-80"
+                    @click="handleLogout"
+                >
+                    Déconnexion
+                </button>
             </div>
         </header>
         <main class="mx-auto w-full max-w-[1050px] px-6 pt-[90px] pb-0">
@@ -38,6 +45,17 @@
 </template>
 
 <script setup lang="ts">
+import { useAuthStore } from '~/stores/auth'
+
 const route = useRoute()
+const auth = useAuthStore()
 const isReceptionActive = computed(() => route.path.startsWith('/reception'))
+
+const handleLogout = async () => {
+  try {
+    await auth.logout()
+  } finally {
+    await navigateTo('/login')
+  }
+}
 </script>