@acmekit/dashboard 2.13.36 → 2.13.37

package/dist/workflow-execution-list-DETG4MRT.mjs

@@ -0,0 +1,347 @@
+import {
+  DateCell
+} from "./chunk-QZOY6YYT.mjs";
+import {
+  getTransactionState,
+  getTransactionStateColor
+} from "./chunk-RPAL6FHW.mjs";
+import {
+  _DataTable,
+  useDataTable
+} from "./chunk-YLPAZ2DP.mjs";
+import {
+  useQueryParams
+} from "./chunk-C76H5USB.mjs";
+import "./chunk-DFFLVEZ5.mjs";
+import "./chunk-535OVBXR.mjs";
+import {
+  SingleColumnPage
+} from "./chunk-22YYMH6M.mjs";
+import {
+  useExtension
+} from "./chunk-C5P5PL3E.mjs";
+import {
+  useWorkflowExecutions
+} from "./chunk-LKWTBYYC.mjs";
+import "./chunk-ITNQKZQQ.mjs";
+import "./chunk-S4DMV3ZT.mjs";
+import "./chunk-774WSTCC.mjs";
+import "./chunk-DTY37DDZ.mjs";
+import "./chunk-QZ7TP4HQ.mjs";
+
+// src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/workflow-execution-list-table.tsx
+import { Container, Heading, Text as Text2 } from "@acmekit/ui";
+import { keepPreviousData } from "@tanstack/react-query";
+import { useTranslation as useTranslation3 } from "react-i18next";
+
+// src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/use-workflow-execution-table-columns.tsx
+import { Badge, Copy, Text, clx as clx2 } from "@acmekit/ui";
+import { createColumnHelper } from "@tanstack/react-table";
+import { useMemo } from "react";
+import { useTranslation } from "react-i18next";
+
+// src/components/data-table/components/data-table-status-cell/data-table-status-cell.tsx
+import { clx } from "@acmekit/ui";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DataTableStatusCell = ({
+  color,
+  children
+}) => {
+  return /* @__PURE__ */ jsxs("div", { className: "txt-compact-small text-ui-fg-subtle flex h-full w-full items-center gap-x-2 overflow-hidden", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "presentation",
+        className: "flex h-5 w-2 items-center justify-center",
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: clx(
+              "h-2 w-2 rounded-sm shadow-[0px_0px_0px_1px_rgba(0,0,0,0.12)_inset]",
+              {
+                "bg-ui-tag-neutral-icon": color === "grey",
+                "bg-ui-tag-green-icon": color === "green",
+                "bg-ui-tag-red-icon": color === "red",
+                "bg-ui-tag-blue-icon": color === "blue",
+                "bg-ui-tag-orange-icon": color === "orange",
+                "bg-ui-tag-purple-icon": color === "purple"
+              }
+            )
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { className: "truncate", children })
+  ] });
+};
+
+// src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/use-workflow-execution-table-columns.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var columnHelper = createColumnHelper();
+var useWorkflowExecutionTableColumns = () => {
+  const { t } = useTranslation();
+  return useMemo(
+    () => [
+      columnHelper.accessor("workflow_id", {
+        header: t("workflowExecutions.workflowIdLabel"),
+        cell: ({ getValue }) => {
+          const workflowId = getValue();
+          return /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-x-1", children: [
+            /* @__PURE__ */ jsx2(Badge, { size: "2xsmall", className: "truncate", children: workflowId }),
+            /* @__PURE__ */ jsx2(Copy, { content: workflowId, className: "text-ui-fg-muted" })
+          ] });
+        }
+      }),
+      columnHelper.accessor("state", {
+        header: t("fields.state"),
+        cell: ({ getValue }) => {
+          const state = getValue();
+          const color = getTransactionStateColor(state);
+          const translatedState = getTransactionState(t, state);
+          return /* @__PURE__ */ jsx2(DataTableStatusCell, { color, children: /* @__PURE__ */ jsx2("span", { className: "capitalize", children: translatedState }) });
+        }
+      }),
+      columnHelper.accessor("execution", {
+        header: t("workflowExecutions.progressLabel"),
+        cell: ({ getValue }) => {
+          const steps = getValue()?.steps;
+          if (!steps) {
+            return /* @__PURE__ */ jsx2("span", { className: "text-ui-fg-subtle whitespace-nowrap", children: t("workflowExecutions.stepsCompletedLabel", {
+              completed: 0,
+              count: 0
+            }) });
+          }
+          const actionableSteps = Object.values(steps).filter(
+            (step) => step.id !== ROOT_PREFIX
+          );
+          const completedSteps = actionableSteps.filter(
+            (step) => step.invoke.state === "done" /* DONE */
+          );
+          return /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-x-2", children: [
+            /* @__PURE__ */ jsx2("div", { className: "flex items-center gap-x-[3px]", children: actionableSteps.map((step) => /* @__PURE__ */ jsx2(
+              "div",
+              {
+                className: clx2(
+                  "bg-ui-bg-switch-off shadow-details-switch-background h-3 w-1.5 rounded-full",
+                  {
+                    "bg-ui-fg-muted": step.invoke.state === "done" /* DONE */
+                  }
+                ),
+                "data-completed": step.invoke.state === "done" /* DONE */
+              },
+              step.id
+            )) }),
+            /* @__PURE__ */ jsx2("span", { className: "text-ui-fg-subtle whitespace-nowrap", children: t("workflowExecutions.stepsCompletedLabel", {
+              completed: completedSteps.length,
+              count: actionableSteps.length
+            }) })
+          ] });
+        }
+      }),
+      columnHelper.display({
+        id: "duration",
+        header: t("fields.duration"),
+        cell: ({ row }) => {
+          const createdAt = row.original.created_at;
+          const updatedAt = row.original.updated_at;
+          const state = row.original.state;
+          if (!createdAt) {
+            return /* @__PURE__ */ jsx2(Text, { size: "small", leading: "compact", className: "text-ui-fg-subtle", children: "-" });
+          }
+          const start = new Date(createdAt);
+          const end = updatedAt && ["done", "failed", "reverted"].includes(state) ? new Date(updatedAt) : /* @__PURE__ */ new Date();
+          if (isNaN(start.getTime()) || isNaN(end.getTime())) {
+            return /* @__PURE__ */ jsx2(Text, { size: "small", leading: "compact", className: "text-ui-fg-subtle", children: "-" });
+          }
+          const ms = end.getTime() - start.getTime();
+          if (ms < 0) {
+            return /* @__PURE__ */ jsx2(Text, { size: "small", leading: "compact", className: "text-ui-fg-subtle", children: "-" });
+          }
+          const seconds = Math.floor(ms / 1e3);
+          const minutes = Math.floor(seconds / 60);
+          const hours = Math.floor(minutes / 60);
+          let label;
+          if (hours > 0) {
+            label = `${hours}h ${minutes % 60}m`;
+          } else if (minutes > 0) {
+            label = `${minutes}m ${seconds % 60}s`;
+          } else if (seconds > 0) {
+            label = `${seconds}s`;
+          } else if (ms > 0) {
+            label = "<1s";
+          } else {
+            label = "0s";
+          }
+          return /* @__PURE__ */ jsx2(Text, { size: "small", leading: "compact", className: "text-ui-fg-subtle", children: label });
+        }
+      }),
+      columnHelper.accessor("created_at", {
+        header: t("fields.createdAt"),
+        cell: ({ getValue }) => {
+          const date = getValue();
+          return /* @__PURE__ */ jsx2(DateCell, { date });
+        }
+      }),
+      columnHelper.accessor("updated_at", {
+        header: t("fields.updatedAt"),
+        cell: ({ getValue }) => {
+          const date = getValue();
+          return /* @__PURE__ */ jsx2(DateCell, { date });
+        }
+      })
+    ],
+    [t]
+  );
+};
+var ROOT_PREFIX = "_root";
+
+// src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/use-workflow-execution-table-filters.tsx
+import { useTranslation as useTranslation2 } from "react-i18next";
+var useWorkflowExecutionTableFilters = () => {
+  const { t } = useTranslation2();
+  const stateFilter = {
+    key: "state",
+    label: t("fields.status"),
+    type: "select",
+    multiple: true,
+    options: [
+      {
+        label: t("workflowExecutions.state.done"),
+        value: "done"
+      },
+      {
+        label: t("workflowExecutions.state.failed"),
+        value: "failed"
+      },
+      {
+        label: t("workflowExecutions.state.reverted"),
+        value: "reverted"
+      },
+      {
+        label: t("workflowExecutions.state.invoking"),
+        value: "invoking"
+      },
+      {
+        label: t("workflowExecutions.transaction.state.waitingToCompensate"),
+        value: "waiting_to_compensate"
+      },
+      {
+        label: t("workflowExecutions.state.compensating"),
+        value: "compensating"
+      },
+      {
+        label: t("workflowExecutions.state.notStarted"),
+        value: "not_started"
+      }
+    ]
+  };
+  const dateFilters = [
+    { key: "created_at", label: t("fields.createdAt"), type: "date" },
+    { key: "updated_at", label: t("fields.updatedAt"), type: "date" }
+  ];
+  return [stateFilter, ...dateFilters];
+};
+
+// src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/use-workflow-execution-table-query.tsx
+var useWorkflowExecutionTableQuery = ({
+  pageSize = 20,
+  prefix
+}) => {
+  const raw = useQueryParams(
+    ["q", "offset", "order", "state", "created_at", "updated_at"],
+    prefix
+  );
+  const { offset, order, state, created_at, updated_at, ...rest } = raw;
+  const searchParams = {
+    limit: pageSize,
+    offset: offset ? parseInt(offset) : 0,
+    order: order ?? "-created_at",
+    state: state ? state.split(",") : void 0,
+    created_at: created_at ? JSON.parse(created_at) : void 0,
+    updated_at: updated_at ? JSON.parse(updated_at) : void 0,
+    ...rest
+  };
+  return {
+    searchParams,
+    raw
+  };
+};
+
+// src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/workflow-execution-list-table.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var PAGE_SIZE = 20;
+var WorkflowExecutionListTable = () => {
+  const { t } = useTranslation3();
+  const { searchParams, raw } = useWorkflowExecutionTableQuery({
+    pageSize: PAGE_SIZE
+  });
+  const { workflow_executions, count, isLoading, isError, error } = useWorkflowExecutions(
+    {
+      ...searchParams
+    },
+    {
+      placeholderData: keepPreviousData
+    }
+  );
+  const columns = useWorkflowExecutionTableColumns();
+  const filters = useWorkflowExecutionTableFilters();
+  const { table } = useDataTable({
+    data: workflow_executions || [],
+    columns,
+    count,
+    pageSize: PAGE_SIZE,
+    enablePagination: true,
+    getRowId: (row) => row.id
+  });
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsxs3(Container, { className: "divide-y p-0", children: [
+    /* @__PURE__ */ jsx3("div", { className: "flex items-center justify-between px-6 py-4", children: /* @__PURE__ */ jsxs3("div", { children: [
+      /* @__PURE__ */ jsx3(Heading, { children: t("workflowExecutions.domain") }),
+      /* @__PURE__ */ jsx3(Text2, { className: "text-ui-fg-subtle", size: "small", children: t(`workflowExecutions.subtitle`) })
+    ] }) }),
+    /* @__PURE__ */ jsx3(
+      _DataTable,
+      {
+        table,
+        columns,
+        filters,
+        count,
+        isLoading,
+        orderBy: [
+          { key: "created_at", label: t("fields.createdAt") },
+          { key: "updated_at", label: t("fields.updatedAt") }
+        ],
+        pageSize: PAGE_SIZE,
+        navigateTo: (row) => `${row.id}`,
+        search: true,
+        pagination: true,
+        queryObject: raw,
+        noRecords: {
+          message: t("workflowExecutions.list.noRecordsMessage")
+        }
+      }
+    )
+  ] });
+};
+
+// src/routes/workflow-executions/workflow-execution-list/workflow-execution-list.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var WorkflowExcecutionList = () => {
+  const { getWidgets } = useExtension();
+  return /* @__PURE__ */ jsx4(
+    SingleColumnPage,
+    {
+      widgets: {
+        after: getWidgets("workflow.list.after"),
+        before: getWidgets("workflow.list.before")
+      },
+      hasOutlet: false,
+      children: /* @__PURE__ */ jsx4(WorkflowExecutionListTable, {})
+    }
+  );
+};
+export {
+  WorkflowExcecutionList as Component
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@acmekit/dashboard",
-  "version": "2.13.36",
+  "version": "2.13.37",
   "scripts": {
     "generate:static": "node ./scripts/generate-currencies.js && prettier --write ./src/lib/currencies.ts",
     "dev": "../../../node_modules/.bin/vite",
@@ -39,10 +39,10 @@
     "dist"
   ],
   "dependencies": {
-    "@acmekit/admin-shared": "2.13.36",
-    "@acmekit/icons": "2.13.36",
-    "@acmekit/js-sdk": "2.13.36",
-    "@acmekit/ui": "4.1.32",
+    "@acmekit/admin-shared": "2.13.37",
+    "@acmekit/icons": "2.13.37",
+    "@acmekit/js-sdk": "2.13.37",
+    "@acmekit/ui": "4.1.33",
     "@ariakit/react": "^0.4.15",
     "@babel/runtime": "^7.26.10",
     "@dnd-kit/core": "^6.1.0",
@@ -80,10 +80,10 @@
     "zod": "3.25.76"
   },
   "devDependencies": {
-    "@acmekit/admin-shared": "2.13.36",
-    "@acmekit/admin-vite-plugin": "2.13.36",
-    "@acmekit/types": "2.13.36",
-    "@acmekit/ui-preset": "2.13.36"
+    "@acmekit/admin-shared": "2.13.37",
+    "@acmekit/admin-vite-plugin": "2.13.37",
+    "@acmekit/types": "2.13.37",
+    "@acmekit/ui-preset": "2.13.37"
   },
   "packageManager": "yarn@3.2.1"
 }

