tambah akses permision button dan keycloak

components/layout/full/vertical-header/ProfileDD.vue

@@ -1,5 +1,15 @@
 <script setup lang="ts">
+import { signOut } from "next-auth/react";
 import { profileDD } from "@/_mockApis/headerData";
+
+const { data, status, getCsrfToken, getProviders } = useAuth()
+const runtimeConfig = useRuntimeConfig()
+const logout = async () => {
+  await signOut()
+  const LogOutKeycloakURL = `${runtimeConfig.public.keycloakUrl}/realms/${runtimeConfig.public.keycloakRealm}/protocol/openid-connect`
+  const logOutURL = `${LogOutKeycloakURL}/logout?client_id=${runtimeConfig.public.keycloakClient}&post_logout_redirect_uri=${encodeURIComponent(window.location.origin)}/auth/login`;
+  window.location.href = logOutURL
+}
 </script>
 
 <template>
@@ -41,7 +51,7 @@ import { profileDD } from "@/_mockApis/headerData";
         </div>
         <v-divider></v-divider>
         <perfect-scrollbar
-          style="height: calc(100vh - 240px); max-height: 240px"
+          style="height: calc(100vh - 300px); max-height: 300px"
         >
           <v-list class="py-0 theme-list mt-3" lines="one">
             <v-list-item
@@ -58,6 +68,7 @@ import { profileDD } from "@/_mockApis/headerData";
                 <v-chip size="small" color="error" v-if="item.badge">4</v-chip>
               </div>
             </v-list-item>
+            <v-btn @click="logout" color="primary" variant="outlined" block>Logout</v-btn>
           </v-list>
         </perfect-scrollbar>
       </div>