From 7bba8f09f6b56481bb55f98d71eaae577f578e33 Mon Sep 17 00:00:00 2001
From: Deep Mehta <deepme987@gmail.com>
Date: Mon, 24 Nov 2025 04:17:25 +0530
Subject: [PATCH] Fix: Cloud notification badge reactivity and modal timing
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Fix badge not appearing by accessing settingStore.settingValues directly for proper reactivity
- Increase modal delay to 2s to ensure it appears after missing models dialog
- Move setting update inside setTimeout to only save when modal actually shows

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 src/App.vue                            | 24 ++++++++++++++++--------
 src/components/topbar/TopbarBadges.vue |  6 ++++--
 2 files changed, 20 insertions(+), 10 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index a6ff7c4f4..7ba2d05f6 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -80,15 +80,23 @@ onMounted(async () => {
   void conflictDetection.initializeConflictDetection()
 
   // Show cloud notification for macOS desktop users (one-time)
-  const isMacOS = navigator.platform.toLowerCase().includes('mac')
-  const settingStore = useSettingStore()
-  const hasShownNotification = settingStore.get(
-    'Comfy.Desktop.CloudNotificationShown'
-  )
+  // Delayed to ensure it appears after workflow loading (missing models dialog, etc.)
+  if (isElectron()) {
+    const isMacOS = navigator.platform.toLowerCase().includes('mac')
+    if (isMacOS) {
+      const settingStore = useSettingStore()
+      const hasShownNotification = settingStore.get(
+        'Comfy.Desktop.CloudNotificationShown'
+      )
 
-  if (isElectron() && isMacOS && !hasShownNotification) {
-    dialogService.showCloudNotification()
-    await settingStore.set('Comfy.Desktop.CloudNotificationShown', true)
+      if (!hasShownNotification) {
+        // Delay to show after initial workflow loading completes
+        setTimeout(async () => {
+          dialogService.showCloudNotification()
+          await settingStore.set('Comfy.Desktop.CloudNotificationShown', true)
+        }, 2000)
+      }
+    }
   }
 })
 </script>
diff --git a/src/components/topbar/TopbarBadges.vue b/src/components/topbar/TopbarBadges.vue
index 165988520..748cb64b3 100644
--- a/src/components/topbar/TopbarBadges.vue
+++ b/src/components/topbar/TopbarBadges.vue
@@ -72,8 +72,10 @@ const dialogService = useDialogService()
 
 const isMacOS = computed(() => navigator.platform.toLowerCase().includes('mac'))
 
-const hasShownNotification = computed(() =>
-  settingStore.get('Comfy.Desktop.CloudNotificationShown')
+// Access the reactive store state directly for proper reactivity
+const hasShownNotification = computed(
+  () =>
+    settingStore.settingValues['Comfy.Desktop.CloudNotificationShown'] ?? false
 )
 
 const shouldShowCloudBadge = computed(