This is an automated email from the ASF dual-hosted git repository.
tiagobento pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-kie-tools.git
The following commit(s) were added to refs/heads/main by this push:
new 41814a95a10 kie-issues#232: Identify DMN 1.4 collections with `|||` on
the DMN Editor diagram (#2132)
41814a95a10 is described below
commit 41814a95a105e4131fcdd68109775f5f5765fb39
Author: Luiz João Motta <[email protected]>
AuthorDate: Tue Jan 30 13:46:45 2024 -0300
kie-issues#232: Identify DMN 1.4 collections with `|||` on the DMN Editor
diagram (#2132)
---
.../dev-webapp/src/AvailableModelsToInclude.ts | 2 +-
packages/dmn-editor/src/diagram/nodes/NodeSvgs.tsx | 50 +++++++++++++++++++++-
packages/dmn-editor/src/diagram/nodes/Nodes.tsx | 25 +++++++++--
3 files changed, 70 insertions(+), 7 deletions(-)
diff --git a/packages/dmn-editor/dev-webapp/src/AvailableModelsToInclude.ts
b/packages/dmn-editor/dev-webapp/src/AvailableModelsToInclude.ts
index d86321a2f6a..55ae39ea07a 100644
--- a/packages/dmn-editor/dev-webapp/src/AvailableModelsToInclude.ts
+++ b/packages/dmn-editor/dev-webapp/src/AvailableModelsToInclude.ts
@@ -67,7 +67,7 @@ export const modelsByNamespace =
Object.values(avaiableModels).reduce((acc, v) =
if (v.type === "dmn") {
acc[v.model.definitions["@_namespace"]] = v;
} else if (v.type === "pmml") {
- acc[getPmmlNamespace({ normalizedPathRelativeToTheOpenFile:
v.normalizedPosixPathRelativeToTheOpenFile })] = v;
+ acc[getPmmlNamespace({ normalizedPosixPathRelativeToTheOpenFile:
v.normalizedPosixPathRelativeToTheOpenFile })] = v;
}
return acc;
}, {} as DmnEditor.ExternalModelsIndex);
diff --git a/packages/dmn-editor/src/diagram/nodes/NodeSvgs.tsx
b/packages/dmn-editor/src/diagram/nodes/NodeSvgs.tsx
index 03db3ededc7..29e5baaf1b8 100644
--- a/packages/dmn-editor/src/diagram/nodes/NodeSvgs.tsx
+++ b/packages/dmn-editor/src/diagram/nodes/NodeSvgs.tsx
@@ -66,7 +66,7 @@ export function normalize<T extends NodeSvgProps>(_props: T) {
};
}
-export function InputDataNodeSvg(__props: NodeSvgProps) {
+export function InputDataNodeSvg(__props: NodeSvgProps & { isCollection?:
boolean }) {
const { strokeWidth, x, y, width, height, fillColor, strokeColor, props } =
normalize(__props);
const rx =
typeof height === "number"
@@ -97,11 +97,12 @@ export function InputDataNodeSvg(__props: NodeSvgProps) {
rx={rx}
ry={ry}
/>
+ {props.isCollection && <NodeCollectionMarker {...__props}
anchor={"bottom"} />}
</>
);
}
-export function DecisionNodeSvg(__props: NodeSvgProps) {
+export function DecisionNodeSvg(__props: NodeSvgProps & { isCollection?:
boolean }) {
const { strokeWidth, x, y, width, height, fillColor, strokeColor, props } =
normalize(__props);
return (
@@ -117,6 +118,7 @@ export function DecisionNodeSvg(__props: NodeSvgProps) {
strokeLinejoin={"round"}
{...props}
/>
+ {props.isCollection && <NodeCollectionMarker {...__props} anchor="top"
/>}
</>
);
}
@@ -378,3 +380,47 @@ export const UnknownNodeSvg = (_props: NodeSvgProps & {
strokeDasharray?: string
</>
);
};
+
+function NodeCollectionMarker(__props: NodeSvgProps & { anchor: "top" |
"bottom" }) {
+ const { strokeWidth, x, y, width, height, fillColor, strokeColor, props } =
normalize(__props);
+
+ const xPosition = x + width / 2;
+ const xSpacing = 7;
+ const y1Position = props.anchor === "bottom" ? y + height - 4 : y + 4;
+ const y2Position = props.anchor === "bottom" ? y + height - 18 : y + 18;
+
+ return (
+ <>
+ <line
+ {...props}
+ x1={xPosition - xSpacing}
+ x2={xPosition - xSpacing}
+ y1={y1Position}
+ y2={y2Position}
+ strokeWidth={strokeWidth}
+ fill={fillColor ?? DEFAULT_NODE_FILL}
+ stroke={strokeColor ?? DEFAULT_NODE_STROKE_COLOR}
+ />
+ <line
+ {...props}
+ x1={xPosition}
+ x2={xPosition}
+ y1={y1Position}
+ y2={y2Position}
+ strokeWidth={strokeWidth}
+ fill={fillColor ?? DEFAULT_NODE_FILL}
+ stroke={strokeColor ?? DEFAULT_NODE_STROKE_COLOR}
+ />
+ <line
+ {...props}
+ x1={xPosition + xSpacing}
+ x2={xPosition + xSpacing}
+ y1={y1Position}
+ y2={y2Position}
+ strokeWidth={strokeWidth}
+ fill={fillColor ?? DEFAULT_NODE_FILL}
+ stroke={strokeColor ?? DEFAULT_NODE_STROKE_COLOR}
+ />
+ </>
+ );
+}
diff --git a/packages/dmn-editor/src/diagram/nodes/Nodes.tsx
b/packages/dmn-editor/src/diagram/nodes/Nodes.tsx
index 068a395eaed..1082f3aa905 100644
--- a/packages/dmn-editor/src/diagram/nodes/Nodes.tsx
+++ b/packages/dmn-editor/src/diagram/nodes/Nodes.tsx
@@ -29,7 +29,7 @@ import {
DMNDI15__DMNShape,
} from "@kie-tools/dmn-marshaller/dist/schemas/dmn-1_5/ts-gen/types";
import * as React from "react";
-import { useCallback, useEffect, useRef } from "react";
+import { useCallback, useEffect, useMemo, useRef } from "react";
import * as RF from "reactflow";
import { renameDrgElement, renameGroupNode, updateTextAnnotation } from
"../../mutations/renameNode";
import { DmnEditorTab, DropTargetNode, SnapGrid, useDmnEditorStore,
useDmnEditorStoreApi } from "../../store/Store";
@@ -141,8 +141,8 @@ export const InputDataNode = React.memo(
[dmnEditorStoreApi, index, inputData]
);
- const { allFeelVariableUniqueNames } = useDmnEditorDerivedStore();
-
+ const { allFeelVariableUniqueNames, allTopLevelItemDefinitionUniqueNames,
allDataTypesById } =
+ useDmnEditorDerivedStore();
const onCreateDataType = useDataTypeCreationCallbackForNodes(index,
inputData["@_name"]);
const { fontCssProperties, shapeStyle } = useNodeStyle({
@@ -151,10 +151,18 @@ export const InputDataNode = React.memo(
isEnabled: diagram.overlays.enableStyles,
});
+ const isCollection = useMemo(() => {
+ return (
+
allDataTypesById.get(allTopLevelItemDefinitionUniqueNames.get(inputData.variable?.["@_typeRef"]
?? "") ?? "")
+ ?.itemDefinition?.["@_isCollection"] ?? false
+ );
+ }, [allDataTypesById, allTopLevelItemDefinitionUniqueNames,
inputData.variable]);
+
return (
<>
<svg className={`kie-dmn-editor--node-shape ${className}
${dmnObjectQName.prefix ? "external" : ""}`}>
<InputDataNodeSvg
+ isCollection={isCollection}
{...nodeDimensions}
x={0}
y={0}
@@ -260,7 +268,8 @@ export const DecisionNode = React.memo(
[decision, dmnEditorStoreApi, index]
);
- const { allFeelVariableUniqueNames } = useDmnEditorDerivedStore();
+ const { allFeelVariableUniqueNames, allTopLevelItemDefinitionUniqueNames,
allDataTypesById } =
+ useDmnEditorDerivedStore();
const onCreateDataType = useDataTypeCreationCallbackForNodes(index,
decision["@_name"]);
@@ -270,10 +279,18 @@ export const DecisionNode = React.memo(
isEnabled: diagram.overlays.enableStyles,
});
+ const isCollection = useMemo(() => {
+ return (
+
allDataTypesById.get(allTopLevelItemDefinitionUniqueNames.get(decision.variable?.["@_typeRef"]
?? "") ?? "")
+ ?.itemDefinition?.["@_isCollection"] ?? false
+ );
+ }, [allDataTypesById, allTopLevelItemDefinitionUniqueNames,
decision.variable]);
+
return (
<>
<svg className={`kie-dmn-editor--node-shape ${className}
${dmnObjectQName.prefix ? "external" : ""}`}>
<DecisionNodeSvg
+ isCollection={isCollection}
{...nodeDimensions}
x={0}
y={0}
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
