From 6671ed07bbc3cd141917df0423dda70e61d52041 Mon Sep 17 00:00:00 2001 From: Pierre-Charles David Date: Mon, 5 Feb 2024 15:57:16 +0100 Subject: [PATCH] [3030] Fix palette position when multiple diagrams are open Bug: https://github.com/eclipse-sirius/sirius-web/issues/3030 Signed-off-by: Pierre-Charles David --- CHANGELOG.adoc | 1 + .../src/renderer/palette/PalettePortal.tsx | 3 ++- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.adoc b/CHANGELOG.adoc index e4078d1d0c..0eccf8bc02 100644 --- a/CHANGELOG.adoc +++ b/CHANGELOG.adoc @@ -40,6 +40,7 @@ As a result, all the APIs relying on this code have been deleted too such as the - https://github.com/eclipse-sirius/sirius-web/issues/2822[#2822] [diagram] Prevent direct edit to be triggered on edge if there is no edit label tool corresponding - https://github.com/eclipse-sirius/sirius-web/issues/3061[#3061] [form] Ensure Forms are always refreshed using the _current_ version of their target element - https://github.com/eclipse-sirius/sirius-web/issues/3052[#3052] [diagram] Fix an issue that prevented user from reconnecting an edge. +- https://github.com/eclipse-sirius/sirius-web/issues/3030[#3030] [diagram] Fix the position of the palette when multiple diagrams are open at the same time (e.g. inside a portal) === New Features diff --git a/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/palette/PalettePortal.tsx b/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/palette/PalettePortal.tsx index 216b7f79e3..c58ad0955f 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/palette/PalettePortal.tsx +++ b/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/palette/PalettePortal.tsx @@ -12,6 +12,7 @@ *******************************************************************************/ import { createPortal } from 'react-dom'; +import { useStoreApi } from 'reactflow'; import { PalettePortalProps } from './PalettePortal.types'; //The sibling dom element .react-flow__renderer have a zIndex of 4, so we set it here to 5 to have the palette in front of the diagram. @@ -21,7 +22,7 @@ const palettePortalStyle: React.CSSProperties = { }; export const PalettePortal = ({ children }: PalettePortalProps) => { - const wrapperRef = document.querySelector('.react-flow'); + const wrapperRef = useStoreApi().getState().domNode; if (!wrapperRef) { return null;