@burdenoff/fluidgrids-fe-sdk 2026.1021.8 → 2026.1021.9

package/dist/{ExecutionDetailPage-2CAK5J7R.js → ExecutionDetailPage-CEXLJ6GN.js}

@@ -1,4 +1,4 @@
-export { ExecutionDetailPage } from './chunk-WUA2WMJH.js';
+export { ExecutionDetailPage } from './chunk-XOUL22OI.js';
 import './chunk-3SCUZ75C.js';
 import './chunk-QBFAJNUC.js';
 import './chunk-ONVGFVNH.js';

package/dist/{WorkflowBuilder-FDRHB5ZZ.js → WorkflowBuilder-PYJ5T23Q.js}

@@ -1,6 +1,6 @@
-export { WorkflowBuilder } from './chunk-66FIPZKK.js';
+export { WorkflowBuilder } from './chunk-RFG3PJX3.js';
 import './chunk-6N27YGMB.js';
-import './chunk-FZONRYII.js';
+import './chunk-2CDLVDSU.js';
 import './chunk-GEMNVFPK.js';
 import './chunk-IEVSFCFS.js';
 import './chunk-7LSGGJ7D.js';

package/dist/{chunk-FZONRYII.js → chunk-2CDLVDSU.js}

@@ -3587,7 +3587,11 @@ function isDynamicSpec(spec) {
 var DEFAULT_HANDLES = [{ id: "source", label: "" }];
 function resolveOutputHandles(data) {
   const nodeData = data?.nodeData;
-  const spec = nodeData?.outputHandles ?? nodeData?.operations?.outputHandles;
+  const operationsBlob = Array.isArray(nodeData?.operations) ? void 0 : nodeData?.operations;
+  const operationList = Array.isArray(nodeData?.operations) ? nodeData.operations : operationsBlob?.operations ?? [];
+  const operationName = typeof data?.operation_name === "string" ? data.operation_name : void 0;
+  const operationSpec = operationName ? operationList.find((op) => op?.name === operationName)?.outputHandles : void 0;
+  const spec = operationSpec ?? nodeData?.outputHandles ?? operationsBlob?.outputHandles;
   if (!spec) return DEFAULT_HANDLES;
   if (isDynamicSpec(spec)) {
     const args = data?.args;

package/dist/{chunk-2TK2KCRD.js → chunk-2QROSNUI.js}

@@ -1,4 +1,4 @@
-import { useImportWorkflowTemplate, FlowBuilderPage, useWorkflowTemplates, TemplateCard } from './chunk-FZONRYII.js';
+import { useImportWorkflowTemplate, FlowBuilderPage, useWorkflowTemplates, TemplateCard } from './chunk-2CDLVDSU.js';
 import { QuotaExhaustedDialog } from './chunk-SQFFJUAT.js';
 import { useWorkflowDefinitions, useDuplicateWorkflow } from './chunk-O6E247J6.js';
 import { templatesControls } from './chunk-D3UWK7GY.js';

package/dist/{chunk-66FIPZKK.js → chunk-RFG3PJX3.js}

@@ -1,5 +1,5 @@
 import { isCreateIntent, decideMissingWorkflow } from './chunk-6N27YGMB.js';
-import { useInstalledNodes, buildNodeCheck, refetchStoreNodes, FlowBuilderPage, buildRequiredNodeTypes, mergeStickyNotes } from './chunk-FZONRYII.js';
+import { useInstalledNodes, buildNodeCheck, refetchStoreNodes, FlowBuilderPage, buildRequiredNodeTypes, mergeStickyNotes } from './chunk-2CDLVDSU.js';
 import { useLazyWorkflowDefinition, useCreateWorkflow } from './chunk-O6E247J6.js';
 import { useFlowStore } from './chunk-EGYJKHAL.js';
 import { useTr } from './chunk-UULVIT25.js';

package/dist/{chunk-VIX4NT5F.js → chunk-V2UCWUBQ.js}

@@ -1,4 +1,4 @@
-import { FluidGridsProvider, Card, FluidGridsMark } from './chunk-FZONRYII.js';
+import { FluidGridsProvider, Card, FluidGridsMark } from './chunk-2CDLVDSU.js';
 import { Input } from './chunk-IEVSFCFS.js';
 import { Button } from './chunk-GDAFKRQO.js';
 import { cn } from './chunk-JL7CASN5.js';

package/dist/{chunk-WUA2WMJH.js → chunk-XOUL22OI.js}

@@ -4,15 +4,16 @@ import { getFluidGridsConfig } from './chunk-UZG3ZIQM.js';
 import { RunLogsDocument, RunLogAppendedDocument } from './chunk-L2UWPFJM.js';
 import { throwIfResultError } from './chunk-CFCUM4CN.js';
 import { useTr } from './chunk-UULVIT25.js';
-import { getFluidGridsClientSafe } from './chunk-NTWG3CJX.js';
-import { useState, useMemo, useCallback, useRef, useEffect } from 'react';
+import { getFluidGridsClient, getFluidGridsClientSafe } from './chunk-NTWG3CJX.js';
+import { useState, useRef, useCallback, useEffect, useMemo } from 'react';
 import { useParams, useNavigate, Link } from 'react-router';
 import { Icon } from '@iconify/react';
 import { toast } from 'sonner';
 import { Button } from '@burdenoff/fe-libs/button';
-import { AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogCancel, AlertDialogAction } from '@burdenoff/fe-libs/ui';
+import { Card, CardHeader, Badge, CardContent, Label, Textarea, AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogTitle, AlertDialogDescription, AlertDialogFooter, AlertDialogCancel, AlertDialogAction, Input } from '@burdenoff/fe-libs/ui';
 import { useActorProfiles, buildActorFallback } from '@burdenoff/fe-libs/shared';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { gql } from '@apollo/client';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 
 var POLL_INTERVAL_MS = 2e3;
 var PAGE_SIZE = 500;
@@ -164,6 +165,524 @@ function useRunLogs(runId, options = {}) {
     refetch
   };
 }
+var HUMAN_REQUEST_FIELDS = gql`
+  fragment WorkflowHumanRequestFields on WorkflowHumanRequest {
+    id
+    runId
+    nodeId
+    workflowKey
+    channel
+    recipient
+    responseType
+    title
+    message
+    approvalType
+    approveLabel
+    declineLabel
+    submitLabel
+    fields {
+      name
+      label
+      type
+      required
+      placeholder
+      options
+    }
+    status
+    decision
+    response
+    respondedBy
+    respondedVia
+    expiresAt
+    respondedAt
+    createdAt
+    canRespond
+  }
+`;
+var GET_PENDING_HUMAN_REQUESTS = gql`
+  ${HUMAN_REQUEST_FIELDS}
+  query GetPendingWorkflowHumanRequests($limit: Int, $offset: Int) {
+    pendingWorkflowHumanRequests(limit: $limit, offset: $offset) {
+      totalCount
+      items {
+        ...WorkflowHumanRequestFields
+      }
+    }
+  }
+`;
+var GET_RUN_HUMAN_REQUESTS = gql`
+  ${HUMAN_REQUEST_FIELDS}
+  query GetWorkflowHumanRequests($runId: ID!) {
+    workflowHumanRequests(runId: $runId) {
+      ...WorkflowHumanRequestFields
+    }
+  }
+`;
+var RESPOND_TO_HUMAN_REQUEST = gql`
+  ${HUMAN_REQUEST_FIELDS}
+  mutation RespondToWorkflowHumanRequest(
+    $input: RespondToWorkflowHumanRequestInput!
+  ) {
+    respondToWorkflowHumanRequest(input: $input) {
+      success
+      decision
+      error
+      request {
+        ...WorkflowHumanRequestFields
+      }
+    }
+  }
+`;
+function usePendingHumanRequests(options) {
+  const limit = options?.limit ?? 50;
+  const offset = options?.offset ?? 0;
+  const pollIntervalMs = options?.pollIntervalMs ?? 15e3;
+  const [items, setItems] = useState([]);
+  const [totalCount, setTotalCount] = useState(0);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const generation = useRef(0);
+  const fetchData = useCallback(async () => {
+    const ticket = ++generation.current;
+    setError(null);
+    try {
+      const result = throwIfResultError(
+        await getFluidGridsClient().query({
+          query: GET_PENDING_HUMAN_REQUESTS,
+          variables: { limit, offset },
+          fetchPolicy: "network-only"
+        })
+      );
+      if (ticket !== generation.current) return;
+      setItems(result.data?.pendingWorkflowHumanRequests?.items ?? []);
+      setTotalCount(result.data?.pendingWorkflowHumanRequests?.totalCount ?? 0);
+    } catch (err) {
+      if (ticket !== generation.current) return;
+      setError(err);
+    } finally {
+      if (ticket === generation.current) setLoading(false);
+    }
+  }, [limit, offset]);
+  useEffect(() => {
+    fetchData();
+    if (pollIntervalMs <= 0) return;
+    const interval = setInterval(fetchData, pollIntervalMs);
+    return () => clearInterval(interval);
+  }, [fetchData, pollIntervalMs]);
+  return { items, totalCount, loading, error, refetch: fetchData };
+}
+function useRunHumanRequests(runId, options) {
+  const pollIntervalMs = options?.pollIntervalMs ?? 0;
+  const [items, setItems] = useState([]);
+  const [error, setError] = useState(null);
+  const [loaded, setLoaded] = useState(false);
+  const [loadedAt, setLoadedAt] = useState(null);
+  const currentRunId = useRef(runId);
+  useEffect(() => {
+    currentRunId.current = runId;
+    setItems([]);
+    setError(null);
+    setLoaded(false);
+    setLoadedAt(null);
+  }, [runId]);
+  const generation = useRef(0);
+  const fetchData = useCallback(async () => {
+    if (!runId) return;
+    const ticket = ++generation.current;
+    const startedAt = Date.now();
+    setError(null);
+    try {
+      const result = throwIfResultError(
+        await getFluidGridsClient().query({
+          query: GET_RUN_HUMAN_REQUESTS,
+          variables: { runId },
+          fetchPolicy: "network-only",
+          // A fresh request every time: joining a read already in flight would hand back a list
+          // fetched before the caller's state change, stamped as if it were newer.
+          context: { queryDeduplication: false }
+        })
+      );
+      if (ticket !== generation.current || currentRunId.current !== runId) {
+        return;
+      }
+      setItems(result.data?.workflowHumanRequests ?? []);
+      setLoaded(true);
+      setLoadedAt(startedAt);
+    } catch (err) {
+      if (ticket !== generation.current || currentRunId.current !== runId) {
+        return;
+      }
+      setError(err);
+    }
+  }, [runId]);
+  useEffect(() => {
+    fetchData();
+    if (pollIntervalMs <= 0) return;
+    const interval = setInterval(fetchData, pollIntervalMs);
+    return () => clearInterval(interval);
+  }, [fetchData, pollIntervalMs]);
+  return { items, error, loaded, loadedAt, refetch: fetchData };
+}
+function useRespondToHumanRequest() {
+  const [loading, setLoading] = useState(false);
+  const respond = useCallback(
+    async (id, answer) => {
+      setLoading(true);
+      try {
+        const result = throwIfResultError(
+          await getFluidGridsClient().mutate({
+            mutation: RESPOND_TO_HUMAN_REQUEST,
+            variables: { input: { id, ...answer } }
+          })
+        );
+        const payload = result.data?.respondToWorkflowHumanRequest;
+        if (!payload?.success) {
+          throw new Error(payload?.error || "The response was not recorded");
+        }
+        return payload.decision;
+      } finally {
+        setLoading(false);
+      }
+    },
+    []
+  );
+  return { respond, loading };
+}
+var CHANNEL_ICON = {
+  EMAIL: "mdi:email-outline",
+  SLACK: "mdi:slack",
+  IN_APP: "mdi:bell-outline"
+};
+function channelLabel(channel, tr) {
+  switch (channel) {
+    case "EMAIL":
+      return tr("fluidgrids.humanResponse.channelEmail", "email");
+    case "SLACK":
+      return tr("fluidgrids.humanResponse.channelSlack", "Slack");
+    default:
+      return tr("fluidgrids.humanResponse.channelInApp", "in-app");
+  }
+}
+function inputType(field) {
+  const type = (field.type || "text").toLowerCase();
+  return ["email", "number", "date", "tel", "url"].includes(type) ? type : "text";
+}
+function FormControls({
+  requestId,
+  fields,
+  values,
+  onChange
+}) {
+  return /* @__PURE__ */ jsx("div", { className: "space-y-3", children: fields.map((field) => {
+    const id = `human-field-${requestId}-${field.name}`;
+    const label = `${field.label || field.name}${field.required ? " *" : ""}`;
+    const type = (field.type || "text").toLowerCase();
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+      /* @__PURE__ */ jsx(Label, { htmlFor: id, children: label }),
+      type === "textarea" ? /* @__PURE__ */ jsx(
+        Textarea,
+        {
+          id,
+          value: values[field.name] ?? "",
+          placeholder: field.placeholder ?? void 0,
+          onChange: (event) => onChange(field.name, event.target.value)
+        }
+      ) : type === "dropdown" || type === "select" ? /* @__PURE__ */ jsxs(
+        "select",
+        {
+          id,
+          className: "w-full rounded-md border border-border-secondary bg-background-primary px-3 py-2 text-sm text-text-primary",
+          value: values[field.name] ?? "",
+          onChange: (event) => onChange(field.name, event.target.value),
+          children: [
+            /* @__PURE__ */ jsx("option", { value: "", children: "\u2014" }),
+            (field.options ?? []).map((option) => /* @__PURE__ */ jsx("option", { value: option, children: option }, option))
+          ]
+        }
+      ) : /* @__PURE__ */ jsx(
+        Input,
+        {
+          id,
+          type: inputType(field),
+          value: values[field.name] ?? "",
+          placeholder: field.placeholder ?? void 0,
+          onChange: (event) => onChange(field.name, event.target.value)
+        }
+      )
+    ] }, field.name);
+  }) });
+}
+function HumanRequestCard({
+  request,
+  onAnswered
+}) {
+  const tr = useTr();
+  const { respond, loading } = useRespondToHumanRequest();
+  const [text, setText] = useState("");
+  const [values, setValues] = useState({});
+  const submit = async (answer) => {
+    try {
+      const decision = await respond(request.id, answer);
+      toast.success(
+        decision === "declined" ? tr(
+          "fluidgrids.humanResponse.declinedToast",
+          "Declined \u2014 the workflow is continuing"
+        ) : tr(
+          "fluidgrids.humanResponse.answeredToast",
+          "Response sent \u2014 the workflow is continuing"
+        )
+      );
+      onAnswered();
+    } catch (err) {
+      toast.error(
+        err instanceof Error ? err.message : tr(
+          "fluidgrids.humanResponse.failed",
+          "Your response could not be recorded"
+        )
+      );
+    }
+  };
+  const missingRequired = request.responseType === "CUSTOM_FORM" && request.fields.some(
+    (field) => field.required && !(values[field.name] ?? "").trim()
+  );
+  const emptyText = request.responseType === "FREE_TEXT" && !text.trim();
+  const recipient = request.channel === "IN_APP" && !request.recipient ? tr("fluidgrids.humanResponse.anyMember", "any workspace member") : request.recipient;
+  return /* @__PURE__ */ jsxs(
+    Card,
+    {
+      className: "border border-border-secondary bg-background-secondary",
+      "data-testid": "human-request-card",
+      "data-request-id": request.id,
+      children: [
+        /* @__PURE__ */ jsxs(CardHeader, { className: "pb-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [
+              /* @__PURE__ */ jsx(
+                Icon,
+                {
+                  icon: CHANNEL_ICON[request.channel] ?? "mdi:account-question",
+                  width: 18,
+                  className: "shrink-0 text-text-secondary"
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { className: "truncate text-sm font-semibold text-text-primary", children: request.title })
+            ] }),
+            /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "font-mono text-[10px]", children: request.workflowKey })
+          ] }),
+          /* @__PURE__ */ jsxs("p", { className: "text-xs text-text-secondary", children: [
+            tr(
+              "fluidgrids.humanResponse.askedVia",
+              "Asked {{recipient}} via {{channel}}",
+              {
+                recipient: recipient ?? "",
+                channel: channelLabel(request.channel, tr)
+              }
+            ),
+            request.expiresAt && ` \xB7 ${tr("fluidgrids.humanResponse.until", "until {{time}}", {
+              time: new Date(request.expiresAt).toLocaleString()
+            })}`
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs(CardContent, { className: "space-y-3", children: [
+          request.message && /* @__PURE__ */ jsx("p", { className: "whitespace-pre-wrap break-words text-sm text-text-primary", children: request.message }),
+          !request.canRespond && /* @__PURE__ */ jsx("p", { className: "text-xs text-text-secondary", children: request.channel === "IN_APP" ? tr(
+            "fluidgrids.humanResponse.notForYou",
+            "This request was sent to someone else."
+          ) : tr(
+            "fluidgrids.humanResponse.answerByLink",
+            "Answered through the link in the {{channel}} message.",
+            { channel: channelLabel(request.channel, tr) }
+          ) }),
+          request.canRespond && request.responseType === "FREE_TEXT" && /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: `human-text-${request.id}`, children: tr("fluidgrids.humanResponse.yourResponse", "Your response") }),
+            /* @__PURE__ */ jsx(
+              Textarea,
+              {
+                id: `human-text-${request.id}`,
+                value: text,
+                onChange: (event) => setText(event.target.value)
+              }
+            )
+          ] }),
+          request.canRespond && request.responseType === "CUSTOM_FORM" && /* @__PURE__ */ jsx(
+            FormControls,
+            {
+              requestId: request.id,
+              fields: request.fields,
+              values,
+              onChange: (name, value) => setValues((current) => ({ ...current, [name]: value }))
+            }
+          ),
+          request.canRespond && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-2 pt-1", children: request.responseType === "APPROVAL" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsxs(
+              Button,
+              {
+                size: "sm",
+                disabled: loading,
+                onClick: () => submit({ action: "approve" }),
+                "data-testid": "human-request-approve",
+                children: [
+                  /* @__PURE__ */ jsx(Icon, { icon: "mdi:check", className: "mr-1.5", width: 16 }),
+                  request.approveLabel
+                ]
+              }
+            ),
+            request.approvalType === "double" && /* @__PURE__ */ jsxs(
+              Button,
+              {
+                size: "sm",
+                variant: "destructive",
+                disabled: loading,
+                onClick: () => submit({ action: "decline" }),
+                "data-testid": "human-request-decline",
+                children: [
+                  /* @__PURE__ */ jsx(Icon, { icon: "mdi:close", className: "mr-1.5", width: 16 }),
+                  request.declineLabel
+                ]
+              }
+            )
+          ] }) : /* @__PURE__ */ jsxs(
+            Button,
+            {
+              size: "sm",
+              disabled: loading || missingRequired || emptyText,
+              onClick: () => submit(
+                request.responseType === "FREE_TEXT" ? { text } : { values }
+              ),
+              "data-testid": "human-request-submit",
+              children: [
+                /* @__PURE__ */ jsx(Icon, { icon: "mdi:send", className: "mr-1.5", width: 16 }),
+                request.submitLabel
+              ]
+            }
+          ) })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/modules/human-response/utils/answer-rows.ts
+function answerRows(request, tr) {
+  if (request.status !== "RESPONDED" || request.responseType === "APPROVAL") {
+    return [];
+  }
+  const data = request.response?.data;
+  if (!data || typeof data !== "object" || Array.isArray(data)) return [];
+  const values = data;
+  const show = (value) => {
+    if (Array.isArray(value)) return value.map(String).join(", ");
+    if (value === null || value === void 0) return "";
+    return String(value);
+  };
+  if (request.responseType === "FREE_TEXT") {
+    return [
+      {
+        key: "text",
+        label: tr("fluidgrids.humanResponse.answerLabel", "Response"),
+        value: show(values.text)
+      }
+    ];
+  }
+  return request.fields.filter((field) => values[field.name] !== void 0).map((field) => ({
+    key: field.name,
+    label: field.label || field.name,
+    value: show(values[field.name])
+  }));
+}
+function outcome(request, tr) {
+  const when = request.respondedAt ? new Date(request.respondedAt).toLocaleString() : "";
+  switch (request.status) {
+    case "RESPONDED":
+      return request.decision === "declined" ? tr("fluidgrids.humanResponse.outcomeDeclined", "Declined {{when}}", {
+        when
+      }) : request.decision === "approved" ? tr(
+        "fluidgrids.humanResponse.outcomeApproved",
+        "Approved {{when}}",
+        {
+          when
+        }
+      ) : tr(
+        "fluidgrids.humanResponse.outcomeResponded",
+        "Answered {{when}}",
+        { when }
+      );
+    case "TIMED_OUT":
+      return tr(
+        "fluidgrids.humanResponse.outcomeTimedOut",
+        "Nobody answered in time \u2014 continued down Timed out"
+      );
+    case "CANCELLED":
+      return tr(
+        "fluidgrids.humanResponse.outcomeCancelled",
+        "Withdrawn (the node was retried or the run stopped)"
+      );
+    default:
+      return request.expiresAt ? tr(
+        "fluidgrids.humanResponse.waitingUntil",
+        "Waiting until {{time}}",
+        {
+          time: new Date(request.expiresAt).toLocaleString()
+        }
+      ) : tr("fluidgrids.humanResponse.waiting", "Waiting for a response");
+  }
+}
+function RunHumanRequests({ requests }) {
+  const tr = useTr();
+  if (requests.length === 0) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "mb-6 space-y-2 rounded-lg border border-border-secondary bg-background-secondary p-4",
+      "data-testid": "run-human-requests",
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-sm font-medium text-text-primary", children: [
+          /* @__PURE__ */ jsx(Icon, { icon: "mdi:account-clock-outline", width: 18 }),
+          tr("fluidgrids.humanResponse.runHeading", "Waiting on people")
+        ] }),
+        requests.map((request) => {
+          const answer = answerRows(request, tr);
+          const recipient = request.recipient || tr("fluidgrids.humanResponse.anyMember", "any workspace member");
+          return /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: "flex flex-col gap-0.5 text-sm sm:flex-row sm:flex-wrap sm:items-baseline sm:gap-x-2",
+              "data-testid": "run-human-request",
+              "data-status": request.status,
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "font-medium text-text-primary", children: request.title }),
+                /* @__PURE__ */ jsxs("span", { className: "text-text-secondary", children: [
+                  tr(
+                    "fluidgrids.humanResponse.askedVia",
+                    "Asked {{recipient}} via {{channel}}",
+                    { recipient, channel: channelLabel(request.channel, tr) }
+                  ),
+                  " \xB7 ",
+                  outcome(request, tr)
+                ] }),
+                answer.length > 0 && /* @__PURE__ */ jsx(
+                  "dl",
+                  {
+                    className: "mt-1 w-full space-y-0.5 text-xs sm:mt-0",
+                    "data-testid": "run-human-answer",
+                    children: answer.map((row) => /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+                      /* @__PURE__ */ jsxs("dt", { className: "shrink-0 font-medium text-text-secondary", children: [
+                        row.label,
+                        ":"
+                      ] }),
+                      /* @__PURE__ */ jsx("dd", { className: "whitespace-pre-wrap break-words text-text-primary", children: row.value })
+                    ] }, row.key))
+                  }
+                )
+              ]
+            },
+            request.id
+          );
+        })
+      ]
+    }
+  );
+}
 function ExecutionDetailPage() {
   const tr = useTr();
   const { runId } = useParams();
@@ -176,6 +695,29 @@ function ExecutionDetailPage() {
   );
   const [minLogLevel, setMinLogLevel] = useState(null);
   const { execution, loading, error, refetch } = useExecution(runId);
+  const runCanChange = execution?.status === "RUNNING" || execution?.status === "PENDING" || execution?.status === "WAITING";
+  const {
+    items: humanRequests,
+    loadedAt: humanRequestsLoadedAt,
+    error: humanRequestsError,
+    refetch: refetchHumanRequests
+  } = useRunHumanRequests(runId, {
+    pollIntervalMs: runCanChange ? 1e4 : 0
+  });
+  const awaitingPerson = humanRequests.some(
+    (request) => request.status === "PENDING"
+  );
+  const [waitingSeenAt, setWaitingSeenAt] = useState(null);
+  const isWaiting = execution?.status === "WAITING";
+  useEffect(() => {
+    if (!isWaiting) {
+      setWaitingSeenAt(null);
+      return;
+    }
+    setWaitingSeenAt(Date.now());
+    void refetchHumanRequests();
+  }, [isWaiting, refetchHumanRequests]);
+  const humanRequestsCurrent = waitingSeenAt !== null && humanRequestsLoadedAt !== null && humanRequestsLoadedAt >= waitingSeenAt;
   const nodeDisplay = useMemo(
     () => buildNodeDisplayMap(execution?.workflow?.definitionJson),
     [execution?.workflow?.definitionJson]
@@ -203,7 +745,7 @@ function ExecutionDetailPage() {
     terminateExecution,
     loading: actionLoading
   } = useExecutionActions();
-  const isActive = execution?.status === "RUNNING" || execution?.status === "PENDING" || execution?.status === "WAITING";
+  const isActive = runCanChange;
   const isHistoricalTestRun = execution?.mode === "TEST" && (execution.status === "COMPLETED" || execution.status === "FAILED" || execution.status === "CANCELLED" || execution.status === "TERMINATED");
   useAutoRefresh(
     useCallback(() => {
@@ -534,7 +1076,7 @@ function ExecutionDetailPage() {
           )
         ] }),
         canControlRuns && execution.status === "WAITING" && /* @__PURE__ */ jsxs(Fragment, { children: [
-          /* @__PURE__ */ jsxs(
+          humanRequestsCurrent && !awaitingPerson && /* @__PURE__ */ jsxs(
             Button,
             {
               variant: "outline",
@@ -550,6 +1092,31 @@ function ExecutionDetailPage() {
               ]
             }
           ),
+          !humanRequestsCurrent && humanRequestsError && /* @__PURE__ */ jsxs(
+            "span",
+            {
+              className: "flex items-center gap-2 text-sm text-[var(--color-status-error-text)]",
+              "data-testid": "human-requests-error",
+              children: [
+                tr(
+                  "fluidgrids.humanResponse.checkFailed",
+                  "Could not check whether this run is waiting on a person."
+                ),
+                /* @__PURE__ */ jsxs(
+                  Button,
+                  {
+                    variant: "outline",
+                    size: "sm",
+                    onClick: () => void refetchHumanRequests(),
+                    children: [
+                      /* @__PURE__ */ jsx(Icon, { icon: "mdi:refresh", className: "mr-1", width: 16 }),
+                      tr("fluidgrids.humanResponse.retry", "Retry")
+                    ]
+                  }
+                )
+              ]
+            }
+          ),
           /* @__PURE__ */ jsxs(
             Button,
             {
@@ -693,6 +1260,7 @@ function ExecutionDetailPage() {
       ] }),
       /* @__PURE__ */ jsx("p", { className: "text-[var(--color-status-error-text)]", children: execution.errorMessage })
     ] }),
+    /* @__PURE__ */ jsx(RunHumanRequests, { requests: humanRequests }),
     /* @__PURE__ */ jsx("div", { className: "border-b border-border-secondary mb-6", children: /* @__PURE__ */ jsx("nav", { className: "flex gap-4 -mb-px", children: tabs.map((tab) => /* @__PURE__ */ jsxs(
       "button",
       {
@@ -885,4 +1453,4 @@ function ExecutionDetailPage() {
   ] });
 }
 
-export { ExecutionDetailPage };
+export { ExecutionDetailPage, HumanRequestCard, RunHumanRequests, usePendingHumanRequests, useRespondToHumanRequest, useRunHumanRequests };