From 5175c20d82da6dfa9211f845a218e8ef0331058d Mon Sep 17 00:00:00 2001
From: padreug <padreug@aiolabs.dev>
Date: Mon, 7 Jul 2025 01:09:03 +0200
Subject: [PATCH] feat: Enhance Navbar and IdentityDialog components with
 improved functionality and logging

- Update Navbar to close the mobile menu when opening the identity dialog.
- Add debug logging to IdentityDialog to track changes in the dialog's open state.
- Adjust styling for mobile menu and dialog content for better responsiveness.
---
 src/components/layout/Navbar.vue        | 8 +++++---
 src/components/nostr/IdentityDialog.vue | 3 ++-
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/components/layout/Navbar.vue b/src/components/layout/Navbar.vue
index 83af830..5855e77 100644
--- a/src/components/layout/Navbar.vue
+++ b/src/components/layout/Navbar.vue
@@ -36,6 +36,8 @@ const toggleTheme = () => {
 
 const openIdentityDialog = () => {
   showIdentityDialog.value = true
+  // Close mobile menu when opening dialog
+  isOpen.value = false
 }
 </script>
 
@@ -119,11 +121,11 @@ const openIdentityDialog = () => {
 
     <!-- Mobile menu -->
     <div v-show="isOpen"
-      class="absolute left-0 right-0 top-14 z-[100] border-b bg-background/95 backdrop-blur-sm md:hidden">
+      class="absolute left-0 right-0 top-14 z-40 border-b bg-background/95 backdrop-blur-sm md:hidden">
       <div class="space-y-1 p-4">
         <!-- Identity in mobile menu -->
         <div class="mb-4 px-2">
-          <Button v-if="!identity.isAuthenticated.value" variant="outline" size="sm" @click="openIdentityDialog; isOpen = false" class="w-full gap-2">
+          <Button v-if="!identity.isAuthenticated.value" variant="outline" size="sm" @click="openIdentityDialog" class="w-full gap-2 min-h-[44px] touch-manipulation">
             <User class="h-4 w-4" />
             Connect Identity
           </Button>
@@ -134,7 +136,7 @@ const openIdentityDialog = () => {
               <Badge variant="secondary" class="text-xs ml-auto">Connected</Badge>
             </div>
             <div class="space-y-1">
-              <Button variant="ghost" size="sm" @click="openIdentityDialog; isOpen = false" class="w-full justify-start gap-2">
+              <Button variant="ghost" size="sm" @click="openIdentityDialog" class="w-full justify-start gap-2">
                 <User class="h-4 w-4" />
                 Profile
               </Button>
diff --git a/src/components/nostr/IdentityDialog.vue b/src/components/nostr/IdentityDialog.vue
index ad6b7eb..8fe7147 100644
--- a/src/components/nostr/IdentityDialog.vue
+++ b/src/components/nostr/IdentityDialog.vue
@@ -23,6 +23,7 @@ interface Emits {
 const props = defineProps<Props>()
 const emit = defineEmits<Emits>()
 
+
 // Form states
 const importKey = ref('')
 const usePassword = ref(false)
@@ -145,7 +146,7 @@ function initializeProfileForm() {
 
 <template>
   <Dialog :open="isOpen" @update:open="handleClose">
-    <DialogContent class="sm:max-w-[600px] max-h-[80vh] overflow-y-auto">
+    <DialogContent class="w-[95vw] sm:max-w-[600px] max-h-[90vh] overflow-y-auto p-4 sm:p-6">
       <DialogHeader>
         <DialogTitle class="flex items-center gap-2">
           <Key class="w-5 h-5" />