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 96ba3c63f12 kie-issues#1871: New Test Scenario Editor doesn't show the
file path in then settings and creation panels (#2994)
96ba3c63f12 is described below
commit 96ba3c63f12e1df32cf7efdfbaf38f552fcfc3ca
Author: Daniel José dos Santos <[email protected]>
AuthorDate: Thu Mar 13 13:34:05 2025 -0300
kie-issues#1871: New Test Scenario Editor doesn't show the file path in
then settings and creation panels (#2994)
---
.../src/creation/TestScenarioCreationPanel.tsx | 34 +++++++++++-----
.../src/drawer/TestScenarioDrawerSettingsPanel.tsx | 47 ++++++++++++++--------
.../scesim-editor/tests-e2e/__fixtures__/editor.ts | 3 +-
3 files changed, 57 insertions(+), 27 deletions(-)
diff --git a/packages/scesim-editor/src/creation/TestScenarioCreationPanel.tsx
b/packages/scesim-editor/src/creation/TestScenarioCreationPanel.tsx
index b50d9a6e15a..b2b867a7fb5 100644
--- a/packages/scesim-editor/src/creation/TestScenarioCreationPanel.tsx
+++ b/packages/scesim-editor/src/creation/TestScenarioCreationPanel.tsx
@@ -46,6 +46,7 @@ import { createNewDmnTypeTestScenario } from
"../mutations/createNewDmnTypeTestS
import { createNewRuleTypeTestScenario } from
"../mutations/createNewRuleTypeTestScenario";
import "./TestScenarioCreationPanel.css";
+import { Select, SelectOption, SelectVariant } from
"@patternfly/react-core/dist/js/components/Select";
function TestScenarioCreationPanel() {
const { i18n } = useTestScenarioEditorI18n();
@@ -175,6 +176,8 @@ function TestScenarioCreationPanel() {
]
);
+ const [isModelSelectOpen, setModelSelectOpen] = useState(false);
+
return (
<EmptyState>
<EmptyStateIcon icon={CubesIcon} />
@@ -197,25 +200,38 @@ function TestScenarioCreationPanel() {
{assetType === "DMN" && (
<>
<FormGroup isRequired label={i18n.creationPanel.dmnGroup}>
- <FormSelect
+ <Select
+ variant={SelectVariant.single}
id="dmn-select"
name="dmn-select"
- onChange={(dmnModelPathRelativeToThisScesim) => {
+ onToggle={setModelSelectOpen}
+ isOpen={isModelSelectOpen}
+ typeAheadAriaLabel={"Select a model..."}
+ placeholderText={"Select a model..."}
+ onSelect={(e, dmnModelPathRelativeToThisScesim) => {
+ if (typeof dmnModelPathRelativeToThisScesim !== "string") {
+ throw new Error(
+ `Invalid path for an included model
${JSON.stringify(dmnModelPathRelativeToThisScesim)}`
+ );
+ }
+
console.debug(`[TestScenarioCreationPanel] Selected path
${dmnModelPathRelativeToThisScesim}`);
setSelectedDmnModelPathRelativeToThisScesim(dmnModelPathRelativeToThisScesim);
+ setModelSelectOpen(false);
}}
- value={selectedDmnModelPathRelativeToThisScesim}
+ selections={selectedDmnModelPathRelativeToThisScesim}
>
- <FormSelectOption key={undefined} isDisabled
label={i18n.creationPanel.dmnNoChoice} />
{((allDmnModelNormalizedPosixRelativePaths?.length ?? 0) > 0 &&
allDmnModelNormalizedPosixRelativePaths?.map((normalizedPosixPathRelativeToTheOpenFile)
=> (
- <FormSelectOption
+ <SelectOption
key={normalizedPosixPathRelativeToTheOpenFile}
value={normalizedPosixPathRelativeToTheOpenFile}
-
label={basename(normalizedPosixPathRelativeToTheOpenFile)}
- />
- ))) || <FormSelectOption key={undefined} isDisabled
label={i18n.creationPanel.dmnNoPresent} />}
- </FormSelect>
+ description={normalizedPosixPathRelativeToTheOpenFile}
+ >
+ {basename(normalizedPosixPathRelativeToTheOpenFile)}
+ </SelectOption>
+ ))) || [<SelectOption key={undefined} isDisabled
label={i18n.creationPanel.dmnNoPresent} />]}
+ </Select>
</FormGroup>
<FormGroup>
<Checkbox
diff --git
a/packages/scesim-editor/src/drawer/TestScenarioDrawerSettingsPanel.tsx
b/packages/scesim-editor/src/drawer/TestScenarioDrawerSettingsPanel.tsx
index c1f5b94f27f..b68112ddc81 100644
--- a/packages/scesim-editor/src/drawer/TestScenarioDrawerSettingsPanel.tsx
+++ b/packages/scesim-editor/src/drawer/TestScenarioDrawerSettingsPanel.tsx
@@ -21,7 +21,6 @@ import { useCallback, useMemo, useState } from "react";
import { basename } from "path";
import { Checkbox } from "@patternfly/react-core/dist/esm/components/Checkbox";
-import { FormSelect, FormSelectOption } from
"@patternfly/react-core/dist/esm/components/FormSelect";
import { HelpIcon } from "@patternfly/react-icons/dist/esm/icons/help-icon";
import { Icon } from "@patternfly/react-core/dist/esm/components/Icon/Icon";
import { TextInput } from
"@patternfly/react-core/dist/js/components/TextInput";
@@ -39,6 +38,7 @@ import { ExternalDmn } from "../TestScenarioEditor";
import { useTestScenarioEditor } from "../TestScenarioEditorContext";
import "./TestScenarioDrawerSettingsPanel.css";
+import { Select, SelectOption, SelectVariant } from
"@patternfly/react-core/dist/js/components/Select";
function TestScenarioDrawerSettingsPanel() {
const { i18n } = useTestScenarioEditorI18n();
@@ -142,7 +142,7 @@ function TestScenarioDrawerSettingsPanel() {
}),
[testScenarioEditorStoreApi]
);
-
+ const [isModelSelectOpen, setModelSelectOpen] = useState(false);
return (
<>
<Title className={"kie-scesim-editor-drawer-settings--title"}
headingLevel={"h6"}>
@@ -170,32 +170,45 @@ function TestScenarioDrawerSettingsPanel() {
<Title className={"kie-scesim-editor-drawer-settings--title"}
headingLevel={"h6"}>
{i18n.drawer.settings.dmnModel}
</Title>
- <FormSelect
+ <Select
+ variant={SelectVariant.single}
aria-label="form-select-input"
className={"kie-scesim-editor-drawer-settings--form-select"}
ouiaId="BasicFormSelect"
- onChange={(path) => {
+ onToggle={setModelSelectOpen}
+ isOpen={isModelSelectOpen}
+ onSelect={(e, path) => {
if (typeof path !== "string") {
throw new Error(`Invalid path for an included model
${JSON.stringify(path)}`);
}
setSelectedDmnPathRelativeToThisScesim(path);
console.debug("[TestScenarioDrawerSettingsPanel] Selected path:
", path);
+ setModelSelectOpen(false);
}}
validated={isSelectedDmnValid ? undefined : "error"}
- value={isSelectedDmnValid ? settingsModel.dmnFilePath?.__$$text :
undefined}
+ selections={isSelectedDmnValid ?
settingsModel.dmnFilePath?.__$$text : undefined}
>
- {!selectedDmnModel && (
- <FormSelectOption key={undefined} isDisabled
label={i18n.drawer.settings.dmnModelReferenceError} />
- )}
- {((allDmnModelNormalizedPosixRelativePaths?.length ?? 0) > 0 &&
-
allDmnModelNormalizedPosixRelativePaths?.map((normalizedPosixPathRelativeToTheOpenFile)
=> (
- <FormSelectOption
- key={normalizedPosixPathRelativeToTheOpenFile}
- value={normalizedPosixPathRelativeToTheOpenFile}
- label={basename(normalizedPosixPathRelativeToTheOpenFile)}
- />
- ))) || <FormSelectOption key={undefined} isDisabled
label={i18n.creationPanel.dmnNoPresent} />}
- </FormSelect>
+ {!selectedDmnModel
+ ? [
+ <SelectOption key={undefined} isDisabled>
+ {i18n.drawer.settings.dmnModelReferenceError}
+ </SelectOption>,
+ ]
+ : ((allDmnModelNormalizedPosixRelativePaths?.length ?? 0) > 0 &&
+
allDmnModelNormalizedPosixRelativePaths?.map((normalizedPosixPathRelativeToTheOpenFile)
=> (
+ <SelectOption
+ key={normalizedPosixPathRelativeToTheOpenFile}
+ value={normalizedPosixPathRelativeToTheOpenFile}
+ description={normalizedPosixPathRelativeToTheOpenFile}
+ >
+ {basename(normalizedPosixPathRelativeToTheOpenFile)}
+ </SelectOption>
+ ))) || [
+ <SelectOption key={"none-dmn"} isDisabled={true}
description={""} value={undefined}>
+ {i18n.creationPanel.dmnNoPresent}
+ </SelectOption>,
+ ]}
+ </Select>
<Title className={"kie-scesim-editor-drawer-settings--title"}
headingLevel={"h6"}>
{i18n.drawer.settings.dmnName}
</Title>
diff --git a/packages/scesim-editor/tests-e2e/__fixtures__/editor.ts
b/packages/scesim-editor/tests-e2e/__fixtures__/editor.ts
index d9131bf1f69..29c333fe154 100644
--- a/packages/scesim-editor/tests-e2e/__fixtures__/editor.ts
+++ b/packages/scesim-editor/tests-e2e/__fixtures__/editor.ts
@@ -49,7 +49,8 @@ export class Editor {
? await this.page.locator("#asset-type-select").selectOption("DMN")
: await this.page.locator("#asset-type-select").selectOption("RULE");
if (type === AssetType.DECISION) {
- await this.page.locator("#dmn-select").selectOption("empty.dmn");
+ await this.page.getByLabel("Select a model...").click();
+ await this.page.getByRole("option", { name: "empty.dmn empty.dmn"
}).click();
}
await this.page.getByRole("button", { name: "Create" }).click();
await this.selectorPanel.close();
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
