Merge pull request #125 from Tauffer-Consulting/feature/sharable-work…

…flows Feature/sharable workflows
Tauffer-Consulting · Oct 28, 2023 · 031b35e · 031b35e
2 parents be887dc + 3116618
commit 031b35e
Show file tree

Hide file tree

Showing 14 changed files with 468 additions and 188 deletions.
diff --git a/frontend/src/components/Modal/index.tsx b/frontend/src/components/Modal/index.tsx
@@ -0,0 +1,81 @@
+import {
+  Button,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogContentText,
+  DialogTitle,
+  Grid,
+} from "@mui/material";
+import React, { useCallback, useImperativeHandle, useState } from "react";
+
+interface Props {
+  title: string;
+  content?: string | React.ReactNode;
+
+  confirmFn?: () => void;
+  cancelFn?: () => void;
+}
+
+export interface ModalRef {
+  open: () => void;
+  close: () => void;
+}
+
+export const Modal = React.forwardRef<ModalRef, Props>(
+  ({ cancelFn, confirmFn, title, content }, ref) => {
+    const [isOpen, setIsOpen] = useState(false);
+
+    const open = () => {
+      setIsOpen(true);
+    };
+
+    const handleClose = useCallback(() => {
+      if (cancelFn) {
+        cancelFn();
+      }
+
+      setIsOpen(false);
+    }, []);
+
+    const handleConfirm = useCallback(() => {
+      if (confirmFn) {
+        confirmFn();
+      }
+
+      setIsOpen(false);
+    }, []);
+
+    useImperativeHandle(ref, () => ({
+      open,
+      close: handleClose,
+    }));
+
+    return (
+      <Dialog open={isOpen} onClose={handleClose}>
+        <DialogTitle>{title}</DialogTitle>
+        <DialogContent>
+          <DialogContentText>{content}</DialogContentText>
+        </DialogContent>
+        <DialogActions>
+          <Grid container justifyContent="center" spacing={4}>
+            {cancelFn && (
+              <Grid item>
+                <Button onClick={handleClose} variant="contained">
+                  Cancel
+                </Button>
+              </Grid>
+            )}
+            <Grid item>
+              <Button onClick={handleConfirm} variant="contained">
+                OK
+              </Button>
+            </Grid>
+          </Grid>
+        </DialogActions>
+      </Dialog>
+    );
+  },
+);
+
+Modal.displayName = "Modal";
diff --git a/frontend/src/components/NewFeatureDialog/index.tsx b/frontend/src/components/NewFeatureDialog/index.tsx
diff --git a/frontend/src/components/WorkflowPanel/DefaultNode/index.tsx b/frontend/src/components/WorkflowPanel/DefaultNode/index.tsx
@@ -71,7 +71,7 @@ export const CustomNode = memo<DefaultNodeProps>(({ id, data, selected }) => {
       ...data.style.nodeStyle,
       display: "flex",
       flexDirection: "row",
-      justifyContent: "center",
+      justifyContent: "space-evenly",
       alignItems: "center",
 
       position: "relative",
@@ -88,7 +88,7 @@ export const CustomNode = memo<DefaultNodeProps>(({ id, data, selected }) => {
         backgroundColor: theme.palette.error.light,
         color: theme.palette.error.contrastText,
       }),
-    };
+    } satisfies CSSProperties;
   }, [data, selected]);
 
   const { sourcePosition, targetPosition } = useMemo(

diff --git a/frontend/src/components/WorkflowPanel/RunNode/index.tsx b/frontend/src/components/WorkflowPanel/RunNode/index.tsx
@@ -88,7 +88,7 @@ const RunNode = memo<RunNodeProps>(({ id, data, selected }) => {
       ...data.style.nodeStyle,
       display: "flex",
       flexDirection: "row",
-      justifyContent: "center",
+      justifyContent: "space-evenly",
       alignItems: "center",
       textAlign: "center",
       position: "relative",

diff --git a/frontend/src/features/workflowEditor/components/SidebarForm/index.tsx b/frontend/src/features/workflowEditor/components/SidebarForm/index.tsx
@@ -33,7 +33,7 @@ const SidebarPieceForm: React.FC<ISidebarPieceFormProps> = (props) => {
   const { schema, formId, open, onClose, title } = props;
 
   const {
-    setForageWorkflowPiecesData,
+    setForageWorkflowPiecesDataById,
     fetchForageWorkflowPiecesDataById,
     setForageWorkflowPiecesOutputSchema,
     clearDownstreamDataById,
@@ -141,10 +141,10 @@ const SidebarPieceForm: React.FC<ISidebarPieceFormProps> = (props) => {
 
   const saveData = useCallback(async () => {
     if (formId && open) {
-      await setForageWorkflowPiecesData(formId, data as IWorkflowPieceData);
+      await setForageWorkflowPiecesDataById(formId, data as IWorkflowPieceData);
       await updateOutputSchema();
     }
-  }, [formId, open, setForageWorkflowPiecesData, data, updateOutputSchema]);
+  }, [formId, open, setForageWorkflowPiecesDataById, data, updateOutputSchema]);
 
   // load forage
   useEffect(() => {