perbaikan keycloak dan hak akses pada sidebarItem, add axios, pinia, zod

components/layout/full/Main.vue

@@ -3,16 +3,18 @@ import { onMounted, ref, shallowRef, watch } from 'vue';
 import { useDisplay } from "vuetify";
 import sidebarItems from "@/components/layout/full/vertical-sidebar/sidebarItem";
 import { Menu2Icon } from "vue-tabler-icons";
+const props = defineProps({ items: { type: Object } })
+const sidebarMenu = ref('');
 
-const sidebarMenu = shallowRef(sidebarItems);
 
 const { mdAndDown } = useDisplay();
 const sDrawer = ref(true);
 onMounted(() => {
   sDrawer.value = !mdAndDown.value; // hide on mobile, show on desktop
 });
-watch(mdAndDown, (val) => {
-  sDrawer.value = !val;
+watch([mdAndDown, () => props.items], ([mdVal, items]) => {
+  sDrawer.value = !mdVal;
+  sidebarMenu.value = items;
 });
 </script>
 

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

@@ -1,13 +1,13 @@
 <script setup lang="ts">
 import { UserIcon, MailIcon, ListCheckIcon } from 'vue-tabler-icons';
 const runtimeConfig = useRuntimeConfig();
-const user_profile = useCookie('user_token_profile');
-// const user_token = useCookie('user_token');
+const user_profile = useCookie('user_profile');
+const user_token = useCookie('user_token');
 const logout = async () => {
-    console.log('Logging out...');
     window.location.href = `${runtimeConfig.public.keycloakUrl}/realms/${runtimeConfig.public.keycloakRealm}/protocol/openid-connect/logout?client_id=${runtimeConfig.public.keycloakClient}&post_logout_redirect_uri=http://localhost:3000`;
-    //   user_token.value = null;
-    user_profile.value = null;
+    user_token.value = null;
+    localStorage.removeItem('userProfile')
+    localStorage.removeItem('sidebarItems')
     navigateTo('/auth/login')
 }
 </script>