revert mui

TouK · Jan 9, 2025 · 36f60aa · 36f60aa
1 parent d4fe721
commit 36f60aa
Show file tree

Hide file tree

Showing 11 changed files with 43 additions and 86 deletions.
diff --git a/designer/client/src/components/modals/ActivityCommentTextField.tsx b/designer/client/src/components/modals/ActivityCommentTextField.tsx
diff --git a/designer/client/src/components/modals/ActivityHeader.tsx b/designer/client/src/components/modals/ActivityHeader.tsx
diff --git a/designer/client/src/components/modals/CalculateCounts/CalculateCountsDialog.tsx b/designer/client/src/components/modals/CalculateCounts/CalculateCountsDialog.tsx
@@ -59,7 +59,7 @@ export function CountsDialog({ children, ...props }: PropsWithChildren<WindowCon
                 classname: LoadingButtonTypes.secondaryButton,
             },
             {
-                title: t("dialog.button.ok", "Apply"),
+                title: t("dialog.button.ok", "Ok"),
                 disabled: !isStateValid,
                 action: async () => {
                     await confirm();

diff --git a/designer/client/src/components/modals/DeployProcessDialog.tsx b/designer/client/src/components/modals/DeployProcessDialog.tsx
@@ -7,19 +7,19 @@ import { getActivityParameters, getProcessName } from "../../reducers/selectors/
 import { getFeatureSettings } from "../../reducers/selectors/settings";
 import { ProcessName } from "../Process/types";
 import { PromptContent, WindowKind } from "../../windowManager";
+import CommentInput from "../comment/CommentInput";
+import ProcessDialogWarnings from "./ProcessDialogWarnings";
+import { FormHelperText, Typography } from "@mui/material";
 import { LoadingButtonTypes } from "../../windowManager/LoadingButton";
 import { ActivityNodeParameters } from "../../types/activity";
 import { AdvancedParametersSection } from "./AdvancedParametersSection";
 import { mapValues } from "lodash";
 import { NodesDeploymentData } from "../../http/HttpService";
 import { ActivityProperty } from "./ActivityProperty";
-import { ActivityCommentTextField } from "./ActivityCommentTextField";
-import { ActivityHeader } from "./ActivityHeader";
 import { NodeTable } from "../graph/node-modal/NodeDetailsContent/NodeTable";
 
 export type ToggleProcessActionModalData = {
     action: (processName: ProcessName, comment: string, nodeData: NodesDeploymentData) => Promise<unknown>;
-    activityName: string;
     displayWarnings?: boolean;
 };
 
@@ -36,12 +36,12 @@ function initialNodesData(params: ActivityNodeParameters[]) {
 export function DeployProcessDialog(props: WindowContentProps<WindowKind, ToggleProcessActionModalData>): JSX.Element {
     // TODO: get rid of meta
     const {
-        meta: { action, activityName, displayWarnings },
+        meta: { action, displayWarnings },
     } = props.data;
     const processName = useSelector(getProcessName);
 
     const activityParameters = useSelector(getActivityParameters);
-    const activityNodeParameters = activityParameters[activityName] || ([] as ActivityNodeParameters[]);
+    const activityNodeParameters = activityParameters["DEPLOY"] || ([] as ActivityNodeParameters[]);
     const initialValues = useMemo(() => initialNodesData(activityNodeParameters), [activityNodeParameters]);
     const [values, setValues] = useState(initialValues);
 
@@ -64,27 +64,32 @@ export function DeployProcessDialog(props: WindowContentProps<WindowKind, Toggle
     const { t } = useTranslation();
     const buttons: WindowButtonProps[] = useMemo(
         () => [
-            {
-                title: t("dialog.button.cancel", "Cancel"),
-                action: () => props.close(),
-                classname: LoadingButtonTypes.secondaryButton,
-            },
-            { title: t("dialog.button.ok", "Apply"), action: () => confirmAction() },
+            { title: t("dialog.button.cancel", "Cancel"), action: () => props.close(), classname: LoadingButtonTypes.secondaryButton },
+            { title: t("dialog.button.ok", "Ok"), action: () => confirmAction() },
         ],
         [confirmAction, props, t],
     );
 
     return (
         <PromptContent {...props} buttons={buttons}>
-            <div className={cx("modalContentDark", css({ minWidth: 600 }))}>
-                <ActivityHeader title={props.data.title} displayWarnings={displayWarnings} />
-                <ActivityCommentTextField
-                    placeholder={deploymentCommentSettings?.exampleComment}
-                    error={!!validationError}
-                    helperText={validationError}
+            <div className={cx("modalContentDark")}>
+                <Typography variant={"h3"}>{props.data.title}</Typography>
+                {displayWarnings && <ProcessDialogWarnings />}
+                <CommentInput
                     onChange={(e) => setComment(e.target.value)}
+                    value={comment}
+                    defaultValue={deploymentCommentSettings?.exampleComment}
+                    className={cx(
+                        css({
+                            minWidth: 600,
+                            minHeight: 80,
+                        }),
+                    )}
                     autoFocus
                 />
+                <FormHelperText title={validationError} error>
+                    {validationError}
+                </FormHelperText>
                 {activityNodeParameters.map((anp: ActivityNodeParameters) => (
                     <AdvancedParametersSection key={anp.nodeId} nodeId={anp.nodeId}>
                         <NodeTable>

diff --git a/designer/client/src/components/modals/GenerateTestDataDialog.tsx b/designer/client/src/components/modals/GenerateTestDataDialog.tsx
@@ -46,7 +46,7 @@ function GenerateTestDataDialog(props: WindowContentProps): JSX.Element {
     const buttons: WindowButtonProps[] = useMemo(
         () => [
             { title: t("dialog.button.cancel", "Cancel"), action: () => props.close(), classname: LoadingButtonTypes.secondaryButton },
-            { title: t("dialog.button.ok", "Apply"), disabled: !isValid, action: () => confirmAction() },
+            { title: t("dialog.button.ok", "Ok"), disabled: !isValid, action: () => confirmAction() },
         ],
         [t, confirmAction, props, isValid],
     );

diff --git a/designer/client/src/components/modals/SaveProcessDialog.tsx b/designer/client/src/components/modals/SaveProcessDialog.tsx
@@ -5,6 +5,7 @@ import { useTranslation } from "react-i18next";
 import { useDispatch } from "react-redux";
 import { displayCurrentProcessVersion, loadProcessToolbarsConfiguration } from "../../actions/nk";
 import { PromptContent } from "../../windowManager";
+import { CommentInput } from "../comment/CommentInput";
 import { ThunkAction } from "../../actions/reduxTypes";
 import {
     getScenarioGraph,
@@ -17,10 +18,9 @@ import HttpService from "../../http/HttpService";
 import { ActionCreators as UndoActionCreators } from "redux-undo";
 import { visualizationUrl } from "../../common/VisualizationUrl";
 import { useLocation, useNavigate } from "react-router-dom";
+import { Typography } from "@mui/material";
 import { LoadingButtonTypes } from "../../windowManager/LoadingButton";
 import { getScenarioActivities } from "../../actions/nk/scenarioActivities";
-import { ActivityCommentTextField } from "./ActivityCommentTextField";
-import { ActivityHeader } from "./ActivityHeader";
 
 export function SaveProcessDialog(props: WindowContentProps): JSX.Element {
     const location = useLocation();
@@ -71,16 +71,24 @@ export function SaveProcessDialog(props: WindowContentProps): JSX.Element {
     const buttons: WindowButtonProps[] = useMemo(
         () => [
             { title: t("dialog.button.cancel", "Cancel"), action: () => props.close(), classname: LoadingButtonTypes.secondaryButton },
-            { title: t("dialog.button.ok", "Apply"), action: () => confirmAction() },
+            { title: t("dialog.button.ok", "Ok"), action: () => confirmAction() },
         ],
         [confirmAction, props, t],
     );
 
     return (
         <PromptContent {...props} buttons={buttons}>
             <div className={cx("modalContentDark", css({ minWidth: 600 }))}>
-                <ActivityHeader title={props.data.title} />
-                <ActivityCommentTextField onChange={(e) => setState(e.target.value)} autoFocus />
+                <Typography variant={"h3"}>{props.data.title}</Typography>
+                <CommentInput
+                    onChange={(e) => setState(e.target.value)}
+                    value={comment}
+                    className={css({
+                        minWidth: 600,
+                        minHeight: 80,
+                    })}
+                    autoFocus
+                />
             </div>
         </PromptContent>
     );

diff --git a/designer/client/src/components/toolbars/process/buttons/SaveButton.tsx b/designer/client/src/components/toolbars/process/buttons/SaveButton.tsx
@@ -17,8 +17,8 @@ function SaveButton(props: ToolbarButtonProps): JSX.Element {
     const unsavedNewName = useSelector(getProcessUnsavedNewName);
     const isRenamed = useSelector(isProcessRenamed);
     const title = isRenamed
-        ? t("saveProcess.renameTitle", "Save scenario as", { name: unsavedNewName })
-        : t("saveProcess.title", "Save scenario", { name: processName });
+        ? t("saveProcess.renameTitle", "Save scenario as {{name}}", { name: unsavedNewName })
+        : t("saveProcess.title", "Save scenario {{name}}", { name: processName });
 
     const { open } = useWindows();
     const onClick = () =>

diff --git a/designer/client/src/components/toolbars/scenarioActions/buttons/CancelDeployButton.tsx b/designer/client/src/components/toolbars/scenarioActions/buttons/CancelDeployButton.tsx
@@ -36,7 +36,7 @@ export default function CancelDeployButton(props: ToolbarButtonProps) {
                     title: message,
                     kind: WindowKind.deployProcess,
                     width: ACTION_DIALOG_WIDTH,
-                    meta: { action, activityName: "CANCEL" },
+                    meta: { action },
                 })
             }
             type={type}

diff --git a/designer/client/src/components/toolbars/scenarioActions/buttons/DeployButton.tsx b/designer/client/src/components/toolbars/scenarioActions/buttons/DeployButton.tsx
@@ -57,7 +57,7 @@ export default function DeployButton(props: ToolbarButtonProps) {
                     title: message,
                     kind: WindowKind.deployProcess,
                     width: ACTION_DIALOG_WIDTH,
-                    meta: { action, activityName: "DEPLOY", displayWarnings: true },
+                    meta: { action, displayWarnings: true },
                 })
             }
             onMouseOver={deployMouseOver}

diff --git a/designer/client/src/components/toolbars/scenarioActions/buttons/RunOffScheduleButton.tsx b/designer/client/src/components/toolbars/scenarioActions/buttons/RunOffScheduleButton.tsx
@@ -52,7 +52,7 @@ export default function RunOffScheduleButton(props: ToolbarButtonProps) {
                         title: message,
                         kind: WindowKind.deployProcess,
                         width: ACTION_DIALOG_WIDTH,
-                        meta: { action, activityName: "RUN_OFF_SCHEDULE" }, // fixme: activityName, do we need this?
+                        meta: { action },
                     })
                 }
                 type={type}

diff --git a/designer/client/src/windowManager/PromptContent.tsx b/designer/client/src/windowManager/PromptContent.tsx
@@ -16,14 +16,7 @@ export function PromptContent(props: PropsWithChildren<DefaultContentProps>): JS
             paddingLeft: theme.custom.spacing.baseUnit * 6,
             paddingRight: theme.custom.spacing.baseUnit * 6,
         });
-        return {
-            footer: css({
-                justifyContent: "flex-end",
-                backgroundColor: "#1D2734",
-            }),
-            ...props.classnames,
-            content,
-        };
+        return { ...props.classnames, content };
     }, [props.classnames, theme.custom.spacing.baseUnit]);
 
     const components = useMemo(