diff --git a/CHANGELOG.adoc b/CHANGELOG.adoc index 91340e15b4..0bc090af2d 100644 --- a/CHANGELOG.adoc +++ b/CHANGELOG.adoc @@ -40,6 +40,7 @@ This may have some consequences for downstream applications which are embedding - https://github.com/eclipse-sirius/sirius-web/issues/4282[#4282] [diagram] Fixed a warning on the frontend about non-unique GraphQL fragment name - https://github.com/eclipse-sirius/sirius-web/issues/4398[#4398] [sirius-web] Fix an issue where the swagger page listing all REST APIs (YOUR_SERVER/swagger-ui/index.html) and the OpenAPI file (YOUR_SERVER/v3/api-docs/rest-apis) were not accessible anymore. +- https://github.com/eclipse-sirius/sirius-web/issues/4285[#4285] [diagram] Fix direct edit after closing the palette === New Features diff --git a/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/delete/useDiagramDelete.tsx b/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/delete/useDiagramDelete.tsx index 8c4b0e57d9..ce793c5d2e 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/delete/useDiagramDelete.tsx +++ b/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/delete/useDiagramDelete.tsx @@ -1,5 +1,5 @@ /******************************************************************************* - * Copyright (c) 2023, 2024 Obeo. + * Copyright (c) 2023, 2025 Obeo. * This program and the accompanying materials * are made available under the terms of the Eclipse Public License v2.0 * which accompanies this distribution, and is available at @@ -57,7 +57,7 @@ export const useDiagramDelete = (): UseDiagramDeleteValue => { const { addErrorMessage, addMessages } = useMultiToast(); const { showDeletionConfirmation } = useDeletionConfirmationDialog(); const { diagramId, editingContextId, readOnly } = useContext(DiagramContext); - const { getNodes } = useReactFlow, Edge>(); + const { getNodes, getEdges } = useReactFlow, Edge>(); const [deleteElementsMutation, { data: deleteElementsData, error: deleteElementsError }] = useMutation< GQLDeleteFromDiagramData, @@ -78,23 +78,28 @@ export const useDiagramDelete = (): UseDiagramDeleteValue => { const onDelete = useCallback((event: React.KeyboardEvent) => { const { key } = event; - /*If a modifier key is hit alone, do nothing*/ const isTextField = event.target instanceof HTMLInputElement || event.target instanceof HTMLTextAreaElement; - if ((event.altKey && key === 'Alt') || (event.shiftKey && key === 'Shift') || isTextField) { + + /*If a modifier key is hit alone, do nothing*/ + if ((event.altKey && key === 'Alt') || (event.shiftKey && key === 'Shift') || isTextField || readOnly) { return; } - event.preventDefault(); if (key === 'Delete' && editingContextId && diagramId && !readOnly) { const nodeToDeleteIds: string[] = getNodes() .filter((node) => node.selected) .map((node) => node.id); + + const edgesToDeleteIds: string[] = getEdges() + .filter((edge) => edge.selected) + .map((edge) => edge.id); + const input: GQLDeleteFromDiagramInput = { id: crypto.randomUUID(), editingContextId, representationId: diagramId, nodeIds: nodeToDeleteIds, - edgeIds: [], + edgeIds: edgesToDeleteIds, deletionPolicy: GQLDeletionPolicy.SEMANTIC, }; showDeletionConfirmation(() => { diff --git a/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/direct-edit/useDiagramDirectEdit.tsx b/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/direct-edit/useDiagramDirectEdit.tsx index c95f9981a7..9f43e3fb6b 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/direct-edit/useDiagramDirectEdit.tsx +++ b/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/direct-edit/useDiagramDirectEdit.tsx @@ -1,5 +1,5 @@ /******************************************************************************* - * Copyright (c) 2023, 2024 Obeo. + * Copyright (c) 2023, 2025 Obeo. * This program and the accompanying materials * are made available under the terms of the Eclipse Public License v2.0 * which accompanies this distribution, and is available at @@ -30,19 +30,25 @@ export const useDiagramDirectEdit = (): UseDiagramDirectEditValue => { const onDirectEdit = useCallback( (event: React.KeyboardEvent) => { const { key } = event; - /*If a modifier key is hit alone, do nothing*/ + const isTextField = event.target instanceof HTMLInputElement || event.target instanceof HTMLTextAreaElement; - if ((event.altKey && key === 'Alt') || (event.shiftKey && key === 'Shift') || isTextField || readOnly) { + + /*If a modifier key is hit alone, do nothing*/ + if ((event.altKey && key === 'Alt') || (event.shiftKey && key === 'Shift') || readOnly) { + return; + } + + if (key !== 'F2' && isTextField) { return; } - event.preventDefault(); const validFirstInputChar = !event.metaKey && !event.ctrlKey && key.length === 1 && directEditActivationValidCharacters.test(key); let currentlyEditedLabelId: string | undefined | null; let isLabelEditable: boolean = false; const nodeData: NodeData | undefined = getNodes().find((node) => node.selected)?.data; + if (nodeData) { if (nodeData.insideLabel) { currentlyEditedLabelId = nodeData.insideLabel.id; @@ -51,6 +57,7 @@ export const useDiagramDirectEdit = (): UseDiagramDirectEditValue => { } isLabelEditable = nodeData.labelEditable; } + if (!currentlyEditedLabelId) { currentlyEditedLabelId = getEdges().find((edge) => edge.selected)?.data?.label?.id; isLabelEditable = getEdges().find((edge) => edge.selected)?.data?.centerLabelEditable || false; diff --git a/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/edge/MultiLabelEdge.tsx b/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/edge/MultiLabelEdge.tsx index f9fd234a3a..edc4258b96 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/edge/MultiLabelEdge.tsx +++ b/packages/diagrams/frontend/sirius-components-diagrams/src/renderer/edge/MultiLabelEdge.tsx @@ -1,5 +1,5 @@ /******************************************************************************* - * Copyright (c) 2024 Obeo. + * Copyright (c) 2024, 2025 Obeo. * This program and the accompanying materials * are made available under the terms of the Eclipse Public License v2.0 * which accompanies this distribution, and is available at @@ -94,14 +94,14 @@ export const MultiLabelEdge = memo( markerEnd={selected ? `${markerEnd?.slice(0, markerEnd.length - 2)}--selected')` : markerEnd} markerStart={selected ? `${markerStart?.slice(0, markerStart.length - 2)}--selected')` : markerStart} /> - {selected ? ( - - ) : null} + {selected ? ( + + ) : null} {beginLabel && (