From 849010d875d354da0120e02ebceb8f38b04d85f1 Mon Sep 17 00:00:00 2001 From: Kasper Fabricius Kristensen <45367945+kasperkristensen@users.noreply.github.com> Date: Thu, 4 Apr 2024 21:27:48 +0200 Subject: [PATCH] feat(dashboard): Setup workflows in V2 routes (#6939) --- .../public/locales/en-US/translation.json | 4 +- .../settings-layout/settings-layout.tsx | 4 +- .../src/providers/router-provider/v1.tsx | 17 ---- .../src/providers/router-provider/v2.tsx | 32 +++++++ .../execution-general-section/index.ts | 1 - .../execution-history-section/index.ts | 1 - .../execution-payload-section/index.ts | 1 - .../execution-timeline-section/index.ts | 1 - .../execution-detail/execution-detail.tsx | 35 -------- .../executions/execution-detail/index.ts | 1 - .../components/executions-list-table/index.ts | 1 - .../execution-list/execution-list.tsx | 9 -- .../routes/executions/execution-list/index.ts | 1 - .../workflow-executions}/constants.ts | 0 .../workflow-executions}/types.ts | 0 .../workflow-executions}/utils.ts | 32 +++---- .../index.ts | 1 + .../workflow-execution-general-section.tsx} | 16 ++-- .../index.ts | 1 + .../workflow-execution-history-section.tsx} | 32 +++---- .../index.ts | 1 + .../workflow-execution-payload-section.tsx} | 10 +-- .../index.ts | 1 + .../workflow-execution-timeline-section.tsx} | 84 +++++++++++++------ .../workflow-execution-detail/index.ts | 1 + .../workflow-execution-detail}/loader.ts | 0 .../workflow-detail.tsx | 35 ++++++++ .../workflow-execution-list-table/index.ts | 1 + .../use-workflow-execution-table-columns.tsx} | 8 +- .../use-workflow-execution-table-query.tsx} | 2 +- .../workflow-execution-list-table.tsx} | 12 +-- .../workflow-execution-list/index.ts | 1 + .../workflow-execution-list.tsx | 9 ++ 33 files changed, 205 insertions(+), 150 deletions(-) delete mode 100644 packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-general-section/index.ts delete mode 100644 packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-history-section/index.ts delete mode 100644 packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-payload-section/index.ts delete mode 100644 packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-timeline-section/index.ts delete mode 100644 packages/admin-next/dashboard/src/routes/executions/execution-detail/execution-detail.tsx delete mode 100644 packages/admin-next/dashboard/src/routes/executions/execution-detail/index.ts delete mode 100644 packages/admin-next/dashboard/src/routes/executions/execution-list/components/executions-list-table/index.ts delete mode 100644 packages/admin-next/dashboard/src/routes/executions/execution-list/execution-list.tsx delete mode 100644 packages/admin-next/dashboard/src/routes/executions/execution-list/index.ts rename packages/admin-next/dashboard/src/{routes/executions => v2-routes/workflow-executions}/constants.ts (100%) rename packages/admin-next/dashboard/src/{routes/executions => v2-routes/workflow-executions}/types.ts (100%) rename packages/admin-next/dashboard/src/{routes/executions => v2-routes/workflow-executions}/utils.ts (71%) create mode 100644 packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-general-section/index.ts rename packages/admin-next/dashboard/src/{routes/executions/execution-detail/components/execution-general-section/execution-general-section.tsx => v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-general-section/workflow-execution-general-section.tsx} (88%) create mode 100644 packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-history-section/index.ts rename packages/admin-next/dashboard/src/{routes/executions/execution-detail/components/execution-history-section/execution-history-section.tsx => v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-history-section/workflow-execution-history-section.tsx} (90%) create mode 100644 packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-payload-section/index.ts rename packages/admin-next/dashboard/src/{routes/executions/execution-detail/components/execution-payload-section/execution-payload-section.tsx => v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-payload-section/workflow-execution-payload-section.tsx} (60%) create mode 100644 packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-timeline-section/index.ts rename packages/admin-next/dashboard/src/{routes/executions/execution-detail/components/execution-timeline-section/execution-timeline-section.tsx => v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-timeline-section/workflow-execution-timeline-section.tsx} (79%) create mode 100644 packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/index.ts rename packages/admin-next/dashboard/src/{routes/executions/execution-detail => v2-routes/workflow-executions/workflow-execution-detail}/loader.ts (100%) create mode 100644 packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/workflow-detail.tsx create mode 100644 packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/index.ts rename packages/admin-next/dashboard/src/{routes/executions/execution-list/components/executions-list-table/use-execution-table-columns.tsx => v2-routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/use-workflow-execution-table-columns.tsx} (88%) rename packages/admin-next/dashboard/src/{routes/executions/execution-list/components/executions-list-table/use-execution-table-query.tsx => v2-routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/use-workflow-execution-table-query.tsx} (90%) rename packages/admin-next/dashboard/src/{routes/executions/execution-list/components/executions-list-table/executions-list-table.tsx => v2-routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/workflow-execution-list-table.tsx} (80%) create mode 100644 packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-list/index.ts create mode 100644 packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-list/workflow-execution-list.tsx diff --git a/packages/admin-next/dashboard/public/locales/en-US/translation.json b/packages/admin-next/dashboard/public/locales/en-US/translation.json index 423ab856a6..b7f5304dfa 100644 --- a/packages/admin-next/dashboard/public/locales/en-US/translation.json +++ b/packages/admin-next/dashboard/public/locales/en-US/translation.json @@ -860,8 +860,8 @@ "tokenExpiresIn": "Token expires in <0>{{time}} minutes", "successfulRequest": "We have sent you an email with instructions on how to reset your password. If you don't receive an email, please check your spam folder or try again." }, - "executions": { - "domain": "Executions", + "workflowExecutions": { + "domain": "Workflows", "transactionIdLabel": "Transaction ID", "workflowIdLabel": "Workflow ID", "progressLabel": "Progress", diff --git a/packages/admin-next/dashboard/src/components/layout/settings-layout/settings-layout.tsx b/packages/admin-next/dashboard/src/components/layout/settings-layout/settings-layout.tsx index 69b15651f6..8204ae3eaf 100644 --- a/packages/admin-next/dashboard/src/components/layout/settings-layout/settings-layout.tsx +++ b/packages/admin-next/dashboard/src/components/layout/settings-layout/settings-layout.tsx @@ -68,8 +68,8 @@ const useDeveloperRoutes = (): NavItemProps[] => { to: "/settings/api-key-management", }, { - label: t("executions.domain"), - to: "/settings/executions", + label: t("workflowExecutions.domain"), + to: "/settings/workflows", }, ], [t] diff --git a/packages/admin-next/dashboard/src/providers/router-provider/v1.tsx b/packages/admin-next/dashboard/src/providers/router-provider/v1.tsx index 065a33a5bf..d7f61a8d09 100644 --- a/packages/admin-next/dashboard/src/providers/router-provider/v1.tsx +++ b/packages/admin-next/dashboard/src/providers/router-provider/v1.tsx @@ -820,23 +820,6 @@ export const v1Routes: RouteObject[] = [ }, ], }, - { - path: "executions", - element: , - handle: { - crumb: () => "Executions", - }, - children: [ - { - path: "", - lazy: () => import("../../routes/executions/execution-list"), - }, - { - path: ":id", - lazy: () => import("../../routes/executions/execution-detail"), - }, - ], - }, ...settingsExtensions, ], }, diff --git a/packages/admin-next/dashboard/src/providers/router-provider/v2.tsx b/packages/admin-next/dashboard/src/providers/router-provider/v2.tsx index 618048ad49..b70a0a6c8e 100644 --- a/packages/admin-next/dashboard/src/providers/router-provider/v2.tsx +++ b/packages/admin-next/dashboard/src/providers/router-provider/v2.tsx @@ -300,6 +300,38 @@ export const v2Routes: RouteObject[] = [ }, ], }, + { + path: "workflows", + element: , + handle: { + crumb: () => "Workflows", + }, + children: [ + { + path: "", + lazy: () => + import( + "../../v2-routes/workflow-executions/workflow-execution-list" + ), + }, + { + path: ":id", + lazy: () => + import( + "../../v2-routes/workflow-executions/workflow-execution-detail" + ), + handle: { + crumb: (data: { workflow: any }) => { + if (!data) { + return "" + } + + return data.workflow.name + }, + }, + }, + ], + }, ], }, ], diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-general-section/index.ts b/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-general-section/index.ts deleted file mode 100644 index c8ae4714fe..0000000000 --- a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-general-section/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "./execution-general-section" diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-history-section/index.ts b/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-history-section/index.ts deleted file mode 100644 index bf1afb788f..0000000000 --- a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-history-section/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "./execution-history-section" diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-payload-section/index.ts b/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-payload-section/index.ts deleted file mode 100644 index d3b4a12f25..0000000000 --- a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-payload-section/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "./execution-payload-section" diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-timeline-section/index.ts b/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-timeline-section/index.ts deleted file mode 100644 index 4acff81887..0000000000 --- a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-timeline-section/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "./execution-timeline-section" diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-detail/execution-detail.tsx b/packages/admin-next/dashboard/src/routes/executions/execution-detail/execution-detail.tsx deleted file mode 100644 index cabf1996a8..0000000000 --- a/packages/admin-next/dashboard/src/routes/executions/execution-detail/execution-detail.tsx +++ /dev/null @@ -1,35 +0,0 @@ -import { useAdminCustomQuery } from "medusa-react" -import { useParams } from "react-router-dom" -import { JsonViewSection } from "../../../components/common/json-view-section" -import { adminExecutionKey } from "../utils" -import { ExecutionGeneralSection } from "./components/execution-general-section" -import { ExecutionHistorySection } from "./components/execution-history-section" -import { ExecutionPayloadSection } from "./components/execution-payload-section" -import { ExecutionTimelineSection } from "./components/execution-timeline-section" - -export const ExecutionDetail = () => { - const { id } = useParams() - - const { data, isLoading, isError, error } = useAdminCustomQuery( - `/workflows-executions/${id}`, - adminExecutionKey.detail(id!) - ) - - if (isLoading || !data) { - return
Loading...
- } - - if (isError) { - throw error - } - - return ( -
- - - - - -
- ) -} diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-detail/index.ts b/packages/admin-next/dashboard/src/routes/executions/execution-detail/index.ts deleted file mode 100644 index d939b77df5..0000000000 --- a/packages/admin-next/dashboard/src/routes/executions/execution-detail/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { ExecutionDetail as Component } from "./execution-detail" diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-list/components/executions-list-table/index.ts b/packages/admin-next/dashboard/src/routes/executions/execution-list/components/executions-list-table/index.ts deleted file mode 100644 index d23ad6ee55..0000000000 --- a/packages/admin-next/dashboard/src/routes/executions/execution-list/components/executions-list-table/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "./executions-list-table" diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-list/execution-list.tsx b/packages/admin-next/dashboard/src/routes/executions/execution-list/execution-list.tsx deleted file mode 100644 index 4fd985c946..0000000000 --- a/packages/admin-next/dashboard/src/routes/executions/execution-list/execution-list.tsx +++ /dev/null @@ -1,9 +0,0 @@ -import { ExecutionsListTable } from "./components/executions-list-table" - -export const ExcecutionList = () => { - return ( -
- -
- ) -} diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-list/index.ts b/packages/admin-next/dashboard/src/routes/executions/execution-list/index.ts deleted file mode 100644 index 2cfda278ad..0000000000 --- a/packages/admin-next/dashboard/src/routes/executions/execution-list/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { ExcecutionList as Component } from "./execution-list" diff --git a/packages/admin-next/dashboard/src/routes/executions/constants.ts b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/constants.ts similarity index 100% rename from packages/admin-next/dashboard/src/routes/executions/constants.ts rename to packages/admin-next/dashboard/src/v2-routes/workflow-executions/constants.ts diff --git a/packages/admin-next/dashboard/src/routes/executions/types.ts b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/types.ts similarity index 100% rename from packages/admin-next/dashboard/src/routes/executions/types.ts rename to packages/admin-next/dashboard/src/v2-routes/workflow-executions/types.ts diff --git a/packages/admin-next/dashboard/src/routes/executions/utils.ts b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/utils.ts similarity index 71% rename from packages/admin-next/dashboard/src/routes/executions/utils.ts rename to packages/admin-next/dashboard/src/v2-routes/workflow-executions/utils.ts index c0da09a8ee..58addd0b74 100644 --- a/packages/admin-next/dashboard/src/routes/executions/utils.ts +++ b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/utils.ts @@ -40,19 +40,19 @@ export const getTransactionState = ( ) => { switch (state) { case TransactionState.DONE: - return t("executions.state.done") + return t("workflowExecutions.state.done") case TransactionState.FAILED: - return t("executions.state.failed") + return t("workflowExecutions.state.failed") case TransactionState.REVERTED: - return t("executions.state.reverted") + return t("workflowExecutions.state.reverted") case TransactionState.INVOKING: - return t("executions.state.invoking") + return t("workflowExecutions.state.invoking") case TransactionState.WAITING_TO_COMPENSATE: - return t("executions.transaction.state.waitingToCompensate") + return t("workflowExecutions.transaction.state.waitingToCompensate") case TransactionState.COMPENSATING: - return t("executions.state.compensating") + return t("workflowExecutions.state.compensating") case TransactionState.NOT_STARTED: - return t("executions.state.notStarted") + return t("workflowExecutions.state.notStarted") } } @@ -80,22 +80,22 @@ export const getStepState = ( ) => { switch (state) { case TransactionStepState.DONE: - return t("executions.state.done") + return t("workflowExecutions.state.done") case TransactionStepState.FAILED: - return t("executions.state.failed") + return t("workflowExecutions.state.failed") case TransactionStepState.REVERTED: - return t("executions.state.reverted") + return t("workflowExecutions.state.reverted") case TransactionStepState.INVOKING: - return t("executions.state.invoking") + return t("workflowExecutions.state.invoking") case TransactionStepState.COMPENSATING: - return t("executions.state.compensating") + return t("workflowExecutions.state.compensating") case TransactionStepState.NOT_STARTED: - return t("executions.state.notStarted") + return t("workflowExecutions.state.notStarted") case TransactionStepState.SKIPPED: - return t("executions.step.state.skipped") + return t("workflowExecutions.step.state.skipped") case TransactionStepState.DORMANT: - return t("executions.step.state.dormant") + return t("workflowExecutions.step.state.dormant") case TransactionStepState.TIMEOUT: - return t("executions.step.state.timeout") + return t("workflowExecutions.step.state.timeout") } } diff --git a/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-general-section/index.ts b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-general-section/index.ts new file mode 100644 index 0000000000..78d14e8ae1 --- /dev/null +++ b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-general-section/index.ts @@ -0,0 +1 @@ +export * from "./workflow-execution-general-section" diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-general-section/execution-general-section.tsx b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-general-section/workflow-execution-general-section.tsx similarity index 88% rename from packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-general-section/execution-general-section.tsx rename to packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-general-section/workflow-execution-general-section.tsx index 17eb6f77fe..64455821fb 100644 --- a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-general-section/execution-general-section.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-general-section/workflow-execution-general-section.tsx @@ -15,13 +15,13 @@ import { } from "../../../types" import { getTransactionState, getTransactionStateColor } from "../../../utils" -type ExecutionGeneralSectionProps = { +type WorkflowExecutionGeneralSectionProps = { execution: WorkflowExecutionDTO } -export const ExecutionGeneralSection = ({ +export const WorkflowExecutionGeneralSection = ({ execution, -}: ExecutionGeneralSectionProps) => { +}: WorkflowExecutionGeneralSectionProps) => { const { t } = useTranslation() const cleanId = execution.id.replace("wf_exec_", "") @@ -39,7 +39,7 @@ export const ExecutionGeneralSection = ({
- {t("executions.workflowIdLabel")} + {t("workflowExecutions.workflowIdLabel")} {execution.workflow_id} @@ -47,7 +47,7 @@ export const ExecutionGeneralSection = ({
- {t("executions.transactionIdLabel")} + {t("workflowExecutions.transactionIdLabel")} {execution.transaction_id} @@ -55,7 +55,7 @@ export const ExecutionGeneralSection = ({
- {t("executions.progressLabel")} + {t("workflowExecutions.progressLabel")}
@@ -75,7 +75,7 @@ const Progress = ({ if (!steps) { return ( - {t("executions.stepsCompletedLabel", { + {t("workflowExecutions.stepsCompletedLabel", { completed: 0, total: 0, })} @@ -108,7 +108,7 @@ const Progress = ({ ))} - {t("executions.stepsCompletedLabel", { + {t("workflowExecutions.stepsCompletedLabel", { completed: completedSteps.length, count: actionableSteps.length, })} diff --git a/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-history-section/index.ts b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-history-section/index.ts new file mode 100644 index 0000000000..9d2f1af388 --- /dev/null +++ b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-history-section/index.ts @@ -0,0 +1 @@ +export * from "./workflow-execution-history-section" diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-history-section/execution-history-section.tsx b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-history-section/workflow-execution-history-section.tsx similarity index 90% rename from packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-history-section/execution-history-section.tsx rename to packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-history-section/workflow-execution-history-section.tsx index 71f7b60911..b49390fccd 100644 --- a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-history-section/execution-history-section.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-history-section/workflow-execution-history-section.tsx @@ -27,13 +27,13 @@ import { WorkflowExecutionStep, } from "../../../types" -type ExecutionHistorySectionProps = { +type WorkflowExecutionHistorySectionProps = { execution: WorkflowExecutionDTO } -export const ExecutionHistorySection = ({ +export const WorkflowExecutionHistorySection = ({ execution, -}: ExecutionHistorySectionProps) => { +}: WorkflowExecutionHistorySectionProps) => { const { t } = useTranslation() const map = Object.values(execution.execution?.steps || {}) @@ -57,7 +57,9 @@ export const ExecutionHistorySection = ({ return (
- {t("executions.history.sectionTitle")} + + {t("workflowExecutions.history.sectionTitle")} +
{steps.map((step, index) => { @@ -178,13 +180,13 @@ const Event = ({
- {t("executions.history.definitionLabel")} + {t("workflowExecutions.history.definitionLabel")} - {t("executions.history.outputLabel")} + {t("workflowExecutions.history.outputLabel")} - {t("executions.history.compensateInputLabel")} + {t("workflowExecutions.history.compensateInputLabel")} - {t("executions.history.errorLabel")} + {t("workflowExecutions.history.errorLabel")} - {t("executions.history.runningState")} + {t("workflowExecutions.history.runningState")}
@@ -305,7 +309,7 @@ const StepState = ({ if (isFailed) { return ( - {t("executions.history.failedState")} + {t("workflowExecutions.history.failedState")} ) } diff --git a/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-payload-section/index.ts b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-payload-section/index.ts new file mode 100644 index 0000000000..5844d8233b --- /dev/null +++ b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-payload-section/index.ts @@ -0,0 +1 @@ +export * from "./workflow-execution-payload-section" diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-payload-section/execution-payload-section.tsx b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-payload-section/workflow-execution-payload-section.tsx similarity index 60% rename from packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-payload-section/execution-payload-section.tsx rename to packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-payload-section/workflow-execution-payload-section.tsx index ae1860e476..d43e96b2d7 100644 --- a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-payload-section/execution-payload-section.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-payload-section/workflow-execution-payload-section.tsx @@ -1,21 +1,21 @@ import { JsonViewSection } from "../../../../../components/common/json-view-section" import { WorkflowExecutionDTO } from "../../../types" -type ExecutionPayloadSectionProps = { +type WorkflowExecutionPayloadSectionProps = { execution: WorkflowExecutionDTO } -export const ExecutionPayloadSection = ({ +export const WorkflowExecutionPayloadSection = ({ execution, -}: ExecutionPayloadSectionProps) => { +}: WorkflowExecutionPayloadSectionProps) => { let payload = execution.context?.data?.payload if (!payload) { return null } - // payloads may be simple primitives, so we need to wrap them in an object - // to ensure the JsonViewSection component can render them + // payloads may be a primitive, so we need to wrap them in an object + // to ensure the JsonViewSection component can render them. if (typeof payload !== "object") { payload = { input: payload } } diff --git a/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-timeline-section/index.ts b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-timeline-section/index.ts new file mode 100644 index 0000000000..646d07ae7b --- /dev/null +++ b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-timeline-section/index.ts @@ -0,0 +1 @@ +export * from "./workflow-execution-timeline-section" diff --git a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-timeline-section/execution-timeline-section.tsx b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-timeline-section/workflow-execution-timeline-section.tsx similarity index 79% rename from packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-timeline-section/execution-timeline-section.tsx rename to packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-timeline-section/workflow-execution-timeline-section.tsx index 740a7aed13..aacc9dd85f 100644 --- a/packages/admin-next/dashboard/src/routes/executions/execution-detail/components/execution-timeline-section/execution-timeline-section.tsx +++ b/packages/admin-next/dashboard/src/v2-routes/workflow-executions/workflow-execution-detail/components/workflow-execution-timeline-section/workflow-execution-timeline-section.tsx @@ -1,5 +1,5 @@ import { ArrowPathMini, MinusMini, PlusMini } from "@medusajs/icons" -import { Container, Heading, Text, clx } from "@medusajs/ui" +import { Container, DropdownMenu, Heading, Text, clx } from "@medusajs/ui" import { motion, useAnimationControls, @@ -18,13 +18,13 @@ import { } from "../../../constants" import { WorkflowExecutionDTO, WorkflowExecutionStep } from "../../../types" -type ExecutionTimelineSectionProps = { +type WorkflowExecutionTimelineSectionProps = { execution: WorkflowExecutionDTO } -export const ExecutionTimelineSection = ({ +export const WorkflowExecutionTimelineSection = ({ execution, -}: ExecutionTimelineSectionProps) => { +}: WorkflowExecutionTimelineSectionProps) => { const { t } = useTranslation() return ( @@ -79,6 +79,7 @@ const ZOOM_STEP = 0.25 const Canvas = ({ execution }: { execution: WorkflowExecutionDTO }) => { const [zoom, setZoom] = useState(1) + const [isDragging, setIsDragging] = useState(false) const scale = useMotionValue(defaultState.scale) const x = useMotionValue(defaultState.x) @@ -152,6 +153,8 @@ const Canvas = ({ execution }: { execution: WorkflowExecutionDTO }) => {
setIsDragging(true)} + onMouseUp={() => setIsDragging(false)} drag dragConstraints={dragConstraints} dragElastic={0} @@ -165,7 +168,14 @@ const Canvas = ({ execution }: { execution: WorkflowExecutionDTO }) => { y, scale, }} - className="bg-ui-bg-subtle relative size-[500rem] origin-top-left items-start justify-start overflow-hidden bg-[radial-gradient(var(--border-base)_1.5px,transparent_0)] bg-[length:20px_20px] bg-repeat" + className={clx( + "bg-ui-bg-subtle relative size-[500rem] origin-top-left items-start justify-start overflow-hidden", + "bg-[radial-gradient(var(--border-base)_1.5px,transparent_0)] bg-[length:20px_20px] bg-repeat", + { + "cursor-grab": !isDragging, + "cursor-grabbing": isDragging, + } + )} >
@@ -188,25 +198,51 @@ const Canvas = ({ execution }: { execution: WorkflowExecutionDTO }) => {
-
- - +
+
+ +
+ + + + {Math.round(zoom * 100)}% + + + + {[50, 75, 100, 125, 150].map((value) => ( + changeZoom(value / 100)} + > + {value}% + + ))} + + +
+ +