Merge pull request #87 from fishshi/fix/CMAutoClose

fix: Fix buggy structure of HoverCard component
ximu3 · Dec 7, 2024 · fef5da8 · fef5da8
2 parents 2aea4ea + 41c862b
commit fef5da8
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 30 deletions.
diff --git a/src/renderer/src/components/Showcase/posters/BigGamePoster.tsx b/src/renderer/src/components/Showcase/posters/BigGamePoster.tsx
@@ -29,8 +29,8 @@ export function BigGamePoster({
 
   return (
     <HoverCard openDelay={250} closeDelay={100}>
-      <HoverCardTrigger className={cn('rounded-none')}>
-        <ContextMenu>
+      <ContextMenu>
+        <HoverCardTrigger className={cn('rounded-none')}>
           <ContextMenuTrigger className={cn('rounded-none')}>
             <div
               className={cn(
@@ -86,19 +86,21 @@ export function BigGamePoster({
               </div>
             </div>
           </ContextMenuTrigger>
-          <GameNavCM
-            gameId={gameId}
-            openAttributesDialog={() => setIsAttributesDialogOpen(true)}
-            openAddCollectionDialog={() => setIsAddCollectionDialogOpen(true)}
-          />
-        </ContextMenu>
-        {isAttributesDialogOpen && (
-          <AttributesDialog gameId={gameId} setIsOpen={setIsAttributesDialogOpen} />
-        )}
-        {isAddCollectionDialogOpen && (
-          <AddCollectionDialog gameId={gameId} setIsOpen={setIsAddCollectionDialogOpen} />
-        )}
-      </HoverCardTrigger>
+        </HoverCardTrigger>
+        <GameNavCM
+          gameId={gameId}
+          openAttributesDialog={() => setIsAttributesDialogOpen(true)}
+          openAddCollectionDialog={() => setIsAddCollectionDialogOpen(true)}
+        />
+      </ContextMenu>
+
+      {isAttributesDialogOpen && (
+        <AttributesDialog gameId={gameId} setIsOpen={setIsAttributesDialogOpen} />
+      )}
+      {isAddCollectionDialogOpen && (
+        <AddCollectionDialog gameId={gameId} setIsOpen={setIsAddCollectionDialogOpen} />
+      )}
+
       <HoverCardContent
         side="right"
         className={cn(

diff --git a/src/renderer/src/components/Showcase/posters/GamePoster.tsx b/src/renderer/src/components/Showcase/posters/GamePoster.tsx
@@ -31,8 +31,8 @@ export function GamePoster({
 
   return (
     <HoverCard openDelay={200} closeDelay={100}>
-      <HoverCardTrigger>
-        <ContextMenu>
+      <ContextMenu>
+        <HoverCardTrigger>
           <ContextMenuTrigger>
             <HoverCardAnimation>
               {cover ? (
@@ -72,19 +72,21 @@ export function GamePoster({
               )}
             </HoverCardAnimation>
           </ContextMenuTrigger>
-          <GameNavCM
-            gameId={gameId}
-            openAttributesDialog={() => setIsAttributesDialogOpen(true)}
-            openAddCollectionDialog={() => setIsAddCollectionDialogOpen(true)}
-          />
-        </ContextMenu>
-        {isAttributesDialogOpen && (
-          <AttributesDialog gameId={gameId} setIsOpen={setIsAttributesDialogOpen} />
-        )}
-        {isAddCollectionDialogOpen && (
-          <AddCollectionDialog gameId={gameId} setIsOpen={setIsAddCollectionDialogOpen} />
-        )}
-      </HoverCardTrigger>
+        </HoverCardTrigger>
+        <GameNavCM
+          gameId={gameId}
+          openAttributesDialog={() => setIsAttributesDialogOpen(true)}
+          openAddCollectionDialog={() => setIsAddCollectionDialogOpen(true)}
+        />
+      </ContextMenu>
+
+      {isAttributesDialogOpen && (
+        <AttributesDialog gameId={gameId} setIsOpen={setIsAttributesDialogOpen} />
+      )}
+      {isAddCollectionDialogOpen && (
+        <AddCollectionDialog gameId={gameId} setIsOpen={setIsAddCollectionDialogOpen} />
+      )}
+
       <HoverCardContent
         side="right"
         className={cn(