Cleanup navigation

src/App.vue

@@ -2,12 +2,12 @@
 import { ref, onMounted, defineAsyncComponent } from 'vue';
 import { useSettingsStore, UsedWallet } from '@/stores/settings.store';
 import { useWalletStore } from '@/stores/wallet.store';
-import AppSidebar from '@/components/sidebar';
+import AppSidebar from '@/components/navigation';
 import { SidebarProvider } from '@/components/ui/sidebar';
 import { Toaster } from 'vue-sonner';
 import { useUserStore } from '@/stores/user.store';
 import { getWax } from '@/stores/wax.store';
-import AppHeader from '@/components/sidebar/AppHeader.vue';
+import AppHeader from '@/components/navigation/AppHeader.vue';
 
 const WalletOnboarding = defineAsyncComponent(() => import('@/components/onboarding/index'));
 

src/components/sidebar/AppHeader.vue → src/components/navigation/AppHeader.vue

 <script setup lang="ts">
-import ToggleSidebar from '@/components/sidebar/ToggleSidebar.vue';
+import ToggleSidebar from '@/components/navigation/ToggleSidebar.vue';
 import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
 import { Button } from '@/components/ui/button';
 import { useWalletStore } from "@/stores/wallet.store";
@@ -26,7 +26,7 @@ const userStore = useUserStore();
   <header class="w-full h-[60px] bg-background">
     <div class="fixed top-0 z-10 bg-background/60 backdrop-blur-sm px-4 h-[60px] border-b w-full md:w-[calc(100%-var(--sidebar-width))] flex items-center justify-between">
       <ToggleSidebar />
-      <div v-if="settingsStore.isLoaded" class="ml-2 inline-flex items-center">
+      <div v-if="settingsStore.isLoaded && hasUser" class="ml-2 inline-flex items-center">
         <Avatar class="w-8 h-8 mr-2">
           <AvatarImage v-if="userStore.profileImage" :src="userStore.profileImage" />
           <AvatarFallback v-if="settingsStore.isLoaded && hasUser">{{ settingsStore.settings.account?.slice(0, 2) }}</AvatarFallback>
@@ -35,10 +35,10 @@ const userStore = useUserStore();
       </div>
       <div class="ml-auto inline-flex items-center space-x-4 md:space-x-6">
         <ThemeSwitch class="w-6 h-6" />
-        <Button variant="outline" class="[&_svg]:size-6 px-2 md:px-4" @click="settingsStore.isLoaded && hasUser ? logout() : walletStore.openWalletSelectModal()">
+        <Button variant="outline" class="[&_svg]:size-6 px-2 md:px-4 font-bold" @click="settingsStore.isLoaded && hasUser ? logout() : walletStore.openWalletSelectModal()">
           <img v-if="hasUser" :src="getWalletIcon(settingsStore.settings.wallet!)" class="h-6 w-6" />
           <span v-if="settingsStore.isLoaded && hasUser">
-            <span class="font-bold hidden md:inline">Disconnect</span>
+            <span class="hidden md:inline">Disconnect</span>
             <svg class="inline md:hidden" width="24" height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
               <path style="fill: hsl(var(--foreground))" :d="mdiLogout"></path>
             </svg>