Revert "feat(web/context): mouse enter and mouse leave events (#218)"

This reverts commit 7a22da68e6.

package/client/resource/interface/context.ts

@@ -6,7 +6,6 @@ interface ContextMenuItem {
   icon?: IconName | [IconPrefix, IconName];
   iconColor?: string;
   onSelect?: (args: any) => void;
-  onHover?: (hoverState: boolean, args: any) => void;
   arrow?: boolean;
   description?: string;
   metadata?: string | { [key: string]: any } | string[];

resource/interface/client/context.lua

@@ -1,5 +1,4 @@
 local contextMenus = {}
-local lastHoveredContextItem = nil
 local openContextMenu = nil
 local keepInput = IsNuiFocusKeepingInput()
 
@@ -9,7 +8,6 @@ local keepInput = IsNuiFocusKeepingInput()
 ---@field icon? string
 ---@field iconColor? string
 ---@field onSelect? fun(args: any)
----@field onHover? fun(hoverState: boolean, args: any)
 ---@field arrow? boolean
 ---@field description? string
 ---@field metadata? string | { [string]: any } | string[]
@@ -43,25 +41,9 @@ local function closeContext(_, cb, onExit)
 
     if not cb then SendNUIMessage({ action = 'hideContext' }) end
 
-    if lastHoveredContextItem then
-        local data = contextMenus[openContextMenu].options[lastHoveredContextItem]
-        if data.onHover then data.onHover(false, data.args) end
-        lastHoveredContextItem = nil
-    end
-
     openContextMenu = nil
 end
 
-local function checkID(id) 
-    if math.type(tonumber(id)) == 'float' then
-        id = math.tointeger(id)
-    elseif tonumber(id) then
-        id += 1
-    end
-
-    return id
-end
-
 ---@param id string
 function lib.showContext(id)
     if not contextMenus[id] then error('No context menu of such id found.') end
@@ -107,11 +89,14 @@ RegisterNUICallback('openContext', function(data, cb)
     lib.showContext(data.id)
 end)
 
-
 RegisterNUICallback('clickContext', function(id, cb)
     cb(1)
 
-    local id = checkID(id)
+    if math.type(tonumber(id)) == 'float' then
+        id = math.tointeger(id)
+    elseif tonumber(id) then
+        id += 1
+    end
 
     local data = contextMenus[openContextMenu].options[id]
 
@@ -125,35 +110,12 @@ RegisterNUICallback('clickContext', function(id, cb)
     if data.event then TriggerEvent(data.event, data.args) end
     if data.serverEvent then TriggerServerEvent(data.serverEvent, data.args) end
 
-    if lastHoveredContextItem then
-        local data = contextMenus[openContextMenu].options[lastHoveredContextItem]
-        if data.onHover then data.onHover(false, data.args) end
-        lastHoveredContextItem = nil
-    end
-
     SendNUIMessage({
         action = 'hideContext'
     })
 end)
 
-RegisterNUICallback('onHover', function(data, cb)
-    cb(1)
-
-    local id = checkID(data.id)
-    local hoverState = data.hoverState
-
-    local data = contextMenus[openContextMenu].options[id]
-
-    if not data.onHover then return end
-
-    if data.onHover and hoverState == true then
-        lastHoveredContextItem = id
-        data.onHover(true, data.args)
-    end
-    if data.onHover and hoverState == false then
-        lastHoveredContextItem = nil
-        data.onHover(false, data.args)
-    end
-end)
-
 RegisterNUICallback('closeContext', closeContext)
+
+
+

web/src/features/menu/context/components/ContextButton.tsx

@@ -8,6 +8,10 @@ const openMenu = (id: string | undefined) => {
   fetchNui<ContextMenuProps>('openContext', { id: id, back: false });
 };
 
+const clickContext = (id: string) => {
+  fetchNui('clickContext', id);
+};
+
 const useStyles = createStyles((theme, params: { disabled?: boolean }) => ({
   inner: {
     justifyContent: 'flex-start',
@@ -47,11 +51,7 @@ const ContextButton: React.FC<{
         <HoverCard.Target>
           <Button
             classNames={{ inner: classes.inner, label: classes.label }}
-            onClick={() =>
+            onClick={() => (!button.disabled ? (button.menu ? openMenu(button.menu) : clickContext(buttonKey)) : null)}
-              !button.disabled ? (button.menu ? openMenu(button.menu) : fetchNui('clickContext', buttonKey)) : null
-            }
-            onMouseEnter={() => (!button.disabled ? fetchNui('onHover', { hoverState: true, id: buttonKey }) : null)}
-            onMouseLeave={() => (!button.disabled ? fetchNui('onHover', { hoverState: false, id: buttonKey }) : null)}
             variant="default"
             h="fit-content"
             p={10}
@@ -90,19 +90,17 @@ const ContextButton: React.FC<{
         <HoverCard.Dropdown className={classes.dropdown}>
           {button.image && <Image src={button.image} />}
           {Array.isArray(button.metadata) ? (
-            button.metadata.map(
+            button.metadata.map((metadata: string | { label: string; value?: any; progress?: number }, index: number) => (
-              (metadata: string | { label: string; value?: any; progress?: number }, index: number) => (
+              <>
-                <>
+                <Text key={`context-metadata-${index}`}>
-                  <Text key={`context-metadata-${index}`}>
+                  {typeof metadata === 'string' ? `${metadata}` : `${metadata.label}: ${metadata?.value ?? ""}`}
-                    {typeof metadata === 'string' ? `${metadata}` : `${metadata.label}: ${metadata?.value ?? ''}`}
+                </Text>
-                  </Text>
 
-                  {typeof metadata === 'object' && metadata.progress !== undefined && (
+                {typeof metadata === 'object' && metadata.progress !== undefined && (
-                    <Progress value={metadata.progress} size="sm" color={button.colorScheme || 'dark.3'} />
+                  <Progress value={metadata.progress} size="sm" color={button.colorScheme || 'dark.3'} />
-                  )}
+                )}
-                </>
+              </>
-              )
+            ))
-            )
           ) : (
             <>
               {typeof button.metadata === 'object' &&