@acmekit/dashboard 2.13.36 → 2.13.38

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

@@ -1,596 +0,0 @@
-import {
-  DateCell
-} from "./chunk-QZOY6YYT.mjs";
-import {
-  TRANSACTION_ERROR_STATES,
-  TRANSACTION_IN_PROGRESS_STATES,
-  getTransactionState,
-  getTransactionStateColor
-} from "./chunk-LP6CPB7N.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-RISX76YT.mjs";
-import {
-  useExtension
-} from "./chunk-C5P5PL3E.mjs";
-import {
-  ActionMenu
-} from "./chunk-S3REQHPQ.mjs";
-import {
-  useCancelWorkflowExecution,
-  useRunWorkflow,
-  useWorkflowExecutions,
-  workflowExecutionsQueryKeys
-} from "./chunk-A7ULKHDE.mjs";
-import "./chunk-ITNQKZQQ.mjs";
-import "./chunk-OAHCJFG3.mjs";
-import "./chunk-S4DMV3ZT.mjs";
-import "./chunk-FXYH54JP.mjs";
-import "./chunk-774WSTCC.mjs";
-import "./chunk-YKIWIMJX.mjs";
-import "./chunk-QZ7TP4HQ.mjs";
-
-// src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/workflow-execution-list-table.tsx
-import { PlayMiniSolid } from "@acmekit/icons";
-import { Button as Button2, Container, Heading, Text as Text2 } from "@acmekit/ui";
-import { keepPreviousData } from "@tanstack/react-query";
-import { useTranslation as useTranslation5 } from "react-i18next";
-import { Link } from "react-router-dom";
-
-// src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/workflow-execution-auto-refresh.tsx
-import { ArrowPathMini } from "@acmekit/icons";
-import { DropdownMenu, IconButton } from "@acmekit/ui";
-import { useQueryClient } from "@tanstack/react-query";
-import { useCallback, useEffect, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-var INTERVALS = [
-  { label: "Off", value: 0 },
-  { label: "5s", value: 5e3 },
-  { label: "10s", value: 1e4 },
-  { label: "30s", value: 3e4 }
-];
-var WorkflowExecutionAutoRefresh = () => {
-  const queryClient = useQueryClient();
-  const [interval, setInterval_] = useState(0);
-  const intervalRef = useRef(null);
-  const refresh = useCallback(() => {
-    queryClient.invalidateQueries({
-      queryKey: workflowExecutionsQueryKeys.lists()
-    });
-  }, [queryClient]);
-  useEffect(() => {
-    if (intervalRef.current) {
-      clearInterval(intervalRef.current);
-      intervalRef.current = null;
-    }
-    if (interval > 0) {
-      intervalRef.current = setInterval(refresh, interval);
-    }
-    return () => {
-      if (intervalRef.current) {
-        clearInterval(intervalRef.current);
-      }
-    };
-  }, [interval, refresh]);
-  const activeLabel = INTERVALS.find((i) => i.value === interval)?.label;
-  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-1", children: [
-    /* @__PURE__ */ jsx(
-      IconButton,
-      {
-        size: "small",
-        variant: "transparent",
-        onClick: refresh,
-        children: /* @__PURE__ */ jsx(ArrowPathMini, {})
-      }
-    ),
-    /* @__PURE__ */ jsxs(DropdownMenu, { children: [
-      /* @__PURE__ */ jsx(DropdownMenu.Trigger, { asChild: true, children: /* @__PURE__ */ jsx("button", { className: "txt-compact-small text-ui-fg-muted hover:text-ui-fg-subtle rounded px-1.5 py-0.5 transition-colors", children: activeLabel }) }),
-      /* @__PURE__ */ jsx(DropdownMenu.Content, { align: "end", children: INTERVALS.map((opt) => /* @__PURE__ */ jsx(
-        DropdownMenu.Item,
-        {
-          onClick: () => setInterval_(opt.value),
-          className: interval === opt.value ? "font-medium" : "",
-          children: opt.label
-        },
-        opt.value
-      )) })
-    ] })
-  ] });
-};
-
-// src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/workflow-execution-saved-views.tsx
-import { Button, clx } from "@acmekit/ui";
-import { useCallback as useCallback2, useMemo } from "react";
-import { useTranslation } from "react-i18next";
-import { useSearchParams } from "react-router-dom";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var WorkflowExecutionSavedViews = () => {
-  const { t } = useTranslation();
-  const [searchParams, setSearchParams] = useSearchParams();
-  const views = useMemo(
-    () => [
-      {
-        label: t("workflowExecutions.filters.allExecutions"),
-        params: {}
-      },
-      {
-        label: t("workflowExecutions.filters.running"),
-        params: { state: "invoking" }
-      },
-      {
-        label: t("workflowExecutions.filters.failedToday"),
-        params: {
-          state: "failed",
-          created_at: JSON.stringify({
-            $gte: new Date(
-              (/* @__PURE__ */ new Date()).setHours(0, 0, 0, 0)
-            ).toISOString()
-          })
-        }
-      }
-    ],
-    [t]
-  );
-  const isActive = useCallback2(
-    (view) => {
-      const viewKeys = Object.keys(view.params);
-      if (viewKeys.length === 0) {
-        return !searchParams.has("state") && !searchParams.has("created_at");
-      }
-      return viewKeys.every(
-        (key) => searchParams.get(key) === view.params[key]
-      );
-    },
-    [searchParams]
-  );
-  const handleClick = useCallback2(
-    (view) => {
-      const newParams = new URLSearchParams();
-      for (const [key, value] of Object.entries(view.params)) {
-        newParams.set(key, value);
-      }
-      setSearchParams(newParams);
-    },
-    [setSearchParams]
-  );
-  return /* @__PURE__ */ jsx2("div", { className: "flex items-center gap-x-1", children: views.map((view) => /* @__PURE__ */ jsx2(
-    Button,
-    {
-      variant: "transparent",
-      size: "small",
-      onClick: () => handleClick(view),
-      className: clx(
-        "txt-compact-small-plus",
-        isActive(view) ? "bg-ui-bg-base shadow-elevation-card-rest text-ui-fg-base" : "text-ui-fg-muted"
-      ),
-      children: view.label
-    },
-    view.label
-  )) });
-};
-
-// src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/use-workflow-execution-table-columns.tsx
-import { Badge, Copy, Text, clx as clx3 } from "@acmekit/ui";
-import { createColumnHelper } from "@tanstack/react-table";
-import { useMemo as useMemo2 } from "react";
-import { useTranslation as useTranslation3 } from "react-i18next";
-
-// src/components/data-table/components/data-table-status-cell/data-table-status-cell.tsx
-import { clx as clx2 } from "@acmekit/ui";
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-var DataTableStatusCell = ({
-  color,
-  children
-}) => {
-  return /* @__PURE__ */ jsxs2("div", { className: "txt-compact-small text-ui-fg-subtle flex h-full w-full items-center gap-x-2 overflow-hidden", children: [
-    /* @__PURE__ */ jsx3(
-      "div",
-      {
-        role: "presentation",
-        className: "flex h-5 w-2 items-center justify-center",
-        children: /* @__PURE__ */ jsx3(
-          "div",
-          {
-            className: clx2(
-              "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__ */ jsx3("span", { className: "truncate", children })
-  ] });
-};
-
-// src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/workflow-execution-row-actions.tsx
-import { ArrowPathMini as ArrowPathMini2, Eye, XMark } from "@acmekit/icons";
-import { toast, usePrompt } from "@acmekit/ui";
-import { useTranslation as useTranslation2 } from "react-i18next";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var WorkflowExecutionRowActions = ({
-  execution
-}) => {
-  const { t } = useTranslation2();
-  const prompt = usePrompt();
-  const state = execution.state;
-  const isFailed = TRANSACTION_ERROR_STATES.includes(state);
-  const isRunning = TRANSACTION_IN_PROGRESS_STATES.includes(state);
-  const workflowId = execution.workflow_id;
-  const transactionId = execution.transaction_id;
-  const { mutateAsync: runAsync } = useRunWorkflow(workflowId);
-  const { mutateAsync: cancelAsync } = useCancelWorkflowExecution(
-    workflowId,
-    transactionId
-  );
-  const handleRetry = async () => {
-    const payload = execution?.context?.data?.payload;
-    const input = payload && typeof payload === "object" ? payload : {};
-    await runAsync(
-      { input },
-      {
-        onSuccess: () => {
-          toast.success(t("workflowExecutions.actions.retrySuccess"));
-        },
-        onError: (err) => {
-          toast.error(err.message);
-        }
-      }
-    );
-  };
-  const handleCancel = async () => {
-    const res = await prompt({
-      title: t("workflowExecutions.actions.cancelConfirmTitle"),
-      description: t(
-        "workflowExecutions.actions.cancelConfirmDescription",
-        { workflow_id: workflowId }
-      ),
-      confirmText: t("workflowExecutions.actions.cancel"),
-      cancelText: t("actions.cancel")
-    });
-    if (!res) return;
-    await cancelAsync(void 0, {
-      onSuccess: () => {
-        toast.success(t("workflowExecutions.actions.cancelSuccess"));
-      },
-      onError: (err) => {
-        toast.error(err.message);
-      }
-    });
-  };
-  const secondaryActions = [];
-  if (isFailed) {
-    secondaryActions.push({
-      icon: /* @__PURE__ */ jsx4(ArrowPathMini2, {}),
-      label: t("workflowExecutions.actions.retry"),
-      onClick: handleRetry
-    });
-  }
-  if (isRunning) {
-    secondaryActions.push({
-      icon: /* @__PURE__ */ jsx4(XMark, {}),
-      label: t("workflowExecutions.actions.cancel"),
-      onClick: handleCancel
-    });
-  }
-  const groups = [
-    {
-      actions: [
-        {
-          icon: /* @__PURE__ */ jsx4(Eye, {}),
-          label: t("workflowExecutions.actions.viewDetails"),
-          to: `${execution.id}`
-        }
-      ]
-    },
-    ...secondaryActions.length > 0 ? [{ actions: secondaryActions }] : []
-  ];
-  return /* @__PURE__ */ jsx4(ActionMenu, { groups });
-};
-
-// src/routes/workflow-executions/workflow-execution-list/components/workflow-execution-list-table/use-workflow-execution-table-columns.tsx
-import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
-var columnHelper = createColumnHelper();
-var useWorkflowExecutionTableColumns = () => {
-  const { t } = useTranslation3();
-  return useMemo2(
-    () => [
-      columnHelper.accessor("workflow_id", {
-        header: t("workflowExecutions.workflowIdLabel"),
-        cell: ({ getValue }) => {
-          const workflowId = getValue();
-          return /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-x-1", children: [
-            /* @__PURE__ */ jsx5(Badge, { size: "2xsmall", className: "truncate", children: workflowId }),
-            /* @__PURE__ */ jsx5(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__ */ jsx5(DataTableStatusCell, { color, children: /* @__PURE__ */ jsx5("span", { className: "capitalize", children: translatedState }) });
-        }
-      }),
-      columnHelper.accessor("execution", {
-        header: t("workflowExecutions.progressLabel"),
-        cell: ({ getValue }) => {
-          const steps = getValue()?.steps;
-          if (!steps) {
-            return /* @__PURE__ */ jsx5("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__ */ jsxs3("div", { className: "flex items-center gap-x-2", children: [
-            /* @__PURE__ */ jsx5("div", { className: "flex items-center gap-x-[3px]", children: actionableSteps.map((step) => /* @__PURE__ */ jsx5(
-              "div",
-              {
-                className: clx3(
-                  "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__ */ jsx5("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__ */ jsx5(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__ */ jsx5(Text, { size: "small", leading: "compact", className: "text-ui-fg-subtle", children: "-" });
-          }
-          const ms = end.getTime() - start.getTime();
-          if (ms < 0) {
-            return /* @__PURE__ */ jsx5(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__ */ jsx5(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__ */ jsx5(DateCell, { date });
-        }
-      }),
-      columnHelper.accessor("updated_at", {
-        header: t("fields.updatedAt"),
-        cell: ({ getValue }) => {
-          const date = getValue();
-          return /* @__PURE__ */ jsx5(DateCell, { date });
-        }
-      }),
-      columnHelper.display({
-        id: "actions",
-        cell: ({ row }) => /* @__PURE__ */ jsx5(WorkflowExecutionRowActions, { execution: row.original })
-      })
-    ],
-    [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 useTranslation4 } from "react-i18next";
-var useWorkflowExecutionTableFilters = () => {
-  const { t } = useTranslation4();
-  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" }
-  ];
-  const workflowIdFilter = {
-    key: "workflow_id",
-    label: t("workflowExecutions.workflowIdLabel"),
-    type: "string"
-  };
-  return [stateFilter, workflowIdFilter, ...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", "workflow_id", "created_at", "updated_at"],
-    prefix
-  );
-  const { offset, order, state, workflow_id, 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,
-    workflow_id: workflow_id ? workflow_id.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 jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
-var PAGE_SIZE = 20;
-var WorkflowExecutionListTable = () => {
-  const { t } = useTranslation5();
-  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__ */ jsxs4(Container, { className: "divide-y p-0", children: [
-    /* @__PURE__ */ jsxs4("div", { className: "flex items-center justify-between px-6 py-4", children: [
-      /* @__PURE__ */ jsxs4("div", { children: [
-        /* @__PURE__ */ jsx6(Heading, { children: t("workflowExecutions.domain") }),
-        /* @__PURE__ */ jsx6(Text2, { className: "text-ui-fg-subtle", size: "small", children: t(`workflowExecutions.subtitle`) })
-      ] }),
-      /* @__PURE__ */ jsxs4("div", { className: "flex items-center gap-x-2", children: [
-        /* @__PURE__ */ jsx6(WorkflowExecutionAutoRefresh, {}),
-        /* @__PURE__ */ jsx6(Button2, { variant: "secondary", size: "small", asChild: true, children: /* @__PURE__ */ jsxs4(Link, { to: "run", children: [
-          /* @__PURE__ */ jsx6(PlayMiniSolid, { className: "mr-1" }),
-          t("workflowExecutions.actions.runWorkflow")
-        ] }) })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx6("div", { className: "border-ui-border-base border-b px-6 py-2", children: /* @__PURE__ */ jsx6(WorkflowExecutionSavedViews, {}) }),
-    /* @__PURE__ */ jsx6(
-      _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 jsx7 } from "react/jsx-runtime";
-var WorkflowExcecutionList = () => {
-  const { getWidgets } = useExtension();
-  return /* @__PURE__ */ jsx7(
-    SingleColumnPage,
-    {
-      widgets: {
-        after: getWidgets("workflow.list.after"),
-        before: getWidgets("workflow.list.before")
-      },
-      hasOutlet: true,
-      children: /* @__PURE__ */ jsx7(WorkflowExecutionListTable, {})
-    }
-  );
-};
-export {
-  WorkflowExcecutionList as Component
-};