fix: restore wrapper View for sidebar hover stability
The wrapper View with onPointerEnter/onPointerLeave is needed to keep hover state stable when the mouse moves from the row to the kebab dropdown (which opens in an overlay outside the Pressable). Without it, the Pressable fires onHoverOut and the kebab disappears. On native, isNative makes controls always-visible so this is web-only behavior which is correct (onPointerEnter works on web).
This commit is contained in:
@@ -851,6 +851,7 @@ function ProjectHeaderRow({
|
|||||||
|
|
||||||
if (menuController) {
|
if (menuController) {
|
||||||
return (
|
return (
|
||||||
|
<View onPointerEnter={() => setIsHovered(true)} onPointerLeave={() => setIsHovered(false)}>
|
||||||
<ContextMenuTrigger
|
<ContextMenuTrigger
|
||||||
enabledOnMobile={false}
|
enabledOnMobile={false}
|
||||||
style={({ pressed }) => [
|
style={({ pressed }) => [
|
||||||
@@ -860,8 +861,6 @@ function ProjectHeaderRow({
|
|||||||
isHovered && styles.projectRowHovered,
|
isHovered && styles.projectRowHovered,
|
||||||
pressed && styles.projectRowPressed,
|
pressed && styles.projectRowPressed,
|
||||||
]}
|
]}
|
||||||
onHoverIn={() => setIsHovered(true)}
|
|
||||||
onHoverOut={() => setIsHovered(false)}
|
|
||||||
onPressIn={interaction.handlePressIn}
|
onPressIn={interaction.handlePressIn}
|
||||||
onTouchMove={interaction.handleTouchMove}
|
onTouchMove={interaction.handleTouchMove}
|
||||||
onPressOut={interaction.handlePressOut}
|
onPressOut={interaction.handlePressOut}
|
||||||
@@ -870,10 +869,12 @@ function ProjectHeaderRow({
|
|||||||
>
|
>
|
||||||
{rowChildren}
|
{rowChildren}
|
||||||
</ContextMenuTrigger>
|
</ContextMenuTrigger>
|
||||||
|
</View>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
<View onPointerEnter={() => setIsHovered(true)} onPointerLeave={() => setIsHovered(false)}>
|
||||||
<Pressable
|
<Pressable
|
||||||
style={({ pressed }) => [
|
style={({ pressed }) => [
|
||||||
styles.projectRow,
|
styles.projectRow,
|
||||||
@@ -882,8 +883,6 @@ function ProjectHeaderRow({
|
|||||||
isHovered && styles.projectRowHovered,
|
isHovered && styles.projectRowHovered,
|
||||||
pressed && styles.projectRowPressed,
|
pressed && styles.projectRowPressed,
|
||||||
]}
|
]}
|
||||||
onHoverIn={() => setIsHovered(true)}
|
|
||||||
onHoverOut={() => setIsHovered(false)}
|
|
||||||
onPressIn={interaction.handlePressIn}
|
onPressIn={interaction.handlePressIn}
|
||||||
onTouchMove={interaction.handleTouchMove}
|
onTouchMove={interaction.handleTouchMove}
|
||||||
onPressOut={interaction.handlePressOut}
|
onPressOut={interaction.handlePressOut}
|
||||||
@@ -892,6 +891,7 @@ function ProjectHeaderRow({
|
|||||||
>
|
>
|
||||||
{rowChildren}
|
{rowChildren}
|
||||||
</Pressable>
|
</Pressable>
|
||||||
|
</View>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -937,18 +937,20 @@ function WorkspaceRowInner({
|
|||||||
}, [interaction.didLongPressRef, onPress]);
|
}, [interaction.didLongPressRef, onPress]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
<View
|
||||||
|
style={styles.workspaceRowContainer}
|
||||||
|
onPointerEnter={() => setIsHovered(true)}
|
||||||
|
onPointerLeave={() => setIsHovered(false)}
|
||||||
|
>
|
||||||
<Pressable
|
<Pressable
|
||||||
disabled={isArchiving}
|
disabled={isArchiving}
|
||||||
style={({ pressed }) => [
|
style={({ pressed }) => [
|
||||||
styles.workspaceRowContainer,
|
|
||||||
styles.workspaceRow,
|
styles.workspaceRow,
|
||||||
isDragging && styles.workspaceRowDragging,
|
isDragging && styles.workspaceRowDragging,
|
||||||
selected && styles.sidebarRowSelected,
|
selected && styles.sidebarRowSelected,
|
||||||
isHovered && styles.workspaceRowHovered,
|
isHovered && styles.workspaceRowHovered,
|
||||||
pressed && styles.workspaceRowPressed,
|
pressed && styles.workspaceRowPressed,
|
||||||
]}
|
]}
|
||||||
onHoverIn={() => setIsHovered(true)}
|
|
||||||
onHoverOut={() => setIsHovered(false)}
|
|
||||||
onPressIn={interaction.handlePressIn}
|
onPressIn={interaction.handlePressIn}
|
||||||
onTouchMove={interaction.handleTouchMove}
|
onTouchMove={interaction.handleTouchMove}
|
||||||
onPressOut={interaction.handlePressOut}
|
onPressOut={interaction.handlePressOut}
|
||||||
@@ -1049,6 +1051,7 @@ function WorkspaceRowInner({
|
|||||||
</View>
|
</View>
|
||||||
) : null}
|
) : null}
|
||||||
</Pressable>
|
</Pressable>
|
||||||
|
</View>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user