package/dist/chunk-A7ULKHDE.mjs

@@ -1,126 +0,0 @@
-import {
-  queryClient
-} from "./chunk-FXYH54JP.mjs";
-import {
-  queryKeysFactory
-} from "./chunk-774WSTCC.mjs";
-import {
-  sdk
-} from "./chunk-YKIWIMJX.mjs";
-
-// src/hooks/api/workflow-executions.tsx
-import {
-  useMutation,
-  useQuery
-} from "@tanstack/react-query";
-var WORKFLOW_EXECUTIONS_QUERY_KEY = "workflow_executions";
-var workflowExecutionsQueryKeys = queryKeysFactory(
-  WORKFLOW_EXECUTIONS_QUERY_KEY
-);
-var useWorkflowExecutions = (query, options) => {
-  const { data, ...rest } = useQuery({
-    queryFn: () => sdk.admin.workflowExecution.list(query),
-    queryKey: workflowExecutionsQueryKeys.list(query),
-    ...options
-  });
-  return { ...data, ...rest };
-};
-var useWorkflowExecution = (id, options) => {
-  const { data, ...rest } = useQuery({
-    queryFn: () => sdk.admin.workflowExecution.retrieve(id),
-    queryKey: workflowExecutionsQueryKeys.detail(id),
-    ...options
-  });
-  return { ...data, ...rest };
-};
-var useRunWorkflow = (workflowId, options) => {
-  return useMutation({
-    mutationFn: (payload) => sdk.admin.workflowExecution.run(workflowId, payload),
-    onSuccess: (data, variables, context) => {
-      queryClient.invalidateQueries({
-        queryKey: workflowExecutionsQueryKeys.lists()
-      });
-      options?.onSuccess?.(data, variables, context);
-    },
-    ...options
-  });
-};
-var useCancelWorkflowExecution = (workflowId, transactionId, options) => {
-  return useMutation({
-    mutationFn: (payload) => sdk.admin.workflowExecution.cancel(
-      workflowId,
-      transactionId,
-      payload || {}
-    ),
-    onSuccess: (data, variables, context) => {
-      queryClient.invalidateQueries({
-        queryKey: workflowExecutionsQueryKeys.lists()
-      });
-      queryClient.invalidateQueries({
-        queryKey: workflowExecutionsQueryKeys.details()
-      });
-      options?.onSuccess?.(data, variables, context);
-    },
-    ...options
-  });
-};
-var useRetryStep = (workflowId, transactionId, options) => {
-  return useMutation({
-    mutationFn: (payload) => sdk.admin.workflowExecution.retryStep(
-      workflowId,
-      transactionId,
-      payload
-    ),
-    onSuccess: (data, variables, context) => {
-      queryClient.invalidateQueries({
-        queryKey: workflowExecutionsQueryKeys.lists()
-      });
-      queryClient.invalidateQueries({
-        queryKey: workflowExecutionsQueryKeys.details()
-      });
-      options?.onSuccess?.(data, variables, context);
-    },
-    ...options
-  });
-};
-var useSetStepSuccess = (workflowId, options) => {
-  return useMutation({
-    mutationFn: (payload) => sdk.admin.workflowExecution.setStepSuccess(workflowId, payload),
-    onSuccess: (data, variables, context) => {
-      queryClient.invalidateQueries({
-        queryKey: workflowExecutionsQueryKeys.lists()
-      });
-      queryClient.invalidateQueries({
-        queryKey: workflowExecutionsQueryKeys.details()
-      });
-      options?.onSuccess?.(data, variables, context);
-    },
-    ...options
-  });
-};
-var useSetStepFailure = (workflowId, options) => {
-  return useMutation({
-    mutationFn: (payload) => sdk.admin.workflowExecution.setStepFailure(workflowId, payload),
-    onSuccess: (data, variables, context) => {
-      queryClient.invalidateQueries({
-        queryKey: workflowExecutionsQueryKeys.lists()
-      });
-      queryClient.invalidateQueries({
-        queryKey: workflowExecutionsQueryKeys.details()
-      });
-      options?.onSuccess?.(data, variables, context);
-    },
-    ...options
-  });
-};
-
-export {
-  workflowExecutionsQueryKeys,
-  useWorkflowExecutions,
-  useWorkflowExecution,
-  useRunWorkflow,
-  useCancelWorkflowExecution,
-  useRetryStep,
-  useSetStepSuccess,
-  useSetStepFailure
-};

