Skip to content

Commit 4b42883

Browse files
florianbarbinflorianbarbin
committed
[3981] Display the diagram palette tools and tool sections in a list
Bug: #3981 Signed-off-by: Florian Barbin <florian.barbin@obeo.fr>
1 parent 21e7631 commit 4b42883

File tree

30 files changed

+1534
-856
lines changed

30 files changed

+1534
-856
lines changed

‎CHANGELOG.adoc

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ This will allow specifier to create images that fir perfectly in the project tem
117117
- https://github.com/eclipse-sirius/sirius-web/issues/2163[#2163] [form] Make EMF default form support non changeable features
118118
- https://github.com/eclipse-sirius/sirius-web/issues/4086[#4086] [form] Wrap widget returned by property section in a div with a specific classname
119119
- https://github.com/eclipse-sirius/sirius-web/issues/4088[#4088] Change tree item context menu entries internal management
120-
120+
- https://github.com/eclipse-sirius/sirius-web/issues/3981[#3981] [diagram] Update the design and capabilities of the contextual palette
121121

122122
== v2024.9.0
123123

‎packages/compatibility/backend/sirius-components-compatibility/src/main/java/org/eclipse/sirius/components/compatibility/services/diagrams/CompatibilityPaletteProvider.java

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@
2323
import org.eclipse.emf.ecore.EObject;
2424
import org.eclipse.sirius.components.collaborative.diagrams.api.DiagramImageConstants;
2525
import org.eclipse.sirius.components.collaborative.diagrams.api.IPaletteProvider;
26+
import org.eclipse.sirius.components.collaborative.diagrams.dto.IPaletteEntry;
2627
import org.eclipse.sirius.components.collaborative.diagrams.dto.ITool;
2728
import org.eclipse.sirius.components.collaborative.diagrams.dto.Palette;
2829
import org.eclipse.sirius.components.collaborative.diagrams.dto.SingleClickOnDiagramElementTool;
@@ -95,7 +96,7 @@ public Palette handle(Object targetElement, Object diagramElement, Object diagra
9596
.map(org.eclipse.sirius.diagram.description.DiagramDescription.class::cast)
9697
.findFirst();
9798

98-
List<ToolSection> toolSections = new ArrayList<>();
99+
List<IPaletteEntry> toolSections = new ArrayList<>();
99100
if (optionalSiriusDiagramDescription.isPresent()) {
100101
org.eclipse.sirius.diagram.description.DiagramDescription siriusDiagramDescription = optionalSiriusDiagramDescription.get();
101102
List<ToolSection> filteredToolSections = this.getToolSectionFromDiagramDescriptionToolSection(diagramDescription).stream()
@@ -107,7 +108,7 @@ public Palette handle(Object targetElement, Object diagramElement, Object diagra
107108
toolSections.addAll(this.createExtraToolSections(diagramElementDescription));
108109
}
109110
String paletteId = "siriusComponents://palette?diagramId=" + optionalVsmElementId.get();
110-
return Palette.newPalette(paletteId).tools(List.of()).toolSections(toolSections).build();
111+
return Palette.newPalette(paletteId).quickAccessTools(List.of()).paletteEntries(toolSections).build();
111112
}
112113

113114
private List<ToolSection> getToolSectionFromDiagramDescriptionToolSection(DiagramDescription diagramDescription) {

‎packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/dto/IPaletteEntry.java

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
/*******************************************************************************
2+
* Copyright (c) 2024 Obeo.
3+
* This program and the accompanying materials
4+
* are made available under the terms of the Eclipse Public License v2.0
5+
* which accompanies this distribution, and is available at
6+
* https://www.eclipse.org/legal/epl-2.0/
7+
*
8+
* SPDX-License-Identifier: EPL-2.0
9+
*
10+
* Contributors:
11+
* Obeo - initial API and implementation
12+
*******************************************************************************/
13+
package org.eclipse.sirius.components.collaborative.diagrams.dto;
14+
15+
/**
16+
* The common interface for elements displayed in the palette.
17+
* @author fbarbin
18+
*/
19+
public interface IPaletteEntry {
20+
21+
String id();
22+
}

‎packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/dto/ITool.java

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*******************************************************************************
2-
* Copyright (c) 2023 Obeo.
2+
* Copyright (c) 2023, 2024 Obeo.
33
* This program and the accompanying materials
44
* are made available under the terms of the Eclipse Public License v2.0
55
* which accompanies this distribution, and is available at
@@ -19,9 +19,7 @@
1919
*
2020
* @author mcharfadi
2121
*/
22-
public interface ITool {
23-
24-
String id();
22+
public interface ITool extends IPaletteEntry {
2523

2624
String label();
2725

‎packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/dto/Palette.java

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*******************************************************************************
2-
* Copyright (c) 2023 Obeo.
2+
* Copyright (c) 2023, 2024 Obeo.
33
* This program and the accompanying materials
44
* are made available under the terms of the Eclipse Public License v2.0
55
* which accompanies this distribution, and is available at
@@ -20,12 +20,12 @@
2020
*
2121
* @author frouene
2222
*/
23-
public record Palette(String id, List<ITool> tools, List<ToolSection> toolSections) {
23+
public record Palette(String id, List<ITool> quickAccessTools, List<IPaletteEntry> paletteEntries) {
2424

2525
public Palette {
2626
Objects.requireNonNull(id);
27-
Objects.requireNonNull(tools);
28-
Objects.requireNonNull(toolSections);
27+
Objects.requireNonNull(quickAccessTools);
28+
Objects.requireNonNull(paletteEntries);
2929
}
3030

3131
public static Builder newPalette(String id) {
@@ -43,26 +43,26 @@ public static final class Builder {
4343

4444
private final String id;
4545

46-
private List<ITool> tools;
46+
private List<ITool> quickAccessTools;
4747

48-
private List<ToolSection> toolSections;
48+
private List<IPaletteEntry> paletteEntries;
4949

5050
private Builder(String id) {
5151
this.id = Objects.requireNonNull(id);
5252
}
5353

54-
public Builder tools(List<ITool> tools) {
55-
this.tools = Objects.requireNonNull(tools);
54+
public Builder quickAccessTools(List<ITool> quickAccessTools) {
55+
this.quickAccessTools = Objects.requireNonNull(quickAccessTools);
5656
return this;
5757
}
5858

59-
public Builder toolSections(List<ToolSection> toolSections) {
60-
this.toolSections = Objects.requireNonNull(toolSections);
59+
public Builder paletteEntries(List<IPaletteEntry> paletteEntries) {
60+
this.paletteEntries = Objects.requireNonNull(paletteEntries);
6161
return this;
6262
}
6363

6464
public Palette build() {
65-
return new Palette(this.id, this.tools, this.toolSections);
65+
return new Palette(this.id, this.quickAccessTools, this.paletteEntries);
6666
}
6767
}
6868

‎packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/dto/PaletteDivider.java

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
/*******************************************************************************
2+
* Copyright (c) 2024 Obeo.
3+
* This program and the accompanying materials
4+
* are made available under the terms of the Eclipse Public License v2.0
5+
* which accompanies this distribution, and is available at
6+
* https://www.eclipse.org/legal/epl-2.0/
7+
*
8+
* SPDX-License-Identifier: EPL-2.0
9+
*
10+
* Contributors:
11+
* Obeo - initial API and implementation
12+
*******************************************************************************/
13+
package org.eclipse.sirius.components.collaborative.diagrams.dto;
14+
15+
import java.util.Objects;
16+
17+
/**
18+
* Represents a divider between tools or tool sections in the palette.
19+
* @author fbarbin
20+
*/
21+
public record PaletteDivider(String id) implements IPaletteEntry {
22+
23+
public PaletteDivider {
24+
Objects.requireNonNull(id);
25+
}
26+
}

‎packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/dto/ToolSection.java

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*******************************************************************************
2-
* Copyright (c) 2023 Obeo.
2+
* Copyright (c) 2023, 2024 Obeo.
33
* This program and the accompanying materials
44
* are made available under the terms of the Eclipse Public License v2.0
55
* which accompanies this distribution, and is available at
@@ -20,7 +20,7 @@
2020
*
2121
* @author mcharfadi
2222
*/
23-
public record ToolSection(String id, String label, List<String> iconURL, List<ITool> tools) {
23+
public record ToolSection(String id, String label, List<String> iconURL, List<ITool> tools) implements IPaletteEntry {
2424

2525
public ToolSection {
2626
Objects.requireNonNull(id);

‎packages/diagrams/backend/sirius-components-collaborative-diagrams/src/main/resources/schema/diagram.graphqls

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -260,8 +260,18 @@ type Size {
260260

261261
type Palette {
262262
id: ID!
263-
tools: [Tool]!
264-
toolSections: [ToolSection]!
263+
quickAccessTools: [Tool]!
264+
paletteEntries: [PaletteEntry]!
265+
}
266+
267+
union PaletteEntry =
268+
ToolSection
269+
| SingleClickOnDiagramElementTool
270+
| SingleClickOnTwoDiagramElementsTool
271+
| PaletteDivider
272+
273+
type PaletteDivider {
274+
id: ID!
265275
}
266276

267277
type ToolSection {

‎packages/diagrams/backend/sirius-components-diagrams-tests/src/main/java/org/eclipse/sirius/components/diagrams/tests/graphql/PaletteQueryRunner.java

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,15 +36,18 @@ query getPalette($editingContextId: ID!, $representationId: ID!, $diagramElement
3636
... on DiagramDescription {
3737
palette(diagramElementId: $diagramElementId) {
3838
id
39-
tools {
39+
quickAccessTools {
4040
...ToolFields
4141
}
42-
toolSections {
43-
id
44-
label
45-
iconURL
46-
tools {
47-
...ToolFields
42+
paletteEntries {
43+
...ToolFields
44+
... on ToolSection {
45+
id
46+
label
47+
iconURL
48+
tools {
49+
...ToolFields
50+
}
4851
}
4952
}
5053
}

‎packages/diagrams/frontend/sirius-components-diagrams/src/index.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -58,10 +58,13 @@ export type { NodeContextValue } from './renderer/node/NodeContext.types';
5858
export { NodeTypeContribution } from './renderer/node/NodeTypeContribution';
5959
export type { DiagramNodeType } from './renderer/node/NodeTypes.types';
6060
export { DiagramElementPalette } from './renderer/palette/DiagramElementPalette';
61-
export type { DiagramPaletteToolContributionComponentProps } from './renderer/palette/DiagramPaletteToolContribution.types';
62-
export type { GQLToolVariable, GQLToolVariableType } from './renderer/palette/Palette.types';
61+
export type {
62+
DiagramPaletteToolContributionComponentProps,
63+
DiagramPaletteToolContributionProps,
64+
} from './renderer/palette/DiagramPaletteToolContribution.types';
6365
export type { DiagramPaletteToolComponentProps } from './renderer/palette/tool/DiagramPaletteTool.types';
6466
export { diagramPaletteToolExtensionPoint } from './renderer/palette/tool/DiagramPaletteToolExtensionPoints';
67+
export type { GQLToolVariable, GQLToolVariableType } from './renderer/palette/usePalette.types';
6568
export type { DiagramPanelActionProps } from './renderer/panel/DiagramPanel.types';
6669
export { diagramPanelActionExtensionPoint } from './renderer/panel/DiagramPanelExtensionPoints';
6770
export { DiagramRepresentation } from './representation/DiagramRepresentation';

‎packages/diagrams/frontend/sirius-components-diagrams/src/renderer/connector/useConnector.types.ts

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -60,14 +60,24 @@ export interface GQLDiagramDescription extends GQLRepresentationDescription {
6060

6161
export interface GQLPalette {
6262
id: string;
63+
paletteEntries: GQLPaletteEntry[];
64+
}
65+
66+
export interface GQLPaletteEntry {
67+
id: string;
68+
__typename: string;
69+
}
70+
export interface GQLPaletteDivider extends GQLPaletteEntry {}
71+
72+
export interface GQLToolSection extends GQLPaletteEntry {
73+
label: string;
74+
iconURL: string[];
6375
tools: GQLTool[];
64-
toolSections: GQLToolSection[];
6576
}
6677

6778
export interface GQLToolSection {
6879
id: string;
6980
label: string;
70-
imageURL: string;
7181
tools: GQLTool[];
7282
__typename: string;
7383
}

‎packages/diagrams/frontend/sirius-components-diagrams/src/renderer/delete/useDiagramDelete.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ import {
2525
GQLDeleteFromDiagramVariables,
2626
GQLDeletionPolicy,
2727
GQLErrorPayload,
28-
} from '../palette/Palette.types';
28+
} from '../palette/usePalette.types';
2929
import { UseDiagramDeleteValue } from './useDiagramDelete.types';
3030

3131
export const deleteFromDiagramMutation = gql`

‎packages/diagrams/frontend/sirius-components-diagrams/src/renderer/handles/useConnectionCandidatesQuery.ts

Lines changed: 26 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -19,11 +19,12 @@ import {
1919
GQLGetToolSectionsData,
2020
GQLGetToolSectionsVariables,
2121
GQLNodeDescription,
22+
GQLPaletteEntry,
2223
GQLRepresentationDescription,
2324
GQLSingleClickOnTwoDiagramElementsTool,
25+
GQLToolSection,
2426
} from '../connector/useConnector.types';
2527
import { NodeData } from '../DiagramRenderer.types';
26-
import { GQLTool } from '../palette/Palette.types';
2728

2829
const getToolSectionsQuery = gql`
2930
query getToolSections($editingContextId: ID!, $diagramId: ID!, $diagramElementId: ID!) {
@@ -33,12 +34,12 @@ const getToolSectionsQuery = gql`
3334
description {
3435
... on DiagramDescription {
3536
palette(diagramElementId: $diagramElementId) {
36-
tools {
37+
paletteEntries {
3738
...ToolFields
38-
}
39-
toolSections {
40-
tools {
41-
...ToolFields
39+
... on ToolSection {
40+
tools {
41+
...ToolFields
42+
}
4243
}
4344
}
4445
}
@@ -68,9 +69,10 @@ const getToolSectionsQuery = gql`
6869
const isDiagramDescription = (
6970
representationDescription: GQLRepresentationDescription
7071
): representationDescription is GQLDiagramDescription => representationDescription.__typename === 'DiagramDescription';
71-
const isSingleClickOnTwoDiagramElementsTool = (tool: GQLTool): tool is GQLSingleClickOnTwoDiagramElementsTool =>
72-
tool.__typename === 'SingleClickOnTwoDiagramElementsTool';
73-
72+
const isSingleClickOnTwoDiagramElementsTool = (
73+
entry: GQLPaletteEntry
74+
): entry is GQLSingleClickOnTwoDiagramElementsTool => entry.__typename === 'SingleClickOnTwoDiagramElementsTool';
75+
const isToolSection = (entry: GQLPaletteEntry): entry is GQLToolSection => entry.__typename === 'ToolSection';
7476
export const useConnectionCandidatesQuery = (
7577
editingContextId: string,
7678
diagramId: string,
@@ -90,17 +92,24 @@ export const useConnectionCandidatesQuery = (
9092
const diagramDescription: GQLRepresentationDescription | null =
9193
data?.viewer.editingContext.representation.description ?? null;
9294

93-
const nodeCandidates: GQLNodeDescription[] = useMemo(() => {
95+
const collectConnectionToolsFromPaletteEntry = (entry: GQLPaletteEntry): GQLNodeDescription[] => {
9496
const candidates: GQLNodeDescription[] = [];
95-
if (diagramDescription && isDiagramDescription(diagramDescription)) {
96-
diagramDescription.palette.tools.filter(isSingleClickOnTwoDiagramElementsTool).forEach((tool) => {
97+
if (isSingleClickOnTwoDiagramElementsTool(entry)) {
98+
entry.candidates.forEach((candidate) => candidates.push(...candidate.targets));
99+
} else if (isToolSection(entry)) {
100+
entry.tools.filter(isSingleClickOnTwoDiagramElementsTool).forEach((tool) => {
97101
tool.candidates.forEach((candidate) => candidates.push(...candidate.targets));
98102
});
99-
diagramDescription.palette.toolSections.forEach((toolSection) => {
100-
toolSection.tools.filter(isSingleClickOnTwoDiagramElementsTool).forEach((tool) => {
101-
tool.candidates.forEach((candidate) => candidates.push(...candidate.targets));
102-
});
103-
});
103+
}
104+
return candidates;
105+
};
106+
107+
const nodeCandidates: GQLNodeDescription[] = useMemo(() => {
108+
const candidates: GQLNodeDescription[] = [];
109+
if (diagramDescription && isDiagramDescription(diagramDescription)) {
110+
diagramDescription.palette.paletteEntries.forEach((entry) =>
111+
candidates.push(...collectConnectionToolsFromPaletteEntry(entry))
112+
);
104113
}
105114

106115
return candidates;

‎packages/diagrams/frontend/sirius-components-diagrams/src/renderer/palette/DiagramPaletteToolContribution.types.ts

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,12 @@
1111
* Obeo - initial API and implementation
1212
*******************************************************************************/
1313

14+
import { Node } from '@xyflow/react';
15+
import { NodeData } from '../DiagramRenderer.types';
16+
1417
export interface DiagramPaletteToolContributionProps {
15-
canHandle: (diagramId: string, diagramElementId: string) => boolean;
16-
component: (props: DiagramPaletteToolContributionComponentProps) => JSX.Element | null;
18+
canHandle: (node: Node<NodeData>) => boolean;
19+
component: React.ComponentType<DiagramPaletteToolContributionComponentProps>;
1720
}
1821

1922
export interface DiagramPaletteToolContributionComponentProps {

0 commit comments

Comments
 (0)