refactor: SiteHeaderTop*

wp-content/themes/ccat/app/components/site/SiteHeaderTop.vue

@@ -9,7 +9,7 @@ const showLabels = breakpoints.greaterOrEqual("sm");
   <UContainer class="flex items-center gap-1.5">
     <UiSocialProfiles :profiles="profiles" class="mr-auto" />
     <UNavigationMenu :items="menuItems" variant="link" content-orientation="vertical" />
-    <AuthButton :show-labels="showLabels" />
-    <MemberAreaButton :show-labels="showLabels" />
+    <SiteHeaderTopAuth :show-labels="showLabels" />
+    <SiteHeaderTopMember :show-labels="showLabels" />
   </UContainer>
 </template>

wp-content/themes/ccat/app/components/site/SiteHeaderTopAuth.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+defineProps<{ showLabels: boolean }>();
+const { loggedIn } = useUserSession();
+</script>
+
+<template>
+  <AuthState>
+    <UButton
+      :icon="loggedIn ? 'i-lucide-log-out' : 'i-lucide-log-in'"
+      color="neutral"
+      to="/connexion"
+      :label="showLabels ? (loggedIn ? 'Déconnexion' : 'Connexion') : undefined"
+    />
+  </AuthState>
+</template>

wp-content/themes/ccat/app/components/site/SiteHeaderTopMember.vue

@@ -0,0 +1,13 @@
+<script setup lang="ts">
+defineProps<{ showLabels: boolean }>();
+const { loggedIn } = useUserSession();
+const link = computed(() => (loggedIn.value ? { label: "Espace membre", to: "/espace-membre" } : { label: "Devenir membre", to: "/devenir-membre" }));
+</script>
+
+<template>
+  <UButton
+    icon="i-lucide-user"
+    color="primary"
+    v-bind="link"
+  />
+</template>