fix: hide label on mobile

This commit is contained in:
2025-09-18 12:54:06 -04:00
parent 1cea2fe9f8
commit c915d658d0
2 changed files with 9 additions and 4 deletions

View File

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

View File

@@ -10,6 +10,9 @@ export function useAuth() {
const isLoggedIn = loggedIn; const isLoggedIn = loggedIn;
const isSwitchedTo = computed(() => Boolean(session.value?.isSwitchedTo)); const isSwitchedTo = computed(() => Boolean(session.value?.isSwitchedTo));
const hasRole = (role: string) => session.value?.user?.roles?.includes(role) || false;
const isAdmin = computed(() => hasRole("administrator"));
// Login // Login
const loginFields = [ 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 };
} }