Use ContextMenu in GameCard component

src/renderer/src/components/GameCard/index.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useState } from 'react';
+import ContextMenu, { Item } from '../ContextMenu';
 import './index.css';
 
 import { Game } from "@renderer/types";
@@ -20,14 +21,31 @@ const GameCard = ({ title, path, is_running, img_cover, id, }: Game) => {
   }, []);
 
 
+  const items: Item[] = [
+    {
+      label: 'Details',
+      onClick: () =>
+        console.log('Details'),
+      show: true
+    },
+    {
+      label: 'Details',
+      onClick: () =>
+        console.log('Details'),
+      show: true
+    }
+  ]
+
   return (
-    <div className='gameCard' key={id} id={`${id}`}>
+    <ContextMenu items={items}>
-      <img src={"src/assets/" + img_cover} alt={title}/>
+      <div className='gameCard' key={id} id={`${id}`}>
-      <a href="#" className='hoverLink' onClick={() => startGame(id)}>
+        <img src={"src/assets/" + img_cover} alt={title}/>
-        <span className='sr-only'>{title}</span>
+        <a href="#" className='hoverLink' onClick={() => startGame(id)}>
-      </a>
+          <span className='sr-only'>{title}</span>
-      {status}
+        </a>
-    </div>
+        {status}
+      </div>
+    </ContextMenu>
   );
 };