kie-issue#1149: DMN Editor produces invalid typeRef attributes

packages/boxed-expression-component/src/BoxedExpressionEditor.tsx

@@ -20,7 +20,7 @@
 import "@patternfly/react-styles/css/components/Drawer/drawer.css";
 import { I18nDictionariesProvider } from "@kie-tools-core/i18n/dist/react-components";
 import * as React from "react";
-import { BeeGwtService, DmnDataType, BoxedExpression, PmmlDocument } from "./api";
+import { BeeGwtService, BoxedExpression, DmnDataType, PmmlDocument } from "./api";
 import {
   boxedExpressionEditorDictionaries,
   BoxedExpressionEditorI18nContext,
@@ -42,7 +42,7 @@ export interface BoxedExpressionEditorProps {
   /** Name of the Decision or BKM containing `expression` */
   expressionHolderName: string;
   /** TypeRef of the Decision or BKM containing `expression` */
-  expressionHolderTypeRef: string;
+  expressionHolderTypeRef: string | undefined;
   /** The boxed expression itself */
   expression: BoxedExpression | undefined;
   /** Called every time something changes on the expression */

packages/boxed-expression-component/src/api/BeeGwtService.ts

@@ -25,7 +25,7 @@ import { BoxedExpression } from "./BoxedExpression";
 export interface BeeGwtService {
   getDefaultExpressionDefinition(
     logicType: BoxedExpression["__$$element"] | undefined,
-    typeRef: string,
+    typeRef: string | undefined,
     isRoot?: boolean
   ): { expression: BoxedExpression; widthsById: Map<string, number[]> };
 

packages/boxed-expression-component/src/expressionVariable/DataTypeSelector.tsx

@@ -19,18 +19,18 @@
 
 import { Select, SelectGroup, SelectOption, SelectVariant } from "@patternfly/react-core/dist/js/components/Select";
 import * as React from "react";
-import { useCallback, useState, useRef, useMemo } from "react";
+import { useCallback, useMemo, useRef, useState } from "react";
 import { useBoxedExpressionEditorI18n } from "../i18n";
 import * as _ from "lodash";
-import { DmnDataType } from "../api";
+import { DmnBuiltInDataType, DmnDataType } from "../api";
 import { useBoxedExpressionEditor } from "../BoxedExpressionEditorContext";
 import { Divider } from "@patternfly/react-core/dist/js/components/Divider";
 
 export interface DataTypeSelectorProps {
   /** The pre-selected data type */
-  value: string;
+  value: string | undefined;
   /** On DataType selection callback */
-  onChange: (dataType: string) => void;
+  onChange: (dataType: string | undefined) => void;
   /** By default the menu will be appended inline, but it is possible to append on the parent or on other elements */
   /** Callback for toggle select behavior */
   onToggle?: (isOpen: boolean) => void;
@@ -64,7 +64,7 @@ export const DataTypeSelector: React.FunctionComponent<DataTypeSelectorProps> =
       /* this setTimeout keeps the context menu open after type selection changes. Without this Popover component thinks there has been a click outside the context menu, after DataTypeSelector has changed. This because the Select component has been removed from the html*/
       setTimeout(() => setOpen(false), 0);
 
-      onChange(selection);
+      onChange(selection === DmnBuiltInDataType.Undefined ? undefined : selection);
 
       // Because Select leave the focus to the detached btn, give back the focus to the selectWrapperRef
       (selectContainerRef.current?.querySelector("button") as HTMLInputElement)?.focus();
@@ -108,7 +108,7 @@ export const DataTypeSelector: React.FunctionComponent<DataTypeSelectorProps> =
       return buildSelectGroups().reduce((acc, group) => {
         const filteredGroup = React.cloneElement(group, {
           children: group.props?.children?.filter((item: React.ReactElement) =>
-            item.props.value.toLowerCase().includes(textInput.toLowerCase())
+            (item.props.value ?? DmnBuiltInDataType.Undefined).toLowerCase().includes(textInput.toLowerCase())
           ),
         });
 
@@ -157,7 +157,7 @@ export const DataTypeSelector: React.FunctionComponent<DataTypeSelectorProps> =
         onSelect={onSelect}
         onFilter={onFilter}
         isOpen={isOpen}
-        selections={value}
+        selections={value ?? DmnBuiltInDataType.Undefined}
         isGrouped={true}
         hasInlineFilter={true}
         inlineFilterPlaceholderText={i18n.choose}

packages/boxed-expression-component/src/expressionVariable/ExpressionVariableCell.tsx

@@ -49,7 +49,7 @@ export const ExpressionVariableCell: React.FunctionComponent<
   const { expression, variable, index } = data[rowIndex];
 
   const onVariableUpdated = useCallback<OnExpressionVariableUpdated>(
-    ({ name = DEFAULT_EXPRESSION_VARIABLE_NAME, typeRef = DmnBuiltInDataType.Undefined }) => {
+    ({ name = DEFAULT_EXPRESSION_VARIABLE_NAME, typeRef = undefined }) => {
       onExpressionWithVariableUpdated(index, {
         // `expression` and `variable` must always have the same `typeRef` and `name/label`, as those are dictated by `variable`.
         expression: expression
@@ -99,7 +99,7 @@ export const ExpressionVariableCell: React.FunctionComponent<
     rowIndex,
     columnIndex,
     undefined,
-    useCallback(() => `${variable["@_name"]} (${variable["@_typeRef"] ?? DmnBuiltInDataType.Undefined}})`, [variable])
+    useCallback(() => `${variable["@_name"]} (${variable["@_typeRef"]}})`, [variable])
   );
 
   const { beeGwtService } = useBoxedExpressionEditor();

packages/boxed-expression-component/src/expressionVariable/ExpressionVariableMenu.tsx

@@ -18,10 +18,9 @@
  */
 
 import * as React from "react";
-import { useCallback, useEffect, useState, useRef } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import { PopoverMenu, PopoverMenuRef } from "../contextMenu/PopoverMenu";
 import { useBoxedExpressionEditorI18n } from "../i18n";
-import { DmnBuiltInDataType, BoxedExpression } from "../api";
 import { useBoxedExpressionEditor } from "../BoxedExpressionEditorContext";
 import { DataTypeSelector } from "./DataTypeSelector";
 import { CogIcon } from "@patternfly/react-icons/dist/js/icons/cog-icon";
@@ -30,7 +29,7 @@ import { NavigationKeysUtils } from "../keysUtils/keyUtils";
 import { PopoverPosition } from "@patternfly/react-core/dist/js/components/Popover";
 import "./ExpressionVariableMenu.css";
 
-export type OnExpressionVariableUpdated = (args: { name: string; typeRef: string }) => void;
+export type OnExpressionVariableUpdated = (args: { name: string; typeRef: string | undefined }) => void;
 
 export interface ExpressionVariableMenuProps {
   /** Optional children element to be considered for triggering the edit expression menu */
@@ -62,7 +61,7 @@ export function ExpressionVariableMenu({
   arrowPlacement,
   nameField,
   dataTypeField,
-  selectedDataType = DmnBuiltInDataType.Undefined,
+  selectedDataType = undefined,
   selectedExpressionName,
   onVariableUpdated,
   position,
@@ -92,7 +91,7 @@ export function ExpressionVariableMenu({
     setExpressionName(event.target.value);
   }, []);
 
-  const onDataTypeChange = useCallback((dataType: DmnBuiltInDataType) => {
+  const onDataTypeChange = useCallback((dataType: string | undefined) => {
     setDataType(dataType);
   }, []);
 

packages/boxed-expression-component/src/expressions/ContextExpression/ContextExpression.tsx

@@ -35,11 +35,11 @@ import {
 import { useBoxedExpressionEditorI18n } from "../../i18n";
 import { useNestedExpressionContainerWithNestedExpressions } from "../../resizing/Hooks";
 import { NestedExpressionContainerContext } from "../../resizing/NestedExpressionContainerContext";
-import { ResizerStopBehavior, ResizingWidth, useResizingWidths } from "../../resizing/ResizingWidthsContext";
+import { ResizerStopBehavior, ResizingWidth } from "../../resizing/ResizingWidthsContext";
 import {
   CONTEXT_ENTRY_EXPRESSION_MIN_WIDTH,
-  CONTEXT_ENTRY_VARIABLE_MIN_WIDTH,
   CONTEXT_ENTRY_VARIABLE_COLUMN_WIDTH_INDEX,
+  CONTEXT_ENTRY_VARIABLE_MIN_WIDTH,
   CONTEXT_EXPRESSION_EXTRA_WIDTH,
 } from "../../resizing/WidthConstants";
 import { useBeeTableCoordinates, useBeeTableSelectableCellRef } from "../../selection/BeeTableSelectionContext";
@@ -49,13 +49,11 @@ import { DEFAULT_EXPRESSION_VARIABLE_NAME } from "../../expressionVariable/Expre
 import { ContextEntryExpressionCell } from "./ContextEntryExpressionCell";
 import { ExpressionVariableCell, ExpressionWithVariable } from "../../expressionVariable/ExpressionVariableCell";
 import { ContextResultExpressionCell } from "./ContextResultExpressionCell";
-import { getExpressionMinWidth, getExpressionTotalMinWidth } from "../../resizing/WidthMaths";
+import { getExpressionTotalMinWidth } from "../../resizing/WidthMaths";
 import { DMN15__tContextEntry } from "@kie-tools/dmn-marshaller/dist/schemas/dmn-1_5/ts-gen/types";
 import { findAllIdsDeep } from "../../ids/ids";
 import "./ContextExpression.css";
 
-const CONTEXT_ENTRY_DEFAULT_DATA_TYPE = DmnBuiltInDataType.Undefined;
-
 export type ROWTYPE = ExpressionWithVariable & { index: number };
 
 export function ContextExpression({
@@ -156,7 +154,7 @@ export function ContextExpression({
         accessor: expressionHolderId as any, // FIXME: https://github.com/apache/incubator-kie-issues/issues/169
         label: contextExpression["@_label"] ?? DEFAULT_EXPRESSION_VARIABLE_NAME,
         isRowIndexColumn: false,
-        dataType: contextExpression["@_typeRef"] ?? CONTEXT_ENTRY_DEFAULT_DATA_TYPE,
+        dataType: contextExpression["@_typeRef"] ?? DmnBuiltInDataType.Undefined,
         width: undefined,
         columns: [
           {
@@ -286,7 +284,7 @@ export function ContextExpression({
         variable: {
           "@_id": generateUuid(),
           "@_name": variableName,
-          "@_typeRef": DmnBuiltInDataType.Undefined,
+          "@_typeRef": undefined,
           description: { __$$text: "" },
         },
       };

packages/boxed-expression-component/src/expressions/DecisionTableExpression/DecisionTableExpression.tsx

@@ -62,7 +62,6 @@ import {
   DMN15__tInputClause,
   DMN15__tLiteralExpression,
   DMN15__tOutputClause,
-  DMN15__tRuleAnnotation,
   DMN15__tRuleAnnotationClause,
   DMN15__tUnaryTests,
 } from "@kie-tools/dmn-marshaller/dist/schemas/dmn-1_5/ts-gen/types";
@@ -728,7 +727,7 @@ export function DecisionTableExpression({
                 "@_id": generateUuid(),
                 inputExpression: {
                   "@_id": generateUuid(),
-                  "@_typeRef": DmnBuiltInDataType.Undefined,
+                  "@_typeRef": undefined,
                   text: { __$$text: newName },
                 },
               });
@@ -768,7 +767,7 @@ export function DecisionTableExpression({
               outputColumnsToAdd.push({
                 "@_id": generateUuid(),
                 "@_name": name,
-                "@_typeRef": DmnBuiltInDataType.Undefined,
+                "@_typeRef": undefined,
               });
             }
 

packages/boxed-expression-component/src/expressions/ExpressionDefinitionRoot/ExpressionContainer.tsx

@@ -20,7 +20,7 @@
 import * as React from "react";
 import { useCallback, useEffect, useRef } from "react";
 import { useBoxedExpressionEditor, useBoxedExpressionEditorDispatch } from "../../BoxedExpressionEditorContext";
-import { BoxedExpression, DmnBuiltInDataType, generateUuid } from "../../api";
+import { BoxedExpression, generateUuid } from "../../api";
 import { findAllIdsDeep } from "../../ids/ids";
 import { DEFAULT_EXPRESSION_VARIABLE_NAME } from "../../expressionVariable/ExpressionVariableMenu";
 import { useBeeTableSelectableCellRef } from "../../selection/BeeTableSelectionContext";
@@ -65,11 +65,7 @@ export const ExpressionContainer: React.FunctionComponent<ExpressionContainerPro
   const onLogicTypeSelected = useCallback(
     (logicType: BoxedExpression["__$$element"] | undefined) => {
       const { expression: defaultExpression, widthsById: defaultWidthsById } =
-        beeGwtService!.getDefaultExpressionDefinition(
-          logicType,
-          parentElementTypeRef ?? expressionTypeRef ?? DmnBuiltInDataType.Undefined,
-          !isNested
-        );
+        beeGwtService!.getDefaultExpressionDefinition(logicType, parentElementTypeRef ?? expressionTypeRef, !isNested);
 
       setExpression((prev: BoxedExpression) => {
         // Do not inline this variable for type safety. See https://github.com/microsoft/TypeScript/issues/241

packages/boxed-expression-component/src/expressions/ExpressionDefinitionRoot/ExpressionDefinitionRoot.tsx

@@ -25,7 +25,7 @@ import "./ExpressionDefinitionRoot.css";
 
 export interface ExpressionDefinitionRootProps {
   expressionHolderId: string;
-  expressionHolderTypeRef: string;
+  expressionHolderTypeRef: string | undefined;
   expression?: BoxedExpression;
   isResetSupported: boolean | undefined;
   expressionHolderName?: string;

packages/boxed-expression-component/src/expressions/FunctionExpression/FeelFunctionExpression.tsx

@@ -27,10 +27,10 @@ import {
   BeeTableOperation,
   BeeTableOperationConfig,
   BeeTableProps,
-  DmnBuiltInDataType,
   BoxedExpression,
   BoxedFunction,
   BoxedFunctionKind,
+  DmnBuiltInDataType,
 } from "../../api";
 import { useBoxedExpressionEditorI18n } from "../../i18n";
 import { useNestedExpressionContainerWithNestedExpressions } from "../../resizing/Hooks";

packages/boxed-expression-component/src/expressions/FunctionExpression/FunctionExpression.tsx

@@ -20,15 +20,15 @@
 import _ from "lodash";
 import * as React from "react";
 import { useCallback, useMemo } from "react";
-import { DmnBuiltInDataType, BoxedFunction, BoxedFunctionKind, generateUuid } from "../../api";
+import { BoxedFunction, BoxedFunctionKind, DmnBuiltInDataType, generateUuid } from "../../api";
 import { PopoverMenu } from "../../contextMenu/PopoverMenu";
 import { useBoxedExpressionEditorI18n } from "../../i18n";
 import { useBoxedExpressionEditor, useBoxedExpressionEditorDispatch } from "../../BoxedExpressionEditorContext";
-import { FeelFunctionExpression, BoxedFunctionFeel } from "./FeelFunctionExpression";
+import { BoxedFunctionFeel, FeelFunctionExpression } from "./FeelFunctionExpression";
 import { FunctionKindSelector } from "./FunctionKindSelector";
-import { JavaFunctionExpression, BoxedFunctionJava } from "./JavaFunctionExpression";
+import { BoxedFunctionJava, JavaFunctionExpression } from "./JavaFunctionExpression";
 import { ParametersPopover } from "./ParametersPopover";
-import { PmmlFunctionExpression, BoxedFunctionPmml } from "./PmmlFunctionExpression";
+import { BoxedFunctionPmml, PmmlFunctionExpression } from "./PmmlFunctionExpression";
 import {
   DMN15__tFunctionDefinition,
   DMN15__tFunctionKind,
@@ -86,11 +86,11 @@ export function useFunctionExpressionControllerCell(functionKind: DMN15__tFuncti
             "@_label": prev["@_label"],
             "@_id": generateUuid(),
             "@_kind": BoxedFunctionKind.Feel,
-            "@_typeRef": DmnBuiltInDataType.Undefined,
+            "@_typeRef": undefined,
             expression: {
               __$$element: "literalExpression",
               "@_id": generateUuid(),
-              "@_typeRef": DmnBuiltInDataType.Undefined,
+              "@_typeRef": undefined,
             },
             formalParameter: [],
           };
@@ -108,7 +108,7 @@ export function useFunctionExpressionControllerCell(functionKind: DMN15__tFuncti
               "@_id": generateUuid(),
             },
             "@_kind": BoxedFunctionKind.Java,
-            "@_typeRef": DmnBuiltInDataType.Undefined,
+            "@_typeRef": undefined,
             formalParameter: [],
           };
           return retJava;
@@ -123,7 +123,7 @@ export function useFunctionExpressionControllerCell(functionKind: DMN15__tFuncti
               "@_id": generateUuid(),
             },
             "@_kind": BoxedFunctionKind.Pmml,
-            "@_typeRef": DmnBuiltInDataType.Undefined,
+            "@_typeRef": undefined,
             formalParameter: [],
           };
           return retPmml;
@@ -167,7 +167,9 @@ export function useFunctionExpressionParametersColumnHeader(
                   <React.Fragment key={i}>
                     <span>{parameter["@_name"]}</span>
                     <span>{": "}</span>
-                    <span className={"expression-info-data-type"}>({parameter["@_typeRef"]})</span>
+                    <span className={"expression-info-data-type"}>
+                      ({parameter["@_typeRef"] ?? DmnBuiltInDataType.Undefined})
+                    </span>
                     {i < (formalParameters ?? []).length - 1 && <span>{", "}</span>}
                   </React.Fragment>
                 ))}

packages/boxed-expression-component/src/expressions/FunctionExpression/JavaFunctionExpression.tsx

@@ -29,10 +29,10 @@ import {
   BeeTableOperation,
   BeeTableOperationConfig,
   BeeTableProps,
-  DmnBuiltInDataType,
+  BoxedFunction,
   BoxedFunctionKind,
+  DmnBuiltInDataType,
   generateUuid,
-  BoxedFunction,
 } from "../../api";
 import { useBoxedExpressionEditorI18n } from "../../i18n";
 import { usePublishedBeeTableResizableColumns } from "../../resizing/BeeTableResizableColumnsContext";

packages/boxed-expression-component/src/expressions/FunctionExpression/ParametersPopover.tsx

@@ -24,7 +24,7 @@ import { CubesIcon } from "@patternfly/react-icons/dist/js/icons/cubes-icon";
 import { OutlinedTrashAltIcon } from "@patternfly/react-icons/dist/js/icons/outlined-trash-alt-icon";
 import * as React from "react";
 import { ChangeEvent, useCallback } from "react";
-import { DmnBuiltInDataType, BoxedFunction, generateUuid, getNextAvailablePrefixedName } from "../../api";
+import { BoxedFunction, DmnBuiltInDataType, generateUuid, getNextAvailablePrefixedName } from "../../api";
 import { useBoxedExpressionEditorI18n } from "../../i18n";
 import { useBoxedExpressionEditorDispatch } from "../../BoxedExpressionEditorContext";
 import { DMN15__tInformationItem } from "@kie-tools/dmn-marshaller/dist/schemas/dmn-1_5/ts-gen/types";
@@ -51,7 +51,7 @@ export const ParametersPopover: React.FunctionComponent<ParametersPopoverProps>
               (prev.formalParameter ?? []).map((p) => p["@_name"]),
               "p"
             ),
-            "@_typeRef": DmnBuiltInDataType.Undefined,
+            "@_typeRef": undefined,
           },
         ];
 
@@ -120,7 +120,7 @@ function ParameterEntry({ parameter, index }: { parameter: DMN15__tInformationIt
   );
 
   const onDataTypeChange = useCallback(
-    (typeRef: string) => {
+    (typeRef: string | undefined) => {
       setExpression((prev: BoxedFunction) => {
         const newParameters = [...(prev.formalParameter ?? [])];
         newParameters[index] = {
@@ -166,11 +166,7 @@ function ParameterEntry({ parameter, index }: { parameter: DMN15__tInformationIt
         placeholder={"Parameter Name"}
         defaultValue={parameter["@_name"]}
       />
-      <DataTypeSelector
-        value={parameter["@_typeRef"] ?? DmnBuiltInDataType.Undefined}
-        onChange={onDataTypeChange}
-        menuAppendTo="parent"
-      />
+      <DataTypeSelector value={parameter["@_typeRef"]} onChange={onDataTypeChange} menuAppendTo="parent" />
       <Button
         variant="danger"
         className="delete-parameter"

packages/boxed-expression-component/src/expressions/FunctionExpression/PmmlFunctionExpression.tsx

@@ -30,6 +30,7 @@ import {
   BeeTableProps,
   BoxedFunction,
   BoxedFunctionKind,
+  DmnBuiltInDataType,
   generateUuid,
 } from "../../api";
 import { useBoxedExpressionEditorI18n } from "../../i18n";
@@ -89,7 +90,7 @@ export function PmmlFunctionExpression({
       {
         accessor: expressionHolderId as any, // FIXME: https://github.com/apache/incubator-kie-issues/issues/169
         label: functionExpression["@_label"] ?? DEFAULT_EXPRESSION_VARIABLE_NAME,
-        dataType: functionExpression["@_typeRef"] ?? "",
+        dataType: functionExpression["@_typeRef"] ?? DmnBuiltInDataType.Undefined,
         isRowIndexColumn: false,
         width: undefined,
         columns: [