add cursor style to FE icons

pull/4446/head
Joseph Izang 9 months ago
parent 1231606444
commit 00c8d063c1
  1. 14
      libs/remix-ui/workspace/src/lib/components/file-explorer-hovericons.tsx

@ -12,7 +12,7 @@ export type FileHoverIconsProps = {
} }
export function FileHoverIcons(props: FileHoverIconsProps) { export function FileHoverIcons(props: FileHoverIconsProps) {
const [mouseOver, setMouseOver] = useState(false)
return ( return (
<> <>
{<div className="d-flex flex-row align-items-center"> {<div className="d-flex flex-row align-items-center">
@ -32,6 +32,9 @@ export function FileHoverIcons(props: FileHoverIconsProps) {
e.stopPropagation() e.stopPropagation()
await props.handleNewFolderOp(props.file.path) await props.handleNewFolderOp(props.file.path)
}} }}
style={{ cursor: mouseOver ? 'pointer' : 'default' }}
onMouseEnter={(e) => setMouseOver(true)}
onMouseLeave={(e) => setMouseOver(false)}
></span> ></span>
</CustomTooltip> </CustomTooltip>
<CustomTooltip <CustomTooltip
@ -47,6 +50,9 @@ export function FileHoverIcons(props: FileHoverIconsProps) {
e.stopPropagation() e.stopPropagation()
await props.handleNewFileOp(props.file.path) await props.handleNewFileOp(props.file.path)
}} }}
style={{ cursor: mouseOver ? 'pointer' : 'default' }}
onMouseEnter={(e) => setMouseOver(true)}
onMouseLeave={(e) => setMouseOver(false)}
></span> ></span>
</CustomTooltip> </CustomTooltip>
</> </>
@ -65,6 +71,9 @@ export function FileHoverIcons(props: FileHoverIconsProps) {
e.stopPropagation() e.stopPropagation()
await props.renamePathOp(props.file.path, props.file.type) await props.renamePathOp(props.file.path, props.file.type)
}} }}
style={{ cursor: mouseOver ? 'pointer' : 'default' }}
onMouseEnter={(e) => setMouseOver(true)}
onMouseLeave={(e) => setMouseOver(false)}
></span> ></span>
</CustomTooltip> </CustomTooltip>
<CustomTooltip <CustomTooltip
@ -80,6 +89,9 @@ export function FileHoverIcons(props: FileHoverIconsProps) {
e.stopPropagation() e.stopPropagation()
await props.deletePathOp(props.file.path) await props.deletePathOp(props.file.path)
}} }}
style={{ cursor: mouseOver ? 'pointer' : 'default' }}
onMouseEnter={(e) => setMouseOver(true)}
onMouseLeave={(e) => setMouseOver(false)}
></span> ></span>
</CustomTooltip> </CustomTooltip>
</div> </div>

Loading…
Cancel
Save