Skip to content

Commit fc2a662

Browse files
Test button tweaks (#7971)
* test button refactor * merge fix * bugfix * Updated snapshots (#7977) Co-authored-by: JulianWielga <[email protected]> * label tweak * disable some actions when window visible * cleanup * fixed action types * minor changes * unify test action creators * cleanup * lock button with pending changes * fixed imports --------- Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: JulianWielga <[email protected]>
1 parent 3d6e9b6 commit fc2a662

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+593
-427
lines changed

designer/client/src/actions/actionTypes.ts

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ export type ActionTypes =
44
| "LOGGED_USER"
55
| "UI_SETTINGS"
66
| "AVAILABLE_QUERY_STATES"
7-
| "SWITCH_TOOL_TIPS_HIGHLIGHT"
87
| "ZOOM_IN"
98
| "ZOOM_OUT"
109
| "DELETE_NODES"
@@ -21,14 +20,11 @@ export type ActionTypes =
2120
| "EDIT_LABELS"
2221
| "SHOW_METRICS"
2322
| "UPDATE_TEST_CAPABILITIES"
24-
| "UPDATE_TEST_TYPE"
2523
| "DISPLAY_PROCESS"
2624
| "GET_SCENARIO_ACTIVITIES"
2725
| "UPDATE_SCENARIO_ACTIVITIES"
2826
| "PROCESS_FETCH"
2927
| "PROCESS_LOADING"
30-
| "TEST_RESULTS_LOADING"
31-
| "TEST_RESULTS_FAILED"
3228
| "LOADING_FAILED"
3329
| "CLEAR_PROCESS"
3430
| "TOGGLE_PROCESS_ACTION_MODAL"

designer/client/src/actions/nk/displayTestResults.ts

Lines changed: 62 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -3,71 +3,87 @@ import type { ProcessName } from "src/components/Process/types";
33
import type { TestResults } from "../../common/TestResultUtils";
44
import type { SourceWithParametersTest, TestProcessResponse } from "../../http/HttpService";
55
import HttpService from "../../http/HttpService";
6+
import { getProcessName, getScenarioGraph } from "../../reducers/selectors/graph";
67
import type { ScenarioGraph } from "../../types";
7-
import type { ThunkAction } from "../reduxTypes";
8+
import type { Action, ThunkAction } from "../reduxTypes";
89
import { displayProcessCounts } from "./displayProcessCounts";
910

10-
export function testProcessFromFile(processName: ProcessName, testDataFile: File, scenarioGraph: ScenarioGraph): ThunkAction {
11-
return (dispatch) => {
12-
dispatch({
13-
type: "PROCESS_LOADING",
14-
});
11+
export function testProcessFromFile(testDataFile: File): ThunkAction {
12+
return wrapWithTestAction((processName, scenarioGraph) =>
13+
HttpService.testProcess(processName, testDataFile, scenarioGraph).then(({ data }) => ({
14+
testResults: data,
15+
})),
16+
);
17+
}
1518

16-
HttpService.testProcess(processName, testDataFile, scenarioGraph)
17-
.then((response) => dispatch(displayTestResults(response.data)))
18-
.catch(() => dispatch({ type: "LOADING_FAILED" }));
19-
};
19+
export function testProcessWithParameters(testData: SourceWithParametersTest): ThunkAction {
20+
return wrapWithTestAction((processName, scenarioGraph) =>
21+
HttpService.testProcessWithParameters(processName, testData, scenarioGraph).then(({ data }) => ({
22+
testResults: data,
23+
testData,
24+
})),
25+
);
26+
}
27+
28+
export function testScenarioWithGeneratedData(testSampleSize: string): ThunkAction {
29+
return wrapWithTestAction((processName, scenarioGraph) =>
30+
HttpService.testScenarioWithGeneratedData(processName, parseInt(testSampleSize), scenarioGraph).then(({ data }) => ({
31+
testResults: data,
32+
})),
33+
);
2034
}
2135

22-
export function testProcessWithParameters(
23-
processName: ProcessName,
24-
testData: SourceWithParametersTest,
25-
scenarioGraph: ScenarioGraph,
36+
export type TestsActions =
37+
| { type: "TEST_RESULTS_LOADING" }
38+
| { type: "TEST_RESULTS_FAILED" }
39+
| {
40+
type: "DISPLAY_TEST_RESULTS_DETAILS";
41+
testResults: TestResults;
42+
testData?: SourceWithParametersTest;
43+
}
44+
| {
45+
type: "UPDATE_TEST_TYPE";
46+
testType: string;
47+
};
48+
49+
function wrapWithTestAction(
50+
fn: (
51+
processName: ProcessName,
52+
scenarioGraph: ScenarioGraph,
53+
) => Promise<{
54+
testResults: TestProcessResponse;
55+
testData?: SourceWithParametersTest;
56+
}>,
2657
): ThunkAction {
27-
return (dispatch) => {
58+
return (dispatch, getState) => {
2859
dispatch({ type: "TEST_RESULTS_LOADING" });
29-
30-
HttpService.testProcessWithParameters(processName, testData, scenarioGraph)
31-
.then((response) => {
32-
dispatch(displayTestResults(response.data, testData));
33-
})
60+
const state = getState();
61+
const scenarioGraph = getScenarioGraph(state);
62+
const processName = getProcessName(state);
63+
fn(processName, scenarioGraph)
64+
.then(({ testResults, testData }) => dispatch(displayTestResults(testResults, testData)))
3465
.catch(() => dispatch({ type: "TEST_RESULTS_FAILED" }));
3566
};
3667
}
3768

38-
export function testScenarioWithGeneratedData(testSampleSize: string, processName: ProcessName, scenarioGraph: ScenarioGraph): ThunkAction {
39-
return (dispatch) => {
40-
dispatch({
41-
type: "PROCESS_LOADING",
42-
});
43-
dispatch({ type: "TEST_RESULTS_LOADING" });
44-
45-
HttpService.testScenarioWithGeneratedData(processName, +testSampleSize, scenarioGraph)
46-
.then((response) => dispatch(displayTestResults(response.data)))
47-
.catch(() => {
48-
dispatch({ type: "LOADING_FAILED" });
49-
dispatch({ type: "TEST_RESULTS_FAILED" });
50-
});
69+
function displayTestResultsDetails(testResults: TestResults, testData?: SourceWithParametersTest): Action {
70+
return {
71+
type: "DISPLAY_TEST_RESULTS_DETAILS",
72+
testResults,
73+
testData,
5174
};
5275
}
5376

54-
export interface DisplayTestResultsDetailsAction {
55-
type: "DISPLAY_TEST_RESULTS_DETAILS";
56-
testResults: TestResults;
57-
testData?: SourceWithParametersTest;
58-
}
59-
60-
function displayTestResultsDetails(testResults: TestProcessResponse, testData?: SourceWithParametersTest): DisplayTestResultsDetailsAction {
77+
export function updateTestType(testType: string): Action {
6178
return {
62-
type: "DISPLAY_TEST_RESULTS_DETAILS",
63-
testResults: testResults.results,
64-
testData,
79+
type: "UPDATE_TEST_TYPE",
80+
testType,
6581
};
6682
}
6783

68-
function displayTestResults(testResults: TestProcessResponse, testData?: SourceWithParametersTest) {
84+
function displayTestResults({ counts, results }: TestProcessResponse, testData?: SourceWithParametersTest): ThunkAction {
6985
return (dispatch) => {
70-
dispatch(displayTestResultsDetails(testResults, testData));
71-
dispatch(displayProcessCounts(testResults.counts));
86+
dispatch(displayTestResultsDetails(results, testData));
87+
dispatch(displayProcessCounts(counts));
7288
};
7389
}
Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,13 @@
1-
import { SwitchToolTipsHighlightAction } from "../tooltips";
2-
import { LayoutChangedAction, PanelActions } from "./layout";
1+
import type { EditState } from "../../../components/graph/node-modal/node/useNodeState";
2+
import type { SwitchToolTipsHighlightAction } from "../tooltips";
3+
import type { LayoutChangedAction, PanelActions } from "./layout";
34

4-
export type UiActions = SwitchToolTipsHighlightAction | PanelActions | LayoutChangedAction;
5+
export type UiActions =
6+
| SwitchToolTipsHighlightAction
7+
| PanelActions
8+
| LayoutChangedAction
9+
| {
10+
type: "SET_PENDING_CHANGES";
11+
id: string;
12+
pendingChanges?: EditState;
13+
};

designer/client/src/actions/reduxTypes.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import type { SquashHistoryActions } from "../reducers/graph/historySquash";
77
import type { ScenariosActions } from "../reducers/scenarios";
88
import type { ActionTypes } from "./actionTypes";
99
import type { CountsActions, NodeActions, NodeDetailsActions, PropertiesActions, ScenarioActions, SelectionActions } from "./nk";
10-
import type { DisplayTestResultsDetailsAction } from "./nk/displayTestResults";
10+
import type { TestsActions } from "./nk/displayTestResults";
1111
import type { NotificationActions } from "./nk/notifications";
1212
import type { GetScenarioActivitiesAction, UpdateScenarioActivitiesAction } from "./nk/scenarioActivities";
1313
import type { ToolbarActions } from "./nk/toolbars";
@@ -18,7 +18,6 @@ import type { SettingsActions } from "./settingsActions";
1818
type TypedAction =
1919
| CloudDataActions
2020
| CountsActions
21-
| DisplayTestResultsDetailsAction
2221
| GetScenarioActivitiesAction
2322
| NodeActions
2423
| NodeDetailsActions
@@ -29,6 +28,7 @@ type TypedAction =
2928
| SelectionActions
3029
| SettingsActions
3130
| SquashHistoryActions
31+
| TestsActions
3232
| ToolbarActions
3333
| UiActions
3434
| UpdateScenarioActivitiesAction

designer/client/src/components/customRadio/CustomRadio.tsx

Lines changed: 53 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import React, { forwardRef } from "react";
66

77
import { getBorderColor } from "../../containers/theme/helpers";
88

9-
interface Props {
9+
export interface CustomRadioProps {
1010
label: string;
1111
value: string;
1212
Icon: SvgIconComponent | ComponentType<SVGProps<SVGSVGElement>>;
@@ -15,55 +15,57 @@ interface Props {
1515
title?: string;
1616
}
1717

18-
export const CustomRadio = forwardRef(({ label, value, Icon, disabled, active, title }: Props, ref: ForwardedRef<HTMLButtonElement>) => {
19-
return (
20-
<Box component={"label"} flex={1} title={title}>
21-
<Checkbox disabled={disabled} sx={{ display: "none" }} checked={active} value={value} ref={ref} />
22-
<Paper
23-
component={MenuItem}
24-
variant={"outlined"}
25-
square
26-
disabled={disabled}
27-
sx={(theme) => ({
28-
backgroundColor: theme.palette.background.paper,
29-
p: [1, 2],
30-
borderColor: active ? theme.palette.primary.main : getBorderColor(theme),
31-
cursor: "pointer",
32-
display: "flex",
33-
justifyContent: "center",
34-
alignItems: "center",
35-
gap: 1,
36-
})}
37-
>
38-
<Icon />
39-
<Typography textTransform={"capitalize"} variant={"caption"} sx={{ cursor: "inherit" }}>
40-
{label}
41-
</Typography>
42-
{active && (
43-
<>
44-
<Box
45-
sx={(theme) => ({
46-
backgroundColor: theme.palette.background.paper,
47-
position: "absolute",
48-
top: theme.spacing(-1.25),
49-
right: theme.spacing(-1.25),
50-
width: "1em",
51-
height: "1em",
52-
})}
53-
/>
54-
<CheckCircleIcon
55-
sx={(theme) => ({
56-
position: "absolute",
57-
top: theme.spacing(-1.25),
58-
right: theme.spacing(-1.25),
59-
})}
60-
color={"primary"}
61-
/>
62-
</>
63-
)}
64-
</Paper>
65-
</Box>
66-
);
67-
});
18+
export const CustomRadio = forwardRef(
19+
({ label, value, Icon, disabled, active, title }: CustomRadioProps, ref: ForwardedRef<HTMLButtonElement>) => {
20+
return (
21+
<Box component={"label"} flex={1} title={title}>
22+
<Checkbox disabled={disabled} sx={{ display: "none" }} checked={active} value={value} ref={ref} />
23+
<Paper
24+
component={MenuItem}
25+
variant={"outlined"}
26+
square
27+
disabled={disabled}
28+
sx={(theme) => ({
29+
backgroundColor: theme.palette.background.paper,
30+
p: [1, 2],
31+
borderColor: active ? theme.palette.primary.main : getBorderColor(theme),
32+
cursor: "pointer",
33+
display: "flex",
34+
justifyContent: "center",
35+
alignItems: "center",
36+
gap: 1,
37+
})}
38+
>
39+
<Icon />
40+
<Typography textTransform={"capitalize"} variant={"caption"} sx={{ cursor: "inherit" }}>
41+
{label}
42+
</Typography>
43+
{active && (
44+
<>
45+
<Box
46+
sx={(theme) => ({
47+
backgroundColor: theme.palette.background.paper,
48+
position: "absolute",
49+
top: theme.spacing(-1.25),
50+
right: theme.spacing(-1.25),
51+
width: "1em",
52+
height: "1em",
53+
})}
54+
/>
55+
<CheckCircleIcon
56+
sx={(theme) => ({
57+
position: "absolute",
58+
top: theme.spacing(-1.25),
59+
right: theme.spacing(-1.25),
60+
})}
61+
color={"primary"}
62+
/>
63+
</>
64+
)}
65+
</Paper>
66+
</Box>
67+
);
68+
},
69+
);
6870

6971
CustomRadio.displayName = "CustomRadio";

designer/client/src/components/graph/SelectionContextProvider.tsx

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ import { tryParseOrNull } from "../../common/JsonUtils";
2222
import { isInputEvent } from "../../containers/BindKeyboardShortcuts";
2323
import { useInterval } from "../../containers/Interval";
2424
import { useDocumentListeners } from "../../containers/useDocumentListeners";
25-
import { getHistoryCounts } from "../../reducers/selectors/getHistory";
25+
import { getGraphLocked, getHistoryCounts } from "../../reducers/selectors/getHistory";
2626
import { canModifySelectedNodes, getSelection, getSelectionState } from "../../reducers/selectors/graph";
2727
import { getCapabilities } from "../../reducers/selectors/other";
2828
import { getProcessDefinitionData } from "../../reducers/selectors/processDefinitionData";
@@ -35,7 +35,6 @@ type UserAction = ((e: Event) => unknown) | null;
3535
interface UserActions {
3636
copy: UserAction;
3737
paste: UserAction;
38-
canPaste: boolean;
3938
cut: UserAction;
4039
delete: UserAction;
4140
undo: UserAction;
@@ -115,15 +114,15 @@ export const useSelectionActions = (): UserActions => {
115114
return selectionActions;
116115
};
117116

118-
function useUndoRedoActions() {
117+
function useUndoRedoActions(disabled?: boolean) {
119118
const dispatch = useDispatch();
120119
const [past, future] = useSelector(getHistoryCounts);
121120
return useMemo(() => {
122121
return {
123-
undo: past <= 0 ? null : () => dispatch(UndoActionCreators.undo()),
124-
redo: future <= 0 ? null : () => dispatch(UndoActionCreators.redo()),
122+
undo: past <= 0 || disabled ? null : () => dispatch(UndoActionCreators.undo()),
123+
redo: future <= 0 || disabled ? null : () => dispatch(UndoActionCreators.redo()),
125124
};
126-
}, [past, future, dispatch]);
125+
}, [past, disabled, future, dispatch]);
127126
}
128127

129128
export default function SelectionContextProvider(
@@ -224,22 +223,24 @@ export default function SelectionContextProvider(
224223
);
225224

226225
const canAccessClipboard = useClipboardPermission();
227-
const undoRedoActions = useUndoRedoActions();
226+
227+
const graphLocked = useSelector(getGraphLocked);
228+
const undoRedoActions = useUndoRedoActions(graphLocked);
228229
const userActions: UserActions = useMemo(
229230
() => ({
230231
...undoRedoActions,
231232
copy: canModifySelected && !hasSelection && (() => dispatch(copySelection(copy))),
232-
canPaste: !!canAccessClipboard,
233-
paste: capabilities.editFrontend && ((e) => dispatch(pasteSelection(() => paste(e)))),
234-
cut: canModifySelected && capabilities.editFrontend && (() => dispatch(cutSelection(cut))),
235-
delete: canModifySelected && capabilities.editFrontend && (() => dispatch(deleteSelection(selectionState))),
236-
selectAll: () => dispatch(selectAll()),
237-
deselectAll: () => dispatch(resetSelection()),
233+
paste: !!canAccessClipboard && !graphLocked && capabilities.editFrontend && ((e) => dispatch(pasteSelection(() => paste(e)))),
234+
cut: !graphLocked && canModifySelected && capabilities.editFrontend && (() => dispatch(cutSelection(cut))),
235+
delete: !graphLocked && canModifySelected && capabilities.editFrontend && (() => dispatch(deleteSelection(selectionState))),
236+
selectAll: !graphLocked && (() => dispatch(selectAll())),
237+
deselectAll: !graphLocked && (() => dispatch(resetSelection())),
238238
}),
239239
[
240240
undoRedoActions,
241241
canModifySelected,
242242
hasSelection,
243+
graphLocked,
243244
canAccessClipboard,
244245
capabilities.editFrontend,
245246
dispatch,

designer/client/src/components/graph/node-modal/editors/expression/Editor.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import type { ForwardRefExoticComponent, LegacyRef, ReactNode } from "react";
2-
import type React from "react";
32

43
import type { VariableTypes } from "../../../../../types";
54
import type { FieldError } from "../Validators";
@@ -50,7 +49,7 @@ export type ExtendedEditor<P extends EditorProps = EditorProps> = SimpleEditor<P
5049
};
5150

5251
export function isExtendedEditor(editor: SimpleEditor | ExtendedEditor): editor is ExtendedEditor {
53-
return (editor as ExtendedEditor).isSwitchableTo !== undefined;
52+
return (editor as ExtendedEditor)?.isSwitchableTo !== undefined;
5453
}
5554

5655
export const editors: Record<EditorType, SimpleEditor | ExtendedEditor> = {

0 commit comments

Comments
 (0)