diff --git a/front/src/modules/simulationResult/components/ManchetteWithSpaceTimeChart/ManchetteWithSpaceTimeChart.tsx b/front/src/modules/simulationResult/components/ManchetteWithSpaceTimeChart/ManchetteWithSpaceTimeChart.tsx
index 20c7fd78e8c..46ea0209a27 100644
--- a/front/src/modules/simulationResult/components/ManchetteWithSpaceTimeChart/ManchetteWithSpaceTimeChart.tsx
+++ b/front/src/modules/simulationResult/components/ManchetteWithSpaceTimeChart/ManchetteWithSpaceTimeChart.tsx
@@ -13,6 +13,7 @@ import {
import type { Conflict } from '@osrd-project/ui-spacetimechart';
import cx from 'classnames';
import { compact } from 'lodash';
+import { createPortal } from 'react-dom';
import type { OperationalPoint, TrainSpaceTimeData } from 'applications/operationalStudies/types';
import upward from 'assets/pictures/workSchedules/ScheduledMaintenanceUp.svg';
@@ -204,6 +205,20 @@ const ManchetteWithSpaceTimeChartWrapper = ({
return (
+ {waypointMenuData.activeWaypointId &&
+ manchetteWithSpaceTimeCharWrappertRef.current &&
+ createPortal(
+
,
+ manchetteWithSpaceTimeCharWrappertRef.current
+ )}
{waypointsPanelData && (
<>
diff --git a/front/src/modules/simulationResult/components/SpaceTimeChart/useWaypointMenu.tsx b/front/src/modules/simulationResult/components/SpaceTimeChart/useWaypointMenu.tsx
index 7ec188e7b65..728ca202b6f 100644
--- a/front/src/modules/simulationResult/components/SpaceTimeChart/useWaypointMenu.tsx
+++ b/front/src/modules/simulationResult/components/SpaceTimeChart/useWaypointMenu.tsx
@@ -18,7 +18,6 @@ const useWaypointMenu = (waypointsPanelData?: WaypointsPanelData) => {
const timetableId = useSelector(getTimetableID);
const [activeWaypointId, setActiveWaypointId] = useState();
- const [isClickOnWaypoint, setIsClickOnWaypoint] = useState(false);
const menuRef = useRef(null);
@@ -30,10 +29,6 @@ const useWaypointMenu = (waypointsPanelData?: WaypointsPanelData) => {
useEffect(() => {
const handleClickOutside = (event: MouseEvent) => {
- // Avoid closing the menu when clicking on another waypoint
- if (activeWaypointId && (event.target as HTMLElement).closest('.waypoint')) {
- setIsClickOnWaypoint(true);
- }
// Close the menu if the user clicks outside of it
if (!menuRef.current?.contains(event.target as Node)) {
closeMenu();
@@ -82,11 +77,6 @@ const useWaypointMenu = (waypointsPanelData?: WaypointsPanelData) => {
];
const handleWaypointClick = (id: string) => {
- // Avoid reopening the menu when clicking on another waypoint or on the same one
- if (isClickOnWaypoint) {
- setIsClickOnWaypoint(false);
- return;
- }
setActiveWaypointId(id);
};