From 5974271715cf022a00fd66f8a801d6219734b21e 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 | 6 +++ .../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 +- .../src/converter/IconLabelNodeConverter.ts | 2 + .../src/converter/ImageNodeConverter.ts | 2 + .../src/converter/ListNodeConverter.ts | 2 + .../src/converter/RectangleNodeConverter.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/EllipseNodeConverter.ts | 2 + .../src/nodes/EllipseNodeLayoutHandler.ts | 4 +- 24 files changed, 145 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 4c7b1dd6d79..48e5e6f1da3 100644 --- a/CHANGELOG.adoc +++ b/CHANGELOG.adoc @@ -76,6 +76,8 @@ The GraphQL type `NodeDescription` has a new field `childNodeDescriptionIds`, re The GraphQL type `NodeDescription` has a new field `borderNodeDescriptionIds`, returning a list of Ids and replacing the field `borderNodeDescriptions` which has been deleted. - https://github.com/eclipse-sirius/sirius-web/issues/2872[#2872] [diagram] Change the signature of the node converters in order to leverage the diagram description to resolve the reuse descriptions. Additional changes to this interface will propably occur in the near future in order to support more complex use cases. +- https://github.com/eclipse-sirius/sirius-web/issues/2883[#2883] [diagram] Add the attribute `resizedByUser` to reactflow nodes and graphql nodes. + === Dependency update @@ -96,6 +98,7 @@ Now, for a multi-valued feature, the values are properly displayed and the delet - https://github.com/eclipse-sirius/sirius-web/issues/2797[#2797] [diagram] Preserve diagram selection after change in the details view. === 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. @@ -105,6 +108,9 @@ Now, for a multi-valued feature, the values are properly displayed and the delet - 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/2737[#2737] [gantt] Support create, edit and delete task in gantt. +- 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 82443351a50..ce78d6defca 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 { @@ -591,6 +593,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..daa0cd339ce --- /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/IconLabelNodeConverter.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/IconLabelNodeConverter.ts index 802bfa9a518..16db51eed34 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/IconLabelNodeConverter.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/IconLabelNodeConverter.ts @@ -47,6 +47,7 @@ const toIconLabelNode = ( state, style, labelEditable, + resizedByUser, } = gqlNode; const connectionHandles: ConnectionHandle[] = []; @@ -72,6 +73,7 @@ const toIconLabelNode = ( labelEditable: labelEditable, connectionHandles, isNew, + resizedByUser, }; if (insideLabel) { diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ImageNodeConverter.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ImageNodeConverter.ts index 12387e2fca4..759cdf2f2d7 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ImageNodeConverter.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ImageNodeConverter.ts @@ -45,6 +45,7 @@ const toImageNode = ( state, style, labelEditable, + resizedByUser, } = gqlNode; const connectionHandles: ConnectionHandle[] = convertHandles(gqlNode, gqlEdges); @@ -69,6 +70,7 @@ const toImageNode = ( positionDependentRotation: style.positionDependentRotation, connectionHandles, isNew, + resizedByUser, }; if (insideLabel) { diff --git a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ListNodeConverter.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ListNodeConverter.ts index bb8fedd4c40..f044c65f5b1 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ListNodeConverter.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/ListNodeConverter.ts @@ -55,6 +55,7 @@ const toListNode = ( state, style, labelEditable, + resizedByUser, } = gqlNode; const connectionHandles: ConnectionHandle[] = convertHandles(gqlNode, gqlEdges); @@ -92,6 +93,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/RectangleNodeConverter.ts b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/RectangleNodeConverter.ts index 88e3d92fee3..4a2bbb0b88a 100644 --- a/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/RectangleNodeConverter.ts +++ b/packages/diagrams/frontend/sirius-components-diagrams-reactflow/src/converter/RectangleNodeConverter.ts @@ -51,6 +51,7 @@ const toRectangularNode = ( state, style, labelEditable, + resizedByUser, } = gqlNode; const connectionHandles: ConnectionHandle[] = convertHandles(gqlNode, gqlEdges); @@ -80,6 +81,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 {