implement logout dialog, fix unused imports

src/components/layout/Navbar.vue

@@ -1,11 +1,12 @@
 <script setup lang="ts">
 import { ref, computed } from 'vue'
 import { useI18n } from 'vue-i18n'
-import { Menu, X, Sun, Moon, Zap, MessageSquareText, LogIn, LogOut } from 'lucide-vue-next'
+import { Menu, X, Sun, Moon, Zap, MessageSquareText, LogIn } from 'lucide-vue-next'
 import { Button } from '@/components/ui/button'
 import { useTheme } from '@/components/theme-provider'
 import { useNostrStore } from '@/stores/nostr'
 import { useRouter } from 'vue-router'
+import LogoutDialog from '@/components/ui/logout-dialog/LogoutDialog.vue'
 
 const { t, locale } = useI18n()
 const { theme, setTheme } = useTheme()
@@ -36,12 +37,8 @@ const toggleLocale = () => {
   localStorage.setItem('locale', newLocale)
 }
 
-const handleAuth = () => {
-  if (nostrStore.isLoggedIn) {
-    nostrStore.logout()
-  } else {
-    router.push('/support')
-  }
+const handleLogout = () => {
+  nostrStore.logout()
 }
 </script>
 
@@ -79,9 +76,11 @@ const handleAuth = () => {
           {{ locale === 'en' ? '🇪🇸 ES' : '🇺🇸 EN' }}
         </Button>
 
-        <Button variant="ghost" size="icon" @click="handleAuth" class="text-muted-foreground hover:text-foreground">
-          <LogIn v-if="!nostrStore.isLoggedIn" class="h-5 w-5" />
-          <LogOut v-else class="h-5 w-5" />
+        <template v-if="nostrStore.isLoggedIn">
+          <LogoutDialog :onLogout="handleLogout" />
+        </template>
+        <Button v-else variant="ghost" size="icon" @click="router.push('/support')" class="text-muted-foreground hover:text-foreground">
+          <LogIn class="h-5 w-5" />
         </Button>
 
         <!-- Mobile menu button -->