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 9fb900084c0 kie-issues#928: On the DMN Editor, don't allow the DRD
selection panel to open at the same time as DRG / External nodes panel (#2157)
9fb900084c0 is described below
commit 9fb900084c056d66a8895cbc2e77ee5578989575
Author: Tiago Bento <[email protected]>
AuthorDate: Wed Feb 14 11:10:32 2024 -0500
kie-issues#928: On the DMN Editor, don't allow the DRD selection panel to
open at the same time as DRG / External nodes panel (#2157)
---
packages/dmn-editor/src/diagram/Diagram.tsx | 4 +--
.../dmn-editor/src/diagram/DrdSelectorPanel.tsx | 5 ++-
packages/dmn-editor/src/diagram/DrgNodesPanel.tsx | 4 +--
packages/dmn-editor/src/diagram/Palette.tsx | 37 ++++++++++++----------
.../src/externalNodes/ExternalNodesPanel.tsx | 4 +--
packages/dmn-editor/src/store/Store.ts | 13 +++-----
6 files changed, 32 insertions(+), 35 deletions(-)
diff --git a/packages/dmn-editor/src/diagram/Diagram.tsx
b/packages/dmn-editor/src/diagram/Diagram.tsx
index 3fb72742c7b..3740b0ea1c4 100644
--- a/packages/dmn-editor/src/diagram/Diagram.tsx
+++ b/packages/dmn-editor/src/diagram/Diagram.tsx
@@ -75,7 +75,7 @@ import { repositionNode } from "../mutations/repositionNode";
import { resizeNode } from "../mutations/resizeNode";
import { updateExpression } from "../mutations/updateExpression";
import { OverlaysPanel } from "../overlaysPanel/OverlaysPanel";
-import { DiagramNodesPanel, SnapGrid } from "../store/Store";
+import { DiagramLhsPanel, SnapGrid } from "../store/Store";
import { useDmnEditorStore, useDmnEditorStoreApi } from
"../store/StoreContext";
import { Unpacked } from "../tsExt/tsExt";
import { buildXmlHref, parseXmlHref } from "../xml/xmlHrefs";
@@ -1071,7 +1071,7 @@ export const Diagram = React.forwardRef<DiagramRef, {
container: React.RefObject
console.debug("DMN DIAGRAM: Esc pressed. Closing all open
panels.");
state.diagram.propertiesPanel.isOpen = false;
state.diagram.overlaysPanel.isOpen = false;
- state.diagram.openNodesPanel = DiagramNodesPanel.NONE;
+ state.diagram.openLhsPanel = DiagramLhsPanel.NONE;
e.preventDefault();
} else {
// Let the
diff --git a/packages/dmn-editor/src/diagram/DrdSelectorPanel.tsx
b/packages/dmn-editor/src/diagram/DrdSelectorPanel.tsx
index 40a3b787f61..4b1627ee71b 100644
--- a/packages/dmn-editor/src/diagram/DrdSelectorPanel.tsx
+++ b/packages/dmn-editor/src/diagram/DrdSelectorPanel.tsx
@@ -24,7 +24,7 @@ import { Text, TextContent } from
"@patternfly/react-core/dist/js/components/Tex
import { Button, ButtonVariant } from
"@patternfly/react-core/dist/js/components/Button";
import { PlusCircleIcon } from
"@patternfly/react-icons/dist/js/icons/plus-circle-icon";
import { Divider } from "@patternfly/react-core/dist/js/components/Divider";
-import { DiagramNodesPanel } from "../store/Store";
+import { DiagramLhsPanel } from "../store/Store";
import { getDrdId } from "./drd/drdId";
import { Title } from "@patternfly/react-core/dist/js/components/Title";
import { Form, FormGroup, FormSection } from
"@patternfly/react-core/dist/js/components/Form";
@@ -76,8 +76,7 @@ export function DrdSelectorPanel() {
});
state.diagram.drdIndex = newIndex;
- state.diagram.drdSelector.isOpen = false;
- state.diagram.openNodesPanel = DiagramNodesPanel.DRG_NODES;
+ state.diagram.openLhsPanel = DiagramLhsPanel.DRG_NODES;
state.focus.consumableId = getDrdId({ drdIndex: newIndex });
});
}}
diff --git a/packages/dmn-editor/src/diagram/DrgNodesPanel.tsx
b/packages/dmn-editor/src/diagram/DrgNodesPanel.tsx
index 2957f0eec09..29d112f2fea 100644
--- a/packages/dmn-editor/src/diagram/DrgNodesPanel.tsx
+++ b/packages/dmn-editor/src/diagram/DrgNodesPanel.tsx
@@ -26,7 +26,7 @@ import { TimesIcon } from
"@patternfly/react-icons/dist/js/icons/times-icon";
import * as React from "react";
import { useCallback, useState } from "react";
import { DmnObjectListItem } from "../externalNodes/DmnObjectListItem";
-import { DiagramNodesPanel } from "../store/Store";
+import { DiagramLhsPanel } from "../store/Store";
import { useDmnEditorStore, useDmnEditorStoreApi } from
"../store/StoreContext";
import { Unpacked } from "../tsExt/tsExt";
import { buildXmlHref } from "../xml/xmlHrefs";
@@ -90,7 +90,7 @@ export function DrgNodesPanel() {
variant={ButtonVariant.plain}
onClick={() =>
dmnEditorStoreApi.setState((state) => {
- state.diagram.openNodesPanel = DiagramNodesPanel.NONE;
+ state.diagram.openLhsPanel = DiagramLhsPanel.NONE;
})
}
>
diff --git a/packages/dmn-editor/src/diagram/Palette.tsx
b/packages/dmn-editor/src/diagram/Palette.tsx
index 9f1b6c0734f..02b2538f2dd 100644
--- a/packages/dmn-editor/src/diagram/Palette.tsx
+++ b/packages/dmn-editor/src/diagram/Palette.tsx
@@ -22,7 +22,7 @@ import * as React from "react";
import { useCallback } from "react";
import { NodeType } from "./connections/graphStructure";
import { NODE_TYPES } from "./nodes/NodeTypes";
-import { DiagramNodesPanel } from "../store/Store";
+import { DiagramLhsPanel } from "../store/Store";
import { useDmnEditorStore, useDmnEditorStoreApi } from
"../store/StoreContext";
import { addStandaloneNode } from "../mutations/addStandaloneNode";
import { CONTAINER_NODES_DESIRABLE_PADDING, getBounds } from
"./maths/DmnMaths";
@@ -122,13 +122,13 @@ export function Palette({ pulse }: { pulse: boolean }) {
/>
<Popover
className={"kie-dmn-editor--drd-selector-popover"}
- key={`${diagram.drdSelector.isOpen}`}
+ key={DiagramLhsPanel.DRD_SELECTOR}
aria-label={"DRD Selector Popover"}
- isVisible={diagram.drdSelector.isOpen}
+ isVisible={diagram.openLhsPanel === DiagramLhsPanel.DRD_SELECTOR}
reference={() => drdSelectorPopoverRef.current!}
shouldClose={() => {
dmnEditorStoreApi.setState((state) => {
- state.diagram.drdSelector.isOpen = false;
+ state.diagram.openLhsPanel = DiagramLhsPanel.NONE;
});
}}
position={"bottom-start"}
@@ -139,7 +139,10 @@ export function Palette({ pulse }: { pulse: boolean }) {
title="DRD selector"
onClick={() => {
dmnEditorStoreApi.setState((state) => {
- state.diagram.drdSelector.isOpen =
!state.diagram.drdSelector.isOpen;
+ state.diagram.openLhsPanel =
+ state.diagram.openLhsPanel === DiagramLhsPanel.DRD_SELECTOR
+ ? DiagramLhsPanel.NONE
+ : DiagramLhsPanel.DRD_SELECTOR;
});
}}
>
@@ -213,7 +216,7 @@ export function Palette({ pulse }: { pulse: boolean }) {
</aside>
<br />
<aside className={"kie-dmn-editor--drg-panel-toggle"}>
- {diagram.openNodesPanel === DiagramNodesPanel.DRG_NODES && (
+ {diagram.openLhsPanel === DiagramLhsPanel.DRG_NODES && (
<div className={"kie-dmn-editor--palette-nodes-popover"} style={{
maxHeight }}>
<DrgNodesPanel />
</div>
@@ -221,14 +224,14 @@ export function Palette({ pulse }: { pulse: boolean }) {
<button
title="DRG nodes"
className={`kie-dmn-editor--drg-panel-toggle-button ${
- diagram.openNodesPanel === DiagramNodesPanel.DRG_NODES ?
"active" : ""
+ diagram.openLhsPanel === DiagramLhsPanel.DRG_NODES ? "active" :
""
}`}
onClick={() => {
dmnEditorStoreApi.setState((state) => {
- state.diagram.openNodesPanel =
- state.diagram.openNodesPanel === DiagramNodesPanel.DRG_NODES
- ? DiagramNodesPanel.NONE
- : DiagramNodesPanel.DRG_NODES;
+ state.diagram.openLhsPanel =
+ state.diagram.openLhsPanel === DiagramLhsPanel.DRG_NODES
+ ? DiagramLhsPanel.NONE
+ : DiagramLhsPanel.DRG_NODES;
});
}}
>
@@ -237,7 +240,7 @@ export function Palette({ pulse }: { pulse: boolean }) {
</aside>
<br />
<aside className={"kie-dmn-editor--external-nodes-panel-toggle"}>
- {diagram.openNodesPanel === DiagramNodesPanel.EXTERNAL_NODES && (
+ {diagram.openLhsPanel === DiagramLhsPanel.EXTERNAL_NODES && (
<div className={"kie-dmn-editor--palette-nodes-popover"} style={{
maxHeight }}>
<ExternalNodesPanel />
</div>
@@ -246,14 +249,14 @@ export function Palette({ pulse }: { pulse: boolean }) {
<button
title="External nodes"
className={`kie-dmn-editor--external-nodes-panel-toggle-button ${
- diagram.openNodesPanel === DiagramNodesPanel.EXTERNAL_NODES ?
"active" : ""
+ diagram.openLhsPanel === DiagramLhsPanel.EXTERNAL_NODES ?
"active" : ""
}`}
onClick={() => {
dmnEditorStoreApi.setState((state) => {
- state.diagram.openNodesPanel =
- state.diagram.openNodesPanel ===
DiagramNodesPanel.EXTERNAL_NODES
- ? DiagramNodesPanel.NONE
- : DiagramNodesPanel.EXTERNAL_NODES;
+ state.diagram.openLhsPanel =
+ state.diagram.openLhsPanel === DiagramLhsPanel.EXTERNAL_NODES
+ ? DiagramLhsPanel.NONE
+ : DiagramLhsPanel.EXTERNAL_NODES;
});
}}
>
diff --git a/packages/dmn-editor/src/externalNodes/ExternalNodesPanel.tsx
b/packages/dmn-editor/src/externalNodes/ExternalNodesPanel.tsx
index 07fb04aaa20..32c2a1e798c 100644
--- a/packages/dmn-editor/src/externalNodes/ExternalNodesPanel.tsx
+++ b/packages/dmn-editor/src/externalNodes/ExternalNodesPanel.tsx
@@ -19,7 +19,7 @@
import * as React from "react";
import { useCallback, useState } from "react";
-import { DiagramNodesPanel, DmnEditorTab } from "../store/Store";
+import { DiagramLhsPanel, DmnEditorTab } from "../store/Store";
import { useDmnEditorStore, useDmnEditorStoreApi } from
"../store/StoreContext";
import { Flex } from "@patternfly/react-core/dist/js/layouts/Flex";
import { buildXmlHref } from "../xml/xmlHrefs";
@@ -108,7 +108,7 @@ export function ExternalNodesPanel() {
variant={ButtonVariant.plain}
onClick={() =>
dmnEditorStoreApi.setState((state) => {
- state.diagram.openNodesPanel = DiagramNodesPanel.NONE;
+ state.diagram.openLhsPanel = DiagramLhsPanel.NONE;
})
}
>
diff --git a/packages/dmn-editor/src/store/Store.ts
b/packages/dmn-editor/src/store/Store.ts
index 62b5a9289b2..feb47b5d0d1 100644
--- a/packages/dmn-editor/src/store/Store.ts
+++ b/packages/dmn-editor/src/store/Store.ts
@@ -56,8 +56,9 @@ export interface SnapGrid {
y: number;
}
-export enum DiagramNodesPanel {
+export enum DiagramLhsPanel {
NONE = "NONE",
+ DRD_SELECTOR = "DRD_SELECTOR",
DRG_NODES = "DRG_NODES",
EXTERNAL_NODES = "EXTERNAL_NODES",
}
@@ -97,10 +98,7 @@ export interface State {
overlaysPanel: {
isOpen: boolean;
};
- openNodesPanel: DiagramNodesPanel;
- drdSelector: {
- isOpen: boolean;
- };
+ openLhsPanel: DiagramLhsPanel;
overlays: {
enableNodeHierarchyHighlight: boolean;
enableExecutionHitsHighlights: boolean;
@@ -193,10 +191,7 @@ export const defaultStaticState = (): Omit<State, "dmn" |
"dispatch" | "computed
overlaysPanel: {
isOpen: false,
},
- openNodesPanel: DiagramNodesPanel.NONE,
- drdSelector: {
- isOpen: false,
- },
+ openLhsPanel: DiagramLhsPanel.NONE,
overlays: {
enableNodeHierarchyHighlight: false,
enableExecutionHitsHighlights: false,
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
