fix display name logout

pages/auth/access-denied.vue

@@ -51,13 +51,17 @@ const goToDashboard = async () => {
     await logout();
   }
 };
+const displayName = computed(() => {
+  if (!user.value) return 'You';
+  return user.value.name || user.value.preferred_username || 'You';
+});
 </script>
 <template>
     <div class="d-flex justify-center align-center text-center h-100vh bg-primary">
         <div>
             <img src="@/assets/images/backgrounds/error-access-denied.svg" width="400" alt="Access Denied" />
             <h1 class="text-h1 pt-3">Access Denied!</h1>
-            <h4 class="text-h4 my-4">You don't have permission to access this page.</h4>
+            <h4 class="text-h4 my-4">{{ displayName }} don't have permission to access this page.</h4>
             
             <!-- Show requested path if available -->
             <div v-if="requestedPath && requestedPath !== 'Unknown'" class="my-4">