Fix onRun not executing everywhere :hover is defined for HotbarIcon (#3316)

Signed-off-by: Sebastian Malton <sebastian@malton.name>

src/renderer/components/hotbar/hotbar-icon.tsx

@@ -74,8 +74,17 @@ export const HotbarIcon = observer(({menuItems = [], size = 40, tooltip, ...prop
     setMenuOpen(!menuOpen);
   };
 
-  const renderIcon = () => {
   return (
+    <div className={cssNames("HotbarIcon flex", className, { disabled, contextMenuAvailable: menuItems.length > 0 })}>
+      {tooltip && <Tooltip targetId={id}>{tooltip}</Tooltip>}
+      <div
+        id={id}
+        onClick={(event) => {
+          if (!disabled) {
+            onClick?.(event);
+          }
+        }}
+      >
         <Avatar
           {...rest}
           title={title}
@@ -84,22 +93,9 @@ export const HotbarIcon = observer(({menuItems = [], size = 40, tooltip, ...prop
           width={size}
           height={size}
           src={src}
-        onClick={(event) => {
-          if (!disabled) {
-            onClick?.(event);
-          }
-        }}
         >
           {material && <Icon className="materialIcon" material={material} />}
         </Avatar>
-    );
-  };
-
-  return (
-    <div className={cssNames("HotbarIcon flex", className, { disabled, contextMenuAvailable: menuItems.length > 0 })}>
-      {tooltip && <Tooltip targetId={id}>{tooltip}</Tooltip>}
-      <div id={id}>
-        {renderIcon()}
         {children}
       </div>
       <Menu