From 86f0c9d0caa2117392e83a188b429f68486e912f Mon Sep 17 00:00:00 2001 From: Guillaume Coutable Date: Mon, 8 Jan 2024 16:26:39 +0100 Subject: [PATCH] [2883] Store in node layout data if a user has resized the node Bug: https://github.com/eclipse-sirius/sirius-web/issues/2883 Signed-off-by: Guillaume Coutable --- CHANGELOG.adoc | 5 ++ .../diagrams/DiagramEventProcessor.java | 4 +- .../diagrams/dto/NodeLayoutDataInput.java | 4 +- .../main/resources/schema/diagram.graphqls | 3 ++ .../diagram/NodeResizedByUserDataFetcher.java | 54 +++++++++++++++++++ .../experimental/DiagramLayoutEngine.java | 4 +- .../diagrams/layoutdata/NodeLayoutData.java | 5 +- .../IconLabelNodeConverterHandler.ts | 2 + .../converter/ImageNodeConverterHandler.ts | 2 + .../src/converter/ListNodeConverterHandler.ts | 2 + .../RectangleNodeConverterHandler.ts | 2 + .../src/graphql/subscription/nodeFragment.ts | 1 + .../subscription/nodeFragment.types.ts | 1 + .../src/renderer/DiagramRenderer.types.ts | 1 + .../layout-events/useLayoutOnBoundsChange.ts | 36 ++++++++++--- .../renderer/layout/ImageNodeLayoutHandler.ts | 4 +- .../renderer/layout/ListNodeLayoutHandler.ts | 7 ++- .../layout/RectangleNodeLayoutHandler.ts | 4 +- .../layout/useSynchronizeLayoutData.ts | 4 +- .../layout/useSynchronizeLayoutData.types.ts | 3 +- .../src/renderer/node/ImageNode.tsx | 16 +++--- .../sirius-web/src/nodes/EllipseNode.tsx | 16 +++--- .../src/nodes/EllipseNodeConverterHandler.ts | 2 + .../src/nodes/EllipseNodeLayoutHandler.ts | 4 +- 24 files changed, 144 insertions(+), 42 deletions(-) create mode 100644 packages/diagrams/backend/sirius-components-diagrams-graphql/src/main/java/org/eclipse/sirius/components/diagrams/graphql/datafetchers/diagram/NodeResizedByUserDataFetcher.java diff --git a/CHANGELOG.adoc b/CHANGELOG.adoc index 3de28ea5ad5..b2a9e9c7421 100644 --- a/CHANGELOG.adoc +++ b/CHANGELOG.adoc @@ -71,6 +71,7 @@ const nodeTypeRegistry: NodeTypeRegistry = { ``` - https://github.com/eclipse-sirius/sirius-web/issues/2790[#2790] [diagram] All handles used to resize a node have been updated to be wider, you can update your custom nodes in the same way it's done in the EllipseNode example. +- https://github.com/eclipse-sirius/sirius-web/issues/2883[#2883] [diagram] Add the attribute `resizedByUser` to reactflow nodes and graphql nodes. === Dependency update @@ -88,6 +89,7 @@ const nodeTypeRegistry: NodeTypeRegistry = { - https://github.com/eclipse-sirius/sirius-web/issues/2826[#2826] [diagram] Fix invalid reference position used for nodes with a depth superior to 2. === New Features + - https://github.com/eclipse-sirius/sirius-web/issues/2413[#2413] Add a debug mode for React Flow diagrams - https://github.com/eclipse-sirius/sirius-web/issues/2735[#2735] [gantt] Contribute the first version of the Gantt representation. @@ -96,6 +98,9 @@ const nodeTypeRegistry: NodeTypeRegistry = { - https://github.com/eclipse-sirius/sirius-web/issues/2736[#2736] [gantt] Add a starter project for beans related to task meta-model. - https://github.com/eclipse-sirius/sirius-web/issues/2819[#2819] [deck] Contribute the first version of the Deck representation. - https://github.com/eclipse-sirius/sirius-web/issues/2765[#2765] [portal] Contribute the first version of the Portal representation. +- https://github.com/eclipse-sirius/sirius-web/issues/2883[#2883] [diagram] The size of manually resized node does not change anymore, unless it needs to. ++ +The size of nodes that do not have been resized manually tries to fit the node default size. === Improvements diff --git a/packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/DiagramEventProcessor.java b/packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/DiagramEventProcessor.java index c06af4b67ed..d436fbbde60 100644 --- a/packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/DiagramEventProcessor.java +++ b/packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/DiagramEventProcessor.java @@ -1,5 +1,5 @@ /******************************************************************************* - * Copyright (c) 2019, 2023 Obeo. + * Copyright (c) 2019, 2024 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 @@ -132,7 +132,7 @@ public void handle(One payloadSink, Many changeDesc var nodeLayoutData = layoutDiagramInput.diagramLayoutData().nodeLayoutData().stream() .collect(Collectors.toMap( NodeLayoutDataInput::id, - nodeLayoutDataInput -> new NodeLayoutData(nodeLayoutDataInput.id(), nodeLayoutDataInput.position(), nodeLayoutDataInput.size()) + nodeLayoutDataInput -> new NodeLayoutData(nodeLayoutDataInput.id(), nodeLayoutDataInput.position(), nodeLayoutDataInput.size(), nodeLayoutDataInput.resizedByUser()) )); var layoutData = new DiagramLayoutData(nodeLayoutData, Map.of(), Map.of()); diff --git a/packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/dto/NodeLayoutDataInput.java b/packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/dto/NodeLayoutDataInput.java index ed6899b274e..26fd4b4de5e 100644 --- a/packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/dto/NodeLayoutDataInput.java +++ b/packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/dto/NodeLayoutDataInput.java @@ -1,5 +1,5 @@ /******************************************************************************* - * Copyright (c) 2023 Obeo. + * Copyright (c) 2023, 2024 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 @@ -20,5 +20,5 @@ * * @author sbegaudeau */ -public record NodeLayoutDataInput(String id, Position position, Size size) { +public record NodeLayoutDataInput(String id, Position position, Size size, boolean resizedByUser) { } diff --git a/packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/resources/schema/diagram.graphqls b/packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/resources/schema/diagram.graphqls index 47dda9436d5..d1bfbd22bfc 100644 --- a/packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/resources/schema/diagram.graphqls +++ b/packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/resources/schema/diagram.graphqls @@ -49,6 +49,7 @@ type NodeLayoutData { id: ID! position: Position! size: Size! + resizedByUser: Boolean! } enum ViewModifier { @@ -77,6 +78,7 @@ type Node { defaultWidth: Int defaultHeight: Int labelEditable: Boolean! + resizedByUser: Boolean! } type FreeFormLayoutStrategy { @@ -590,6 +592,7 @@ input NodeLayoutDataInput { id: ID! position: PositionInput! size: SizeInput! + resizedByUser: Boolean! } input SizeInput { diff --git a/packages/diagrams/backend/sirius-components-diagrams-graphql/src/main/java/org/eclipse/sirius/components/diagrams/graphql/datafetchers/diagram/NodeResizedByUserDataFetcher.java b/packages/diagrams/backend/sirius-components-diagrams-graphql/src/main/java/org/eclipse/sirius/components/diagrams/graphql/datafetchers/diagram/NodeResizedByUserDataFetcher.java new file mode 100644 index 00000000000..520e7079ee5 --- /dev/null +++ b/packages/diagrams/backend/sirius-components-diagrams-graphql/src/main/java/org/eclipse/sirius/components/diagrams/graphql/datafetchers/diagram/NodeResizedByUserDataFetcher.java @@ -0,0 +1,54 @@ +/******************************************************************************* + * Copyright (c) 2024 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 + * https://www.eclipse.org/legal/epl-2.0/ + * + * SPDX-License-Identifier: EPL-2.0 + * + * Contributors: + * Obeo - initial API and implementation + *******************************************************************************/ + +package org.eclipse.sirius.components.diagrams.graphql.datafetchers.diagram; + +import java.util.Map; +import java.util.Optional; + +import org.eclipse.sirius.components.annotations.spring.graphql.QueryDataFetcher; +import org.eclipse.sirius.components.diagrams.Diagram; +import org.eclipse.sirius.components.diagrams.Node; +import org.eclipse.sirius.components.diagrams.layoutdata.DiagramLayoutData; +import org.eclipse.sirius.components.diagrams.layoutdata.NodeLayoutData; +import org.eclipse.sirius.components.graphql.api.IDataFetcherWithFieldCoordinates; + +import graphql.schema.DataFetchingEnvironment; + +/** + * Used to retrieve the resized by user from diagram layout data. + * + * @author gcoutable + */ +@QueryDataFetcher(type = "Node", field = "resizedByUser") +public class NodeResizedByUserDataFetcher implements IDataFetcherWithFieldCoordinates { + + @Override + public Boolean get(DataFetchingEnvironment environment) throws Exception { + Node node = environment.getSource(); + Map localContext = environment.getLocalContext(); + + return Optional.ofNullable(localContext.get("diagram")) + .filter(Diagram.class::isInstance) + .map(Diagram.class::cast) + .flatMap(diagram -> this.resizedByUser(diagram, node)) + .orElse(false); + } + + private Optional resizedByUser(Diagram diagram, Node node) { + return Optional.of(diagram.getLayoutData()) + .map(DiagramLayoutData::nodeLayoutData) + .map(layoutData -> layoutData.get(node.getId())) + .map(NodeLayoutData::resizedByUser); + } +} diff --git a/packages/diagrams/backend/sirius-components-diagrams-layout/src/main/java/org/eclipse/sirius/components/diagrams/layout/experimental/DiagramLayoutEngine.java b/packages/diagrams/backend/sirius-components-diagrams-layout/src/main/java/org/eclipse/sirius/components/diagrams/layout/experimental/DiagramLayoutEngine.java index 32faa53b77e..52324de40b9 100644 --- a/packages/diagrams/backend/sirius-components-diagrams-layout/src/main/java/org/eclipse/sirius/components/diagrams/layout/experimental/DiagramLayoutEngine.java +++ b/packages/diagrams/backend/sirius-components-diagrams-layout/src/main/java/org/eclipse/sirius/components/diagrams/layout/experimental/DiagramLayoutEngine.java @@ -1,5 +1,5 @@ /******************************************************************************* - * Copyright (c) 2023 Obeo. + * Copyright (c) 2023, 2024 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 @@ -67,7 +67,7 @@ public DiagramLayoutData layout(DiagramLayoutConfiguration diagramLayoutConfigur } Map newNodeLayoutData = new HashMap<>(); - diagramBoxModel.nodeBoxModels().forEach((nodeId, nodeBoxModel) -> newNodeLayoutData.put(nodeId, new NodeLayoutData(nodeId, nodeBoxModel.bounds().topLeft(), nodeBoxModel.bounds().size()))); + diagramBoxModel.nodeBoxModels().forEach((nodeId, nodeBoxModel) -> newNodeLayoutData.put(nodeId, new NodeLayoutData(nodeId, nodeBoxModel.bounds().topLeft(), nodeBoxModel.bounds().size(), false))); return new DiagramLayoutData(newNodeLayoutData, Map.of(), Map.of()); } diff --git a/packages/diagrams/backend/sirius-components-diagrams/src/main/java/org/eclipse/sirius/components/diagrams/layoutdata/NodeLayoutData.java b/packages/diagrams/backend/sirius-components-diagrams/src/main/java/org/eclipse/sirius/components/diagrams/layoutdata/NodeLayoutData.java index 23edb1e4362..4fbe24b8405 100644 --- a/packages/diagrams/backend/sirius-components-diagrams/src/main/java/org/eclipse/sirius/components/diagrams/layoutdata/NodeLayoutData.java +++ b/packages/diagrams/backend/sirius-components-diagrams/src/main/java/org/eclipse/sirius/components/diagrams/layoutdata/NodeLayoutData.java @@ -1,5 +1,5 @@ /******************************************************************************* - * Copyright (c) 2023 Obeo. + * Copyright (c) 2023, 2024 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 @@ -20,6 +20,7 @@ public record NodeLayoutData( String id, Position position, - Size size + Size size, + boolean resizedByUser ) { } diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/IconLabelNodeConverterHandler.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/IconLabelNodeConverterHandler.ts index a9275d20dd2..46bff097102 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/IconLabelNodeConverterHandler.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/IconLabelNodeConverterHandler.ts @@ -46,6 +46,7 @@ const toIconLabelNode = ( state, style, labelEditable, + resizedByUser, } = gqlNode; const connectionHandles: ConnectionHandle[] = []; @@ -71,6 +72,7 @@ const toIconLabelNode = ( labelEditable: labelEditable, connectionHandles, isNew, + resizedByUser, }; if (insideLabel) { diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ImageNodeConverterHandler.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ImageNodeConverterHandler.ts index a9c5a34be20..a70ca73b8c2 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ImageNodeConverterHandler.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ImageNodeConverterHandler.ts @@ -44,6 +44,7 @@ const toImageNode = ( state, style, labelEditable, + resizedByUser, } = gqlNode; const connectionHandles: ConnectionHandle[] = convertHandles(gqlNode, gqlEdges); @@ -68,6 +69,7 @@ const toImageNode = ( positionDependentRotation: style.positionDependentRotation, connectionHandles, isNew, + resizedByUser, }; if (insideLabel) { diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ListNodeConverterHandler.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ListNodeConverterHandler.ts index 988e12ff0d7..14b200cf101 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ListNodeConverterHandler.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ListNodeConverterHandler.ts @@ -54,6 +54,7 @@ const toListNode = ( state, style, labelEditable, + resizedByUser, } = gqlNode; const connectionHandles: ConnectionHandle[] = convertHandles(gqlNode, gqlEdges); @@ -91,6 +92,7 @@ const toListNode = ( areChildNodesDraggable: isListLayoutStrategy(gqlNode.childrenLayoutStrategy) ? gqlNode.childrenLayoutStrategy.areChildNodesDraggable : true, + resizedByUser, }; if (insideLabel) { diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/RectangleNodeConverterHandler.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/RectangleNodeConverterHandler.ts index 8e9c42d9b81..237de4301fd 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/RectangleNodeConverterHandler.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/RectangleNodeConverterHandler.ts @@ -50,6 +50,7 @@ const toRectangularNode = ( state, style, labelEditable, + resizedByUser, } = gqlNode; const connectionHandles: ConnectionHandle[] = convertHandles(gqlNode, gqlEdges); @@ -79,6 +80,7 @@ const toRectangularNode = ( labelEditable, connectionHandles, isNew, + resizedByUser, }; if (insideLabel) { diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/graphql/subscription/nodeFragment.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/graphql/subscription/nodeFragment.ts index 2d969ce8212..6d08cf35089 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/graphql/subscription/nodeFragment.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/graphql/subscription/nodeFragment.ts @@ -69,5 +69,6 @@ fragment nodeFragment on Node { defaultWidth defaultHeight labelEditable + resizedByUser } `; diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/graphql/subscription/nodeFragment.types.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/graphql/subscription/nodeFragment.types.ts index c45f4cfc140..8d2f7d90a05 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/graphql/subscription/nodeFragment.types.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/graphql/subscription/nodeFragment.types.ts @@ -31,6 +31,7 @@ export interface GQLNode { defaultWidth: number | null; defaultHeight: number | null; labelEditable: boolean; + resizedByUser: boolean; } export interface ILayoutStrategy { diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/DiagramRenderer.types.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/DiagramRenderer.types.ts index 773337f87a6..37b883f4693 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/DiagramRenderer.types.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/DiagramRenderer.types.ts @@ -62,6 +62,7 @@ export interface NodeData { style: React.CSSProperties; connectionHandles: ConnectionHandle[]; isNew: boolean; + resizedByUser: boolean; } export enum BorderNodePosition { diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout-events/useLayoutOnBoundsChange.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout-events/useLayoutOnBoundsChange.ts index 83af3e2d038..22dce3f8752 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout-events/useLayoutOnBoundsChange.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout-events/useLayoutOnBoundsChange.ts @@ -1,5 +1,5 @@ /******************************************************************************* - * Copyright (c) 2023 Obeo. + * Copyright (c) 2023, 2024 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 @@ -11,7 +11,7 @@ * Obeo - initial API and implementation *******************************************************************************/ -import { Node, NodeChange, useReactFlow } from 'reactflow'; +import { Node, NodeChange, NodeDimensionChange, NodePositionChange, useReactFlow } from 'reactflow'; import { EdgeData, NodeData } from '../DiagramRenderer.types'; import { useDropNode } from '../dropNode/useDropNode'; import { RawDiagram } from '../layout/layout.types'; @@ -26,7 +26,7 @@ export const useLayoutOnBoundsChange = (refreshEventPayloadId: string): UseLayou const { hasDroppedNodeParentChanged } = useDropNode(); const { synchronizeLayoutData } = useSynchronizeLayoutData(); - const isMoveFinished = (change: NodeChange): boolean => { + const isMoveFinished = (change: NodeChange): change is NodePositionChange => { return ( change.type === 'position' && typeof change.dragging === 'boolean' && @@ -34,23 +34,43 @@ export const useLayoutOnBoundsChange = (refreshEventPayloadId: string): UseLayou !hasDroppedNodeParentChanged() ); }; - const isResizeFinished = (change: NodeChange): boolean => + const isResizeFinished = (change: NodeChange): change is NodeDimensionChange => change.type === 'dimensions' && typeof change.resizing === 'boolean' && !change.resizing; const isBoundsChangeFinished = (changes: NodeChange[]): NodeChange | undefined => { return changes.find((change) => isMoveFinished(change) || isResizeFinished(change)); }; + const updateNodeResizeByUserState = ( + changes: NodeChange[], + nodes: Node[] + ): Node[] => { + return nodes.map((node) => { + if (changes.filter(isResizeFinished).find((dimensionChange) => dimensionChange.id === node.id)) { + return { + ...node, + data: { + ...node.data, + resizedByUser: true, + }, + }; + } + return node; + }); + }; + const layoutOnBoundsChange = (changes: NodeChange[], nodes: Node[]): void => { const change = isBoundsChangeFinished(changes); if (change) { + const updatedNodes = updateNodeResizeByUserState(changes, nodes); + const diagramToLayout: RawDiagram = { - nodes, + nodes: updatedNodes, edges: getEdges(), }; layout(diagramToLayout, diagramToLayout, null, (laidOutDiagram) => { - nodes.map((node) => { + updatedNodes.map((node) => { const existingNode = laidOutDiagram.nodes.find((laidoutNode) => laidoutNode.id === node.id); if (existingNode) { return { @@ -67,10 +87,10 @@ export const useLayoutOnBoundsChange = (refreshEventPayloadId: string): UseLayou } return node; }); - setNodes(nodes); + setNodes(updatedNodes); setEdges(laidOutDiagram.edges); const finalDiagram: RawDiagram = { - nodes: nodes, + nodes: updatedNodes, edges: laidOutDiagram.edges, }; diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/ImageNodeLayoutHandler.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/ImageNodeLayoutHandler.ts index ae302712140..e4571942aa1 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/ImageNodeLayoutHandler.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/ImageNodeLayoutHandler.ts @@ -1,5 +1,5 @@ /******************************************************************************* - * Copyright (c) 2023 Obeo. + * Copyright (c) 2023, 2024 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 @@ -124,7 +124,7 @@ export class ImageNodeLayoutHandler implements INodeLayoutHandler const previousNode = (previousDiagram?.nodes ?? []).find((previous) => previous.id === node.id); const previousDimensions = computePreviousSize(previousNode, node); - if (node.data.nodeDescription?.userResizable) { + if (node.data.resizedByUser) { if (minNodeWith > previousDimensions.width) { node.width = minNodeWith; } else { diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/ListNodeLayoutHandler.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/ListNodeLayoutHandler.ts index e22ad58385c..1ca539109d4 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/ListNodeLayoutHandler.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/ListNodeLayoutHandler.ts @@ -83,7 +83,7 @@ export class ListNodeLayoutHandler implements INodeLayoutHandler { const previousNode = (previousDiagram?.nodes ?? []).find((previouseNode) => previouseNode.id === node.id); const previousDimensions = computePreviousSize(previousNode, node); - if (node.data.nodeDescription?.userResizable) { + if (node.data.resizedByUser) { if (minNodeWith > previousDimensions.width) { node.width = minNodeWith; } else { @@ -127,7 +127,7 @@ export class ListNodeLayoutHandler implements INodeLayoutHandler { if (!forceWidth) { let previousChildrenContentBoxWidthToConsider: number = 0; - if (node.data.nodeDescription?.userResizable) { + if (node.data.resizedByUser) { previousChildrenContentBoxWidthToConsider = (previousNode?.width ?? 0) - borderWidth * 2; } const widerWidth = Math.max( @@ -173,8 +173,7 @@ export class ListNodeLayoutHandler implements INodeLayoutHandler { node.width = forceWidth ?? getNodeOrMinWidth(nodeWidth, node); const minNodeheight = getNodeOrMinHeight(nodeHeight, node); - // TODO: rework this. - if (node.data.nodeDescription?.userResizable && previousNode) { + if (node.data.resizedByUser && previousNode) { if (minNodeheight > (previousNode.height ?? 0)) { node.height = minNodeheight; } else { diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/RectangleNodeLayoutHandler.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/RectangleNodeLayoutHandler.ts index 8459d969bb4..36605e03539 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/RectangleNodeLayoutHandler.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/RectangleNodeLayoutHandler.ts @@ -172,7 +172,7 @@ export class RectangleNodeLayoutHandler implements INodeLayoutHandler previouseNode.id === node.id); const previousDimensions = computePreviousSize(previousNode, node); - if (node.data.nodeDescription?.userResizable) { + if (node.data.resizedByUser) { if (minNodeWith > previousDimensions.width) { node.width = minNodeWith; } else { @@ -223,7 +223,7 @@ export class RectangleNodeLayoutHandler implements INodeLayoutHandler previouseNode.id === node.id); const previousDimensions = computePreviousSize(previousNode, node); - if (node.data.nodeDescription?.userResizable) { + if (node.data.resizedByUser) { if (minNodeWith > previousDimensions.width) { node.width = minNodeWith; } else { diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/useSynchronizeLayoutData.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/useSynchronizeLayoutData.ts index 32e44b65b26..c753345bbda 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/useSynchronizeLayoutData.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/useSynchronizeLayoutData.ts @@ -1,5 +1,5 @@ /******************************************************************************* - * Copyright (c) 2023 Obeo. + * Copyright (c) 2023, 2024 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 @@ -86,6 +86,7 @@ export const useSynchronizeLayoutData = (): UseSynchronizeLayoutDataValue => { width, position: { x, y }, } = node; + const { resizedByUser } = node.data; if (height && width) { nodeLayoutData.push({ id, @@ -97,6 +98,7 @@ export const useSynchronizeLayoutData = (): UseSynchronizeLayoutDataValue => { height, width, }, + resizedByUser, }); } }); diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/useSynchronizeLayoutData.types.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/useSynchronizeLayoutData.types.ts index 668790b0614..f15704cec8a 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/useSynchronizeLayoutData.types.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/layout/useSynchronizeLayoutData.types.ts @@ -1,5 +1,5 @@ /******************************************************************************* - * Copyright (c) 2023 Obeo. + * Copyright (c) 2023, 2024 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 @@ -26,6 +26,7 @@ export interface GQLNodeLayoutData { id: string; position: GQLPosition; size: GQLSize; + resizedByUser: boolean; } export interface GQLSize { diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/node/ImageNode.tsx b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/node/ImageNode.tsx index dae84cf1515..764f5e05194 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/node/ImageNode.tsx +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/renderer/node/ImageNode.tsx @@ -84,13 +84,15 @@ export const ImageNode = memo(({ data, id, selected }: NodeProps) useRefreshConnectionHandles(id, data.connectionHandles); return ( <> - !data.isBorderNode} - keepAspectRatio={data.nodeDescription?.keepAspectRatio} - /> + {data.nodeDescription?.userResizable && ( + !data.isBorderNode} + keepAspectRatio={data.nodeDescription?.keepAspectRatio} + /> + )} - !data.isBorderNode} - keepAspectRatio={data.nodeDescription?.keepAspectRatio} - /> + {data.nodeDescription?.userResizable && ( + !data.isBorderNode} + keepAspectRatio={data.nodeDescription?.keepAspectRatio} + /> + )}
{ const previousNode = (previousDiagram?.nodes ?? []).find((previouseNode) => previouseNode.id === node.id); const previousDimensions = computePreviousSize(previousNode, node); - if (node.data.nodeDescription?.userResizable) { + if (node.data.resizedByUser) { if (minNodeWith > previousDimensions.width) { node.width = minNodeWith; } else {