fix: hide label on mobile

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

@@ -1,7 +1,8 @@
 <script setup lang="ts">
-defineProps<{ showLabels: boolean }>();
+const props = defineProps<{ showLabels: boolean }>();
 const { loggedIn } = useUserSession();
-const link = computed(() => (loggedIn.value ? { label: "Espace membre", to: "/espace-membre" } : { label: "Devenir membre", to: "/devenir-membre" }));
+const label = computed(() => props.showLabels ? (loggedIn.value ? "Déconnexion" : "Connexion") : undefined);
+const to = computed(() => loggedIn.value ? "/espace-membre" : "/devenir-membre");
 </script>
 
 <template>
@@ -9,7 +10,8 @@ const link = computed(() => (loggedIn.value ? { label: "Espace membre", to: "/es
     <UButton
       icon="i-lucide-user"
       color="primary"
-      v-bind="link"
+      :label="label"
+      :to="to"
     />
   </AuthState>
 </template>

wp-content/themes/ccat/app/composables/useAuth.ts

@@ -10,6 +10,9 @@ export function useAuth() {
   const isLoggedIn = loggedIn;
   const isSwitchedTo = computed(() => Boolean(session.value?.isSwitchedTo));
 
+  const hasRole = (role: string) => session.value?.user?.roles?.includes(role) || false;
+  const isAdmin = computed(() => hasRole("administrator"));
+
   // Login
   const loginFields = [
     {
@@ -88,5 +91,5 @@ export function useAuth() {
     }
   }
 
-  return { isLoggedIn, isSwitchedTo, loginFields, login, logout, switchTo, switchBack };
+  return { isLoggedIn, isSwitchedTo, hasRole, isAdmin, loginFields, login, logout, switchTo, switchBack };
 }