Merge pull request #146 from Tauffer-Consulting/feature/import-from-m…

…y-workflows

Feature/import from my workflows

frontend/src/components/Breadcrumbs/index.tsx

@@ -8,6 +8,21 @@ export const Breadcrumbs: React.FC = () => {
   const location = useLocation();
   const pathnames = location.pathname.split("/").filter((x) => x);
 
+  const formatBreadcrumbLabel = (value: string) => {
+    // Remove dashes and other special characters and add spaces
+    const formattedValue = value
+      .replace(/[-_]+/g, " ")
+      .replace(/([a-z])([A-Z])/g, "$1 $2");
+
+    // Capitalize the first letter of each word
+    const words = formattedValue.split(" ");
+    const capitalizedWords = words.map((word) => {
+      return word.charAt(0).toUpperCase() + word.slice(1);
+    });
+
+    return capitalizedWords.join(" ");
+  };
+
   return (
     <BreadcrumbsMui
       aria-label="Breadcrumb"
@@ -17,7 +32,7 @@ export const Breadcrumbs: React.FC = () => {
       {pathnames.map((value, index) => {
         const last = index === pathnames.length - 1;
         const to = `/${pathnames.slice(0, index + 1).join("/")}`;
-        const capitalizedValue = value.charAt(0).toUpperCase() + value.slice(1);
+        const formattedValue = formatBreadcrumbLabel(value);
 
         return last ? (
           <Typography
@@ -28,7 +43,7 @@ export const Breadcrumbs: React.FC = () => {
               userSelect: "none",
             }}
           >
-            {capitalizedValue}
+            {formattedValue}
           </Typography>
         ) : (
           <RouterLink
@@ -47,7 +62,7 @@ export const Breadcrumbs: React.FC = () => {
             }}
           >
             <Typography variant="h1" color="textPrimary">
-              {capitalizedValue}
+              {formattedValue}
             </Typography>
           </RouterLink>
         );

frontend/src/components/PrivateLayout/header/drawerMenu.tsx

@@ -107,12 +107,12 @@ export const DrawerMenu: FC<IDrawerMenuProps> = ({ isOpen, handleClose }) => {
         <Divider />
         <List>
           <DrawerMenuItem
-            selected={pathname === "/workflows"}
+            selected={pathname === "/my-workflows"}
             onClick={() => {
-              if (workspace?.id) navigate("/workflows");
+              if (workspace?.id) navigate("/my-workflows");
             }}
             icon={<Toc />}
-            label={"Workflows"}
+            label={"My Workflows"}
             isMenuOpen={isOpen}
             disabled={!workspace?.id}
           />

frontend/src/components/WorkflowPanel/RunNode/index.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable no-prototype-builtins */
 import { Icon } from "@iconify/react";
 import { Paper, Typography } from "@mui/material";
-import { taskState } from "features/workflows/types";
+import { taskState } from "features/myWorkflows/types";
 import theme from "providers/theme.config";
 import React, { type CSSProperties, memo, useCallback, useMemo } from "react";
 import { Position, Handle } from "reactflow";

frontend/src/components/WorkflowPanel/types.ts

@@ -1,4 +1,4 @@
-import { type taskState } from "features/workflows/types";
+import { type taskState } from "features/myWorkflows/types";
 import { type CSSProperties } from "react";
 import { type Node, type NodeProps } from "reactflow";
 

frontend/src/context/workspaces/repositories.tsx

@@ -2,7 +2,7 @@ import {
   type IGetRepoPiecesResponseInterface,
   useAuthenticatedGetPieceRepositories,
   useFetchAuthenticatedGetRepoIdPieces,
-} from "features/workflows/api";
+} from "features/myWorkflows/api";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { toast } from "react-toastify";
 import localForage from "services/config/localForage.config";

frontend/src/features/workflows/api/runs/getWorkflowRunTasks.ts → frontend/src/features/myWorkflows/api/runs/getWorkflowRunTasks.ts

@@ -1,6 +1,6 @@
 import { type AxiosResponse } from "axios";
 import { useWorkspaces } from "context/workspaces";
-import { type IGetWorkflowRunTasksResponseInterface } from "features/workflows/types/runs";
+import { type IGetWorkflowRunTasksResponseInterface } from "features/myWorkflows/types/runs";
 import { dominoApiClient } from "services/clients/domino.client";
 
 export interface IGetWorkflowRunTasksParams {

frontend/src/features/workflows/api/runs/getWorkflowRuns.ts → frontend/src/features/myWorkflows/api/runs/getWorkflowRuns.ts

@@ -1,6 +1,6 @@
 import { type AxiosResponse } from "axios";
 import { useWorkspaces } from "context/workspaces";
-import { type IGetWorkflowRunsResponseInterface } from "features/workflows/types/runs";
+import { type IGetWorkflowRunsResponseInterface } from "features/myWorkflows/types/runs";
 import { dominoApiClient } from "services/clients/domino.client";
 import useSWR from "swr";
 

frontend/src/features/workflows/api/workflow/deleteWorkflowId.ts → frontend/src/features/myWorkflows/api/workflow/deleteWorkflowId.ts

@@ -1,6 +1,6 @@
 import { AxiosError, type AxiosResponse } from "axios";
 import { useWorkspaces } from "context/workspaces";
-import { type IDeleteWorkflowIdResponseInterface } from "features/workflows/types/workflow";
+import { type IDeleteWorkflowIdResponseInterface } from "features/myWorkflows/types/workflow";
 import { toast } from "react-toastify";
 import { dominoApiClient } from "services/clients/domino.client";
 

frontend/src/features/workflows/api/workflow/getWorkflow.ts → frontend/src/features/myWorkflows/api/workflow/getWorkflow.ts

@@ -1,6 +1,6 @@
 import { type AxiosResponse } from "axios";
 import { useWorkspaces } from "context/workspaces";
-import { type IGetWorkflowResponseInterface } from "features/workflows/types/workflow";
+import { type IGetWorkflowResponseInterface } from "features/myWorkflows/types/workflow";
 import { dominoApiClient } from "services/clients/domino.client";
 import useSWR from "swr";
 

frontend/src/features/workflows/api/workflow/getWorkflowId.ts → frontend/src/features/myWorkflows/api/workflow/getWorkflowId.ts

@@ -1,15 +1,15 @@
 import { type AxiosResponse } from "axios";
 import { useWorkspaces } from "context/workspaces";
-import { type IGetWorkflowIdResponseInterface } from "features/workflows/types/workflow";
+import { type IGetWorkflowIdResponseInterface } from "features/myWorkflows/types/workflow";
 import { dominoApiClient } from "services/clients/domino.client";
 import useSWR from "swr";
 
 interface IGetWorkflowIdParams {
-  id: string;
+  id?: string;
 }
 
-const getWorkflowUrl = (workspaceId: string, id: string) =>
-  `/workspaces/${workspaceId}/workflows/${id}`;
+const getWorkflowUrl = (workspaceId: string, id?: string) =>
+  id ? `/workspaces/${workspaceId}/workflows/${id}` : null;
 
 /**
  * Get workflow by id using GET /workflow
@@ -18,19 +18,21 @@ const getWorkflowUrl = (workspaceId: string, id: string) =>
 const getWorkflowId: (
   workspaceId: string,
   params: IGetWorkflowIdParams,
-) => Promise<AxiosResponse<IGetWorkflowIdResponseInterface>> = async (
-  workspaceId,
-  params,
-) => {
-  return await dominoApiClient.get(getWorkflowUrl(workspaceId, params.id));
+) => Promise<
+  AxiosResponse<IGetWorkflowIdResponseInterface> | undefined
+> = async (workspaceId, params) => {
+  const url = getWorkflowUrl(workspaceId, params.id);
+  if (url) {
+    return await dominoApiClient.get(url);
+  }
 };
 
 /**
  * Get workflow by id
  * @param params `{ workspaceId: number, id: string }`
  * @returns workflow fetcher fn
  */
-export const useAuthenticatedGetWorkflowId = ({ id }: { id: string }) => {
+export const useAuthenticatedGetWorkflowId = ({ id }: IGetWorkflowIdParams) => {
   const { workspace } = useWorkspaces();
 
   if (!workspace)
@@ -40,15 +42,13 @@ export const useAuthenticatedGetWorkflowId = ({ id }: { id: string }) => {
 
   // todo add swr ?
   const fetcher = async (params: IGetWorkflowIdParams) => {
-    return await getWorkflowId(workspace.id, params).then((data) => data.data);
+    return await getWorkflowId(workspace.id, params).then((data) => data?.data);
   };
 
-  return useSWR(
-    getWorkflowUrl(workspace.id, id),
-    async () => await fetcher({ id }),
-    {
-      revalidateOnFocus: false,
-      revalidateOnReconnect: false,
-    },
-  );
+  const key = getWorkflowUrl(workspace.id, id);
+
+  return useSWR(key, async () => await fetcher({ id }), {
+    revalidateOnFocus: false,
+    revalidateOnReconnect: false,
+  });
 };

frontend/src/features/workflows/api/workflow/postWorkflow.ts → frontend/src/features/myWorkflows/api/workflow/postWorkflow.ts

@@ -1,6 +1,6 @@
 import { type AxiosResponse } from "axios";
 import { type CreateWorkflowRequest } from "features/workflowEditor/context/types";
-import { type IPostWorkflowResponseInterface } from "features/workflows/types";
+import { type IPostWorkflowResponseInterface } from "features/myWorkflows/types";
 import { dominoApiClient } from "services/clients/domino.client";
 
 export interface IPostWorkflowParams extends CreateWorkflowRequest {

frontend/src/features/workflows/api/workflow/postWorkflowRunId.ts → frontend/src/features/myWorkflows/api/workflow/postWorkflowRunId.ts

@@ -1,7 +1,7 @@
 // TODO move to /runs
 import { AxiosError, type AxiosResponse } from "axios";
 import { useWorkspaces } from "context/workspaces";
-import { type IPostWorkflowRunIdResponseInterface } from "features/workflows/types/workflow";
+import { type IPostWorkflowRunIdResponseInterface } from "features/myWorkflows/types/workflow";
 import { toast } from "react-toastify";
 import { dominoApiClient } from "services/clients/domino.client";
 

frontend/src/features/workflows/components/WorkflowDetail/CustomTabMenu/TaskDetail.tsx → frontend/src/features/myWorkflows/components/WorkflowDetail/CustomTabMenu/TaskDetail.tsx

@@ -9,8 +9,8 @@ import {
   Container,
 } from "@mui/material";
 import { intervalToDuration } from "date-fns";
-import { taskStatesColorMap } from "features/workflows/constants";
-import { type IWorkflowRunTasks } from "features/workflows/types/runs";
+import { taskStatesColorMap } from "features/myWorkflows/constants";
+import { type IWorkflowRunTasks } from "features/myWorkflows/types/runs";
 import { useMemo } from "react";
 
 interface IWorkflowRunTasksExtended extends IWorkflowRunTasks {

frontend/src/features/workflows/components/WorkflowDetail/States/index.tsx → frontend/src/features/myWorkflows/components/WorkflowDetail/States/index.tsx

@@ -1,5 +1,5 @@
 import { Chip } from "@mui/material";
-import { type IWorkflowRuns } from "features/workflows/types";
+import { type IWorkflowRuns } from "features/myWorkflows/types";
 import theme from "providers/theme.config";
 import React from "react";
 

frontend/src/features/workflows/components/WorkflowDetail/WorkflowRunDetail.tsx → frontend/src/features/myWorkflows/components/WorkflowDetail/WorkflowRunDetail.tsx

@@ -3,7 +3,7 @@ import { NoDataOverlay } from "components/NoDataOverlay";
 import {
   useAuthenticatedGetWorkflowRunTaskLogs,
   useAuthenticatedGetWorkflowRunTaskResult,
-} from "features/workflows/api";
+} from "features/myWorkflows/api";
 import React, { useCallback, useMemo, useState } from "react";
 import { useInterval } from "utils";
 

frontend/src/features/workflows/components/WorkflowDetail/WorkflowRunsTable.tsx → frontend/src/features/myWorkflows/components/WorkflowDetail/WorkflowRunsTable.tsx

@@ -1,8 +1,8 @@
 import { Card, Grid, Skeleton } from "@mui/material";
 import { DataGrid, type GridColDef } from "@mui/x-data-grid";
 import { NoDataOverlay } from "components/NoDataOverlay";
-import { useAuthenticatedGetWorkflowRuns } from "features/workflows/api";
-import { type IWorkflowRuns } from "features/workflows/types";
+import { useAuthenticatedGetWorkflowRuns } from "features/myWorkflows/api";
+import { type IWorkflowRuns } from "features/myWorkflows/types";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { useInterval } from "utils";
 

frontend/src/features/workflows/components/WorkflowDetail/index.tsx → frontend/src/features/myWorkflows/components/WorkflowDetail/index.tsx

@@ -11,11 +11,11 @@ import {
   useAuthenticatedGetWorkflowId,
   useAuthenticatedGetWorkflowRunTasks,
   useAuthenticatedPostWorkflowRunId,
-} from "features/workflows/api";
+} from "features/myWorkflows/api";
 import {
   type IWorkflowRuns,
   type IWorkflowRunTasks,
-} from "features/workflows/types";
+} from "features/myWorkflows/types";
 import React, { useCallback, useRef, useState } from "react";
 import { useParams } from "react-router-dom";
 import { type NodeMouseHandler } from "reactflow";

frontend/src/features/workflows/components/WorkflowsList/Actions.tsx → frontend/src/features/myWorkflows/components/WorkflowsList/Actions.tsx

@@ -4,7 +4,7 @@ import PlayCircleOutlineIcon from "@mui/icons-material/PlayCircleOutline";
 import { IconButton } from "@mui/material";
 import { type CommonProps } from "@mui/material/OverridableComponent";
 import { Modal, type ModalRef } from "components/Modal";
-import { type IWorkflow } from "features/workflows/types";
+import { type IWorkflow } from "features/myWorkflows/types";
 import theme from "providers/theme.config";
 import React, { useRef, useState } from "react";
 

frontend/src/features/workflows/components/WorkflowsList/index.tsx → frontend/src/features/myWorkflows/components/WorkflowsList/index.tsx

@@ -10,8 +10,8 @@ import {
   useAuthenticatedDeleteWorkflowId,
   useAuthenticatedGetWorkflows,
   useAuthenticatedPostWorkflowRunId,
-} from "features/workflows/api";
-import { type IWorkflow } from "features/workflows/types";
+} from "features/myWorkflows/api";
+import { type IWorkflow } from "features/myWorkflows/types";
 import React, { useCallback, useMemo } from "react";
 import { useNavigate } from "react-router-dom";
 import { useInterval } from "utils";
@@ -159,7 +159,7 @@ export const WorkflowList: React.FC = () => {
         event.target.classList.contains(".action-button");
       if (!isActionButtonClick) {
         if (params.row.status !== "failed" && params.row.status !== "creating")
-          navigate(`/workflows/${params.id}`);
+          navigate(`/my-workflows/${params.id}`);
       }
     },
     [navigate],