From d13cbd582c0cc27a2421703fc8de92270605af2c Mon Sep 17 00:00:00 2001 From: Lukasz Modzelewski Date: Tue, 5 May 2026 11:50:44 +0200 Subject: [PATCH 1/5] perf: lazy-mount MiniReportActionContextMenu on first hover --- src/pages/inbox/report/PureReportActionItem.tsx | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/pages/inbox/report/PureReportActionItem.tsx b/src/pages/inbox/report/PureReportActionItem.tsx index 439341c49600..a778193f3a7e 100644 --- a/src/pages/inbox/report/PureReportActionItem.tsx +++ b/src/pages/inbox/report/PureReportActionItem.tsx @@ -342,6 +342,7 @@ function PureReportActionItem({ const prevDraftMessage = usePrevious(draftMessage); const isReportActionLinked = linkedReportActionID && action.reportActionID && linkedReportActionID === action.reportActionID; const [isReportActionActive, setIsReportActionActive] = useState(!!isReportActionLinked); + const [hasEverHovered, setHasEverHovered] = useState(false); const isReportArchived = useReportIsArchived(reportID); const isHarvestCreatedExpenseReport = isHarvestCreatedExpenseReportUtils(reportNameValuePairsOrigin, reportNameValuePairsOriginalID); @@ -1086,6 +1087,7 @@ function PureReportActionItem({ } const hasErrors = !isEmptyValueObject(action.errors); + const canShowMenu = draftMessage === undefined && !hasErrors; const whisperedTo = getWhisperedTo(action); const iouReportID = isMoneyRequestAction(action) && getOriginalMessage(action)?.IOUReportID ? getOriginalMessage(action)?.IOUReportID?.toString() : undefined; @@ -1129,6 +1131,7 @@ function PureReportActionItem({ shouldFreezeCapture={isPaymentMethodPopoverActive} onHoverIn={() => { setIsReportActionActive(false); + setHasEverHovered(true); }} onHoverOut={() => { setIsReportActionActive(!!isReportActionLinked); @@ -1137,7 +1140,7 @@ function PureReportActionItem({ {(hovered) => ( {shouldDisplayNewMarker && (!shouldUseThreadDividerLine || !isFirstVisibleReportAction) && } - {shouldDisplayContextMenuValue && ( + {shouldDisplayContextMenuValue && hasEverHovered && canShowMenu && ( Date: Tue, 5 May 2026 15:25:02 +0200 Subject: [PATCH 2/5] remove setHasEverHovered --- src/pages/inbox/report/PureReportActionItem.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/pages/inbox/report/PureReportActionItem.tsx b/src/pages/inbox/report/PureReportActionItem.tsx index a778193f3a7e..41371e66f22e 100644 --- a/src/pages/inbox/report/PureReportActionItem.tsx +++ b/src/pages/inbox/report/PureReportActionItem.tsx @@ -342,7 +342,6 @@ function PureReportActionItem({ const prevDraftMessage = usePrevious(draftMessage); const isReportActionLinked = linkedReportActionID && action.reportActionID && linkedReportActionID === action.reportActionID; const [isReportActionActive, setIsReportActionActive] = useState(!!isReportActionLinked); - const [hasEverHovered, setHasEverHovered] = useState(false); const isReportArchived = useReportIsArchived(reportID); const isHarvestCreatedExpenseReport = isHarvestCreatedExpenseReportUtils(reportNameValuePairsOrigin, reportNameValuePairsOriginalID); @@ -1131,7 +1130,6 @@ function PureReportActionItem({ shouldFreezeCapture={isPaymentMethodPopoverActive} onHoverIn={() => { setIsReportActionActive(false); - setHasEverHovered(true); }} onHoverOut={() => { setIsReportActionActive(!!isReportActionLinked); @@ -1140,7 +1138,7 @@ function PureReportActionItem({ {(hovered) => ( {shouldDisplayNewMarker && (!shouldUseThreadDividerLine || !isFirstVisibleReportAction) && } - {shouldDisplayContextMenuValue && hasEverHovered && canShowMenu && ( + {shouldDisplayContextMenuValue && hovered && canShowMenu && ( Date: Tue, 5 May 2026 15:30:17 +0200 Subject: [PATCH 3/5] clean isVisible prop --- src/pages/inbox/report/PureReportActionItem.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/inbox/report/PureReportActionItem.tsx b/src/pages/inbox/report/PureReportActionItem.tsx index 41371e66f22e..169723452aa1 100644 --- a/src/pages/inbox/report/PureReportActionItem.tsx +++ b/src/pages/inbox/report/PureReportActionItem.tsx @@ -1147,7 +1147,7 @@ function PureReportActionItem({ isArchivedRoom={isArchivedRoom} displayAsGroup={displayAsGroup} disabledActions={disabledActions} - isVisible={hovered && canShowMenu} + isVisible isThreadReportParentAction={isThreadReportParentAction} draftMessage={draftMessage} isChronosReport={isChronosReport} From 743fecc2b7fcb7eed33da0dd4d650e8818de1f1f Mon Sep 17 00:00:00 2001 From: Lukasz Modzelewski Date: Tue, 5 May 2026 15:43:25 +0200 Subject: [PATCH 4/5] remove canShowMenu --- src/pages/inbox/report/PureReportActionItem.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/pages/inbox/report/PureReportActionItem.tsx b/src/pages/inbox/report/PureReportActionItem.tsx index 169723452aa1..28d02286b131 100644 --- a/src/pages/inbox/report/PureReportActionItem.tsx +++ b/src/pages/inbox/report/PureReportActionItem.tsx @@ -1086,7 +1086,6 @@ function PureReportActionItem({ } const hasErrors = !isEmptyValueObject(action.errors); - const canShowMenu = draftMessage === undefined && !hasErrors; const whisperedTo = getWhisperedTo(action); const iouReportID = isMoneyRequestAction(action) && getOriginalMessage(action)?.IOUReportID ? getOriginalMessage(action)?.IOUReportID?.toString() : undefined; @@ -1138,7 +1137,7 @@ function PureReportActionItem({ {(hovered) => ( {shouldDisplayNewMarker && (!shouldUseThreadDividerLine || !isFirstVisibleReportAction) && } - {shouldDisplayContextMenuValue && hovered && canShowMenu && ( + {shouldDisplayContextMenuValue && hovered && draftMessage === undefined && !hasErrors && ( Date: Thu, 7 May 2026 11:12:18 +0200 Subject: [PATCH 5/5] dont close MiniReportActionContextMenu when picker or context is active --- src/pages/inbox/report/PureReportActionItem.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/inbox/report/PureReportActionItem.tsx b/src/pages/inbox/report/PureReportActionItem.tsx index 28d02286b131..eafdace018d1 100644 --- a/src/pages/inbox/report/PureReportActionItem.tsx +++ b/src/pages/inbox/report/PureReportActionItem.tsx @@ -1137,7 +1137,7 @@ function PureReportActionItem({ {(hovered) => ( {shouldDisplayNewMarker && (!shouldUseThreadDividerLine || !isFirstVisibleReportAction) && } - {shouldDisplayContextMenuValue && hovered && draftMessage === undefined && !hasErrors && ( + {shouldDisplayContextMenuValue && (hovered || !!isEmojiPickerActive || isContextMenuActive) && draftMessage === undefined && !hasErrors && (