package/dist/chunk-GBPAZAJK.mjs

@@ -1,34 +0,0 @@
-import {
-  queryKeysFactory
-} from "./chunk-774WSTCC.mjs";
-import {
-  sdk
-} from "./chunk-YKIWIMJX.mjs";
-
-// src/hooks/api/workflow-definitions.tsx
-import { useQuery } from "@tanstack/react-query";
-var WORKFLOW_DEFINITIONS_QUERY_KEY = "workflow_definitions";
-var workflowDefinitionsQueryKeys = queryKeysFactory(
-  WORKFLOW_DEFINITIONS_QUERY_KEY
-);
-var useWorkflowDefinitions = (query, options) => {
-  const { data, ...rest } = useQuery({
-    queryFn: () => sdk.admin.workflowDefinition.list(query),
-    queryKey: workflowDefinitionsQueryKeys.list(query),
-    ...options
-  });
-  return { ...data, ...rest };
-};
-var useWorkflowDefinition = (id, options) => {
-  const { data, ...rest } = useQuery({
-    queryFn: () => sdk.admin.workflowDefinition.retrieve(id),
-    queryKey: workflowDefinitionsQueryKeys.detail(id),
-    ...options
-  });
-  return { ...data, ...rest };
-};
-
-export {
-  useWorkflowDefinitions,
-  useWorkflowDefinition
-};