From 42ad8ebc823dc1d7ad123fb9fa3784d47a3c2817 Mon Sep 17 00:00:00 2001
From: Jin Yi <jin12cc@gmail.com>
Date: Tue, 5 Aug 2025 18:36:43 +0900
Subject: [PATCH] [fix] Fix conflict red dot not syncing   between components

  Resolve reactivity issue by sharing
  useStorage refs across all
  composable instances to ensure UI
  consistency.
---
 .../sidebar/SidebarHelpCenterIcon.vue         |  6 ++--
 src/composables/useConflictAcknowledgment.ts  | 28 +++++++++----------
 src/composables/useConflictDetection.ts       |  3 --
 3 files changed, 16 insertions(+), 21 deletions(-)

diff --git a/src/components/sidebar/SidebarHelpCenterIcon.vue b/src/components/sidebar/SidebarHelpCenterIcon.vue
index f34df2370..06662f581 100644
--- a/src/components/sidebar/SidebarHelpCenterIcon.vue
+++ b/src/components/sidebar/SidebarHelpCenterIcon.vue
@@ -80,13 +80,13 @@ const { isVisible: isHelpCenterVisible } = storeToRefs(helpCenterStore)
 const { shouldShowRedDot: showReleaseRedDot } = storeToRefs(releaseStore)
 
 const conflictDetection = useConflictDetection()
-const conflictAcknowledgment = useConflictAcknowledgment()
 
 const { showNodeConflictDialog } = useDialogService()
 
-// Use conflict acknowledgment state from composable
+// Use conflict acknowledgment state from composable - call only once
 const { shouldShowRedDot: shouldShowConflictRedDot, markConflictsAsSeen } =
-  conflictAcknowledgment
+  useConflictAcknowledgment()
+
 // Use either release red dot or conflict red dot
 const shouldShowRedDot = computed(() => {
   const releaseRedDot = showReleaseRedDot
diff --git a/src/composables/useConflictAcknowledgment.ts b/src/composables/useConflictAcknowledgment.ts
index b352a21a9..788c9ccd5 100644
--- a/src/composables/useConflictAcknowledgment.ts
+++ b/src/composables/useConflictAcknowledgment.ts
@@ -21,6 +21,17 @@ interface ConflictAcknowledgmentState {
   warning_banner_dismissed: boolean
 }
 
+// Shared state - initialized once and reused across all composable calls
+const modalDismissed = useStorage(STORAGE_KEYS.CONFLICT_MODAL_DISMISSED, false)
+const redDotDismissed = useStorage(
+  STORAGE_KEYS.CONFLICT_RED_DOT_DISMISSED,
+  false
+)
+const warningBannerDismissed = useStorage(
+  STORAGE_KEYS.CONFLICT_WARNING_BANNER_DISMISSED,
+  false
+)
+
 /**
  * Composable for managing conflict acknowledgment state in localStorage
  *
@@ -33,20 +44,6 @@ interface ConflictAcknowledgmentState {
 export function useConflictAcknowledgment() {
   const conflictDetectionStore = useConflictDetectionStore()
 
-  // Reactive state using VueUse's useStorage for automatic persistence
-  const modalDismissed = useStorage(
-    STORAGE_KEYS.CONFLICT_MODAL_DISMISSED,
-    false
-  )
-  const redDotDismissed = useStorage(
-    STORAGE_KEYS.CONFLICT_RED_DOT_DISMISSED,
-    false
-  )
-  const warningBannerDismissed = useStorage(
-    STORAGE_KEYS.CONFLICT_WARNING_BANNER_DISMISSED,
-    false
-  )
-
   // Create computed state object for backward compatibility
   const state = computed<ConflictAcknowledgmentState>(() => ({
     modal_dismissed: modalDismissed.value,
@@ -82,7 +79,8 @@ export function useConflictAcknowledgment() {
   const shouldShowConflictModal = computed(() => !modalDismissed.value)
   const shouldShowRedDot = computed(() => {
     if (!hasConflicts.value) return false
-    return !redDotDismissed.value
+    if (redDotDismissed.value) return false
+    return true
   })
   const shouldShowManagerBanner = computed(() => {
     return hasConflicts.value && !warningBannerDismissed.value
diff --git a/src/composables/useConflictDetection.ts b/src/composables/useConflictDetection.ts
index ad47b70ff..036fb1bad 100644
--- a/src/composables/useConflictDetection.ts
+++ b/src/composables/useConflictDetection.ts
@@ -454,9 +454,6 @@ export function useConflictDetection() {
     importFailInfo: Record<string, { msg: string; name: string; path: string }>
   ): ConflictDetectionResult[] {
     const results: ConflictDetectionResult[] = []
-
-    console.log('@@@', importFailInfo)
-
     if (!importFailInfo || typeof importFailInfo !== 'object') {
       return results
     }