From 00c8d063c1a9d78f81a740ac1f8035648758bd86 Mon Sep 17 00:00:00 2001
From: Joseph Izang <josephizang@gmail.com>
Date: Mon, 12 Feb 2024 16:26:21 +0100
Subject: [PATCH] add cursor style to FE icons

---
 .../lib/components/file-explorer-hovericons.tsx    | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/libs/remix-ui/workspace/src/lib/components/file-explorer-hovericons.tsx b/libs/remix-ui/workspace/src/lib/components/file-explorer-hovericons.tsx
index 0c0ab996e7..6b110329b9 100644
--- a/libs/remix-ui/workspace/src/lib/components/file-explorer-hovericons.tsx
+++ b/libs/remix-ui/workspace/src/lib/components/file-explorer-hovericons.tsx
@@ -12,7 +12,7 @@ export type FileHoverIconsProps = {
 }
 
 export function FileHoverIcons(props: FileHoverIconsProps) {
-
+  const [mouseOver, setMouseOver] = useState(false)
   return (
     <>
       {<div className="d-flex flex-row align-items-center">
@@ -32,6 +32,9 @@ export function FileHoverIcons(props: FileHoverIconsProps) {
                     e.stopPropagation()
                     await props.handleNewFolderOp(props.file.path)
                   }}
+                  style={{ cursor: mouseOver ? 'pointer' : 'default' }}
+                  onMouseEnter={(e) => setMouseOver(true)}
+                  onMouseLeave={(e) => setMouseOver(false)}
                 ></span>
               </CustomTooltip>
               <CustomTooltip
@@ -47,6 +50,9 @@ export function FileHoverIcons(props: FileHoverIconsProps) {
                     e.stopPropagation()
                     await props.handleNewFileOp(props.file.path)
                   }}
+                  style={{ cursor: mouseOver ? 'pointer' : 'default' }}
+                  onMouseEnter={(e) => setMouseOver(true)}
+                  onMouseLeave={(e) => setMouseOver(false)}
                 ></span>
               </CustomTooltip>
             </>
@@ -65,6 +71,9 @@ export function FileHoverIcons(props: FileHoverIconsProps) {
               e.stopPropagation()
               await props.renamePathOp(props.file.path, props.file.type)
             }}
+            style={{ cursor: mouseOver ? 'pointer' : 'default' }}
+            onMouseEnter={(e) => setMouseOver(true)}
+            onMouseLeave={(e) => setMouseOver(false)}
           ></span>
         </CustomTooltip>
         <CustomTooltip
@@ -80,6 +89,9 @@ export function FileHoverIcons(props: FileHoverIconsProps) {
               e.stopPropagation()
               await props.deletePathOp(props.file.path)
             }}
+            style={{ cursor: mouseOver ? 'pointer' : 'default' }}
+            onMouseEnter={(e) => setMouseOver(true)}
+            onMouseLeave={(e) => setMouseOver(false)}
           ></span>
         </CustomTooltip>
       </div>