feat: Improve filtering for workflow executions (#14898)

Author: sradevski

.changeset/tough-showers-cross.md

@@ -0,0 +1,6 @@
+---
+"@medusajs/dashboard": patch
+"@medusajs/medusa": patch
+---
+
+Improved filtering support for workflow executions

integration-tests/modules/__tests__/workflow-engine/admin/workflow-executions.spec.ts

@@ -120,6 +120,7 @@ medusaIntegrationTestRunner({
           transaction_id: expect.any(String),
           id: expect.any(String),
           state: "invoking",
+          execution: expect.anything(),
           created_at: expect.any(String),
           updated_at: expect.any(String),
           deleted_at: null,
@@ -178,6 +179,7 @@ medusaIntegrationTestRunner({
           ),
           id: expect.any(String),
           state: "invoking",
+          execution: expect.anything(),
           created_at: expect.any(String),
           updated_at: expect.any(String),
           deleted_at: null,
@@ -189,6 +191,7 @@ medusaIntegrationTestRunner({
           ),
           id: expect.any(String),
           state: "invoking",
+          execution: expect.anything(),
           created_at: expect.any(String),
           updated_at: expect.any(String),
           deleted_at: null,

packages/admin/dashboard/src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/use-workflow-execution-table-columns.tsx

@@ -6,6 +6,10 @@ import { StatusCell } from "../../../../../components/table/table-cells/common/s
 import { TransactionStepState } from "../../../types"
 import { getTransactionState, getTransactionStateColor } from "../../../utils"
 import { HttpTypes } from "@medusajs/types"
+import {
+  DateCell,
+  DateHeader,
+} from "../../../../../components/table/table-cells/common/date-cell"
 
 const columnHelper =
   createColumnHelper<
@@ -20,6 +24,10 @@ export const useWorkflowExecutionTableColumns = (): ColumnDef<
 
   return useMemo(
     () => [
+      columnHelper.accessor("workflow_id", {
+        header: t("workflowExecutions.workflowIdLabel"),
+        cell: ({ getValue }) => <Badge size="2xsmall">{getValue()}</Badge>,
+      }),
       columnHelper.accessor("transaction_id", {
         header: t("workflowExecutions.transactionIdLabel"),
         cell: ({ getValue }) => <Badge size="2xsmall">{getValue()}</Badge>,
@@ -64,6 +72,13 @@ export const useWorkflowExecutionTableColumns = (): ColumnDef<
           })
         },
       }),
+      columnHelper.accessor("created_at", {
+        header: () => <DateHeader />,
+        cell: ({ getValue }) => {
+          const date = new Date(getValue())
+          return <DateCell date={date} />
+        },
+      }),
     ],
     [t]
   )

packages/admin/dashboard/src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/use-workflow-execution-table-filters.tsx

@@ -0,0 +1,29 @@
+import { useTranslation } from "react-i18next"
+import { Filter } from "../../../../../components/table/data-table"
+import { getTransactionState } from "../../../utils"
+import { TransactionState } from "../../../types"
+
+export const useWorkflowExecutionTableFilters = () => {
+  const { t } = useTranslation()
+
+  const filters: Filter[] = [
+    {
+      label: t("workflowExecutions.workflowIdLabel"),
+      key: "workflow_id",
+      type: "string",
+    },
+    {
+      label: t("fields.status"),
+      key: "state",
+      type: "select",
+      multiple: true,
+      options: Object.values(TransactionState).map((state) => ({
+        label: getTransactionState(t, state),
+        value: state,
+      })),
+    },
+    { label: t("fields.createdAt"), key: "created_at", type: "date" },
+  ]
+
+  return filters
+}

packages/admin/dashboard/src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/use-workflow-execution-table-query.tsx

@@ -8,13 +8,20 @@ export const useWorkflowExecutionTableQuery = ({
   pageSize?: number
   prefix?: string
 }) => {
-  const raw = useQueryParams(["q", "offset"], prefix)
+  const raw = useQueryParams(
+    ["q", "offset", "order", "workflow_id", "state", "created_at"],
+    prefix
+  )
 
-  const { offset, ...rest } = raw
+  const { offset, order, workflow_id, state, created_at, ...rest } = raw
 
   const searchParams: HttpTypes.AdminGetWorkflowExecutionsParams = {
     limit: pageSize,
     offset: offset ? parseInt(offset) : 0,
+    order: order ? order : "-created_at",
+    workflow_id: workflow_id?.split(","),
+    state: state?.split(","),
+    created_at: created_at ? JSON.parse(created_at) : undefined,
     ...rest,
   }
 

packages/admin/dashboard/src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/workflow-execution-list-table.tsx

@@ -6,6 +6,7 @@ import { useWorkflowExecutions } from "../../../../../hooks/api/workflow-executi
 import { useDataTable } from "../../../../../hooks/use-data-table"
 import { useWorkflowExecutionTableColumns } from "./use-workflow-execution-table-columns"
 import { useWorkflowExecutionTableQuery } from "./use-workflow-execution-table-query"
+import { useWorkflowExecutionTableFilters } from "./use-workflow-execution-table-filters"
 
 const PAGE_SIZE = 20
 
@@ -25,6 +26,7 @@ export const WorkflowExecutionListTable = () => {
       }
     )
 
+  const filters = useWorkflowExecutionTableFilters()
   const columns = useWorkflowExecutionTableColumns()
 
   const { table } = useDataTable({
@@ -54,8 +56,10 @@ export const WorkflowExecutionListTable = () => {
         table={table}
         columns={columns}
         count={count}
+        filters={filters}
         isLoading={isLoading}
         pageSize={PAGE_SIZE}
+        orderBy={[{ key: "created_at", label: t("fields.createdAt") }]}
         navigateTo={(row) => `${row.id}`}
         search
         pagination

packages/core/types/src/http/workflow-execution/admin/queries.ts

@@ -1,3 +1,4 @@
+import { OperatorMap } from "../../.."
 import { FindParams } from "../../common"
 
 export interface AdminGetWorkflowExecutionsParams extends FindParams {
@@ -13,4 +14,12 @@ export interface AdminGetWorkflowExecutionsParams extends FindParams {
    * Filter by the ID of the workflow to retrieve workflow executions for a specific workflow.
    */
   workflow_id?: string | string[]
+  /**
+   * Filter by the state of the workflow execution.
+   */
+  state?: string | string[]
+  /**
+   * Filter by the creation date of the workflow execution.
+   */
+  created_at?: OperatorMap<string>
 }

packages/medusa/src/api/admin/workflows-executions/query-config.ts

@@ -19,6 +19,7 @@ export const defaultAdminWorkflowExecutionsFields = [
   "workflow_id",
   "transaction_id",
   "state",
+  "execution",
   "created_at",
   "updated_at",
   "deleted_at",

packages/medusa/src/api/admin/workflows-executions/validators.ts

@@ -1,6 +1,10 @@
 import { TransactionHandlerType } from "@medusajs/framework/utils"
 import { z } from "@medusajs/framework/zod"
-import { createFindParams, createSelectParams } from "../../utils/validators"
+import {
+  createFindParams,
+  createOperatorMap,
+  createSelectParams,
+} from "../../utils/validators"
 
 export type AdminGetWorkflowExecutionDetailsParamsType = z.infer<
   typeof AdminGetWorkflowExecutionDetailsParams
@@ -19,6 +23,8 @@ export const AdminGetWorkflowExecutionsParams = createFindParams({
     q: z.string().optional(),
     transaction_id: z.union([z.string(), z.array(z.string())]).optional(),
     workflow_id: z.union([z.string(), z.array(z.string())]).optional(),
+    state: z.union([z.string(), z.array(z.string())]).optional(),
+    created_at: createOperatorMap().optional(),
   })
 )