From 6fc5b33dce93b64e1123805fede4e69f6dbca94d Mon Sep 17 00:00:00 2001
From: Alan Trebugeais <alan.trebugeais@epitech.eu>
Date: Thu, 7 May 2026 13:27:10 +0200
Subject: [PATCH] fix: webcam making the HUD not working properly fix: mouse
 events passthrough

---
 src/components/launch/LaunchWindow.tsx                     | 6 +++---
 src/components/launch/SourceSelector.tsx                   | 4 ++++
 .../launch/hooks/useLaunchHudInteractionState.ts           | 7 +++++--
 src/components/launch/popovers/PopoverScaffold.tsx         | 3 +++
 4 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/components/launch/LaunchWindow.tsx b/src/components/launch/LaunchWindow.tsx
index 38e672db..7bdac0a1 100644
--- a/src/components/launch/LaunchWindow.tsx
+++ b/src/components/launch/LaunchWindow.tsx
@@ -439,7 +439,7 @@ function LaunchWindowContent() {
 				className="flex items-center overflow-visible flex-col-reverse pointer-events-none"
 			>
 				<div
-					className="flex flex-col items-center pointer-events-auto"
+					className="flex flex-col items-center pointer-events-auto p-2"
 					onMouseEnter={handleHudMouseEnter}
 					onMouseLeave={handleHudMouseLeave}
 				>
@@ -519,12 +519,12 @@ function LaunchWindowContent() {
 							style={{
 								transform: `translate(${webcamPreviewOffset.x}px, ${webcamPreviewOffset.y}px)`,
 							}}
+							onMouseEnter={handleHudMouseEnter}
+							onMouseLeave={handleHudMouseLeave}
 							onPointerDown={handleWebcamPreviewPointerDown}
 							onPointerMove={handleWebcamPreviewPointerMove}
 							onPointerUp={handleWebcamPreviewPointerUp}
 							onPointerCancel={handleWebcamPreviewPointerUp}
-							onMouseEnter={handleHudMouseEnter}
-							onMouseLeave={handleHudMouseLeave}
 						>
 							<video
 								ref={setRecordingWebcamPreviewNode}
diff --git a/src/components/launch/SourceSelector.tsx b/src/components/launch/SourceSelector.tsx
index bd4e95ec..158b53e1 100644
--- a/src/components/launch/SourceSelector.tsx
+++ b/src/components/launch/SourceSelector.tsx
@@ -13,6 +13,7 @@ import {
 } from "./popovers/launchPopoverTypes";
 import "./launchTheme.css";
 import "./SourceSelector.css";
+import { useHudInteraction } from "./contexts/HudInteractionContext";
 
 interface SourceSelectorProps {
 	/** List of available screen sources */
@@ -341,6 +342,8 @@ export const SourceSelector = React.memo(function SourceSelector({
 		</Button>
 	);
 
+	const { onMouseEnter } = useHudInteraction();
+
 	return (
 		<Popover open={open} onOpenChange={onOpenChange} modal={false}>
 			<PopoverTrigger asChild>{trigger}</PopoverTrigger>
@@ -354,6 +357,7 @@ export const SourceSelector = React.memo(function SourceSelector({
 				avoidCollisions={true}
 				collisionPadding={10}
 				usePortal={false}
+				onMouseEnter={onMouseEnter}
 			>
 				<SourceSelectorContent
 					screenSources={screenSources}
diff --git a/src/components/launch/hooks/useLaunchHudInteractionState.ts b/src/components/launch/hooks/useLaunchHudInteractionState.ts
index ed6d9269..cd038ed0 100644
--- a/src/components/launch/hooks/useLaunchHudInteractionState.ts
+++ b/src/components/launch/hooks/useLaunchHudInteractionState.ts
@@ -21,7 +21,9 @@ export function useLaunchHudInteractionState({
 
 	useEffect(() => {
 		anyPopoverOpenRef.current = openId !== null;
-		if (openId === null) {
+		if (openId !== null) {
+			window.electronAPI?.hudOverlaySetIgnoreMouse?.(false);
+		} else {
 			// Proactively check if we should ignore mouse when popover closes
 			setTimeout(() => {
 				if (!isMouseOverHudRef.current && !anyPopoverOpenRef.current) {
@@ -71,7 +73,8 @@ export function useLaunchHudInteractionState({
 				!isWebcamPreviewDraggingRef.current &&
 				!webcamPreviewDragStartRef.current &&
 				!projectBrowserOpenRef.current &&
-				!isMouseOverHudRef.current
+				!isMouseOverHudRef.current &&
+				!anyPopoverOpenRef.current
 			) {
 				// If a popover is open, we can still ignore mouse if the mouse is truly gone,
 				// but we give a bit more breathing room (the 300ms timeout).
diff --git a/src/components/launch/popovers/PopoverScaffold.tsx b/src/components/launch/popovers/PopoverScaffold.tsx
index f05a80a8..856de855 100644
--- a/src/components/launch/popovers/PopoverScaffold.tsx
+++ b/src/components/launch/popovers/PopoverScaffold.tsx
@@ -6,6 +6,7 @@ import { AudioLevelMeter } from "@/components/ui/audio-level-meter";
 import styles from "../LaunchWindow.module.css";
 import "../launchTheme.css";
 import type { DeviceOption } from "./launchPopoverTypes";
+import { useHudInteraction } from "../contexts/HudInteractionContext";
 
 export function DropdownItem({
 	onClick,
@@ -73,6 +74,7 @@ export function HudPopover({
 	children: ReactNode;
 	align?: "start" | "center" | "end";
 }) {
+	const { onMouseEnter } = useHudInteraction();
 	return (
 		<Popover open={open} onOpenChange={onOpenChange} modal={false}>
 			<PopoverTrigger asChild>{trigger}</PopoverTrigger>
@@ -85,6 +87,7 @@ export function HudPopover({
 				avoidCollisions
 				collisionPadding={10}
 				usePortal={false}
+				onMouseEnter={onMouseEnter}
 			>
 				{children}
 			</PopoverContent>