stagent 0.6.2 → 0.6.3

package/src/components/workflows/workflow-form-view.tsx

@@ -1,7 +1,7 @@
 "use client";
 
-import { useState, useEffect } from "react";
-import { useRouter } from "next/navigation";
+import { useState, useEffect, useCallback } from "react";
+import { useRouter, useSearchParams } from "next/navigation";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Textarea } from "@/components/ui/textarea";
@@ -27,6 +27,8 @@ import {
   ArrowDown,
   Brain,
   ShieldCheck,
+  FileText,
+  X,
 } from "lucide-react";
 import { toast } from "sonner";
 import { FormSectionCard } from "@/components/shared/form-section-card";
@@ -47,6 +49,8 @@ import {
   MAX_PARALLEL_BRANCHES,
   MIN_PARALLEL_BRANCHES,
 } from "@/lib/workflows/parallel";
+import { DocumentPickerSheet } from "@/components/shared/document-picker-sheet";
+import { getFileIcon, formatSize } from "@/components/documents/utils";
 import {
   DEFAULT_SWARM_CONCURRENCY_LIMIT,
   MAX_SWARM_WORKERS,
@@ -284,6 +288,15 @@ function normalizeSwarmSteps(
   );
 }
 
+const PATTERN_LABELS: Record<string, string> = {
+  sequence: "Sequence",
+  "planner-executor": "Planner → Executor",
+  checkpoint: "Checkpoint",
+  loop: "Autonomous Loop",
+  parallel: "Parallel Research",
+  swarm: "Multi-Agent Swarm",
+};
+
 const PATTERN_ICONS: Record<string, React.ReactNode> = {
   sequence: <ArrowDown className="h-3.5 w-3.5 text-muted-foreground" />,
   "planner-executor": <Brain className="h-3.5 w-3.5 text-muted-foreground" />,
@@ -304,6 +317,7 @@ export function WorkflowFormView({
     runtimeOptions.map((runtime) => [runtime.id, runtime.label])
   );
   const router = useRouter();
+  const searchParams = useSearchParams();
   const mode = workflow ? (clone ? "clone" : "edit") : "create";
 
   const [name, setName] = useState("");
@@ -313,6 +327,13 @@ export function WorkflowFormView({
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
 
+  // Document pool state
+  const [selectedDocIds, setSelectedDocIds] = useState<Set<string>>(new Set());
+  const [selectedDocs, setSelectedDocs] = useState<
+    Array<{ id: string; originalName: string; mimeType: string; size: number }>
+  >([]);
+  const [pickerOpen, setPickerOpen] = useState(false);
+
   // Loop-specific state
   const [loopPrompt, setLoopPrompt] = useState("");
   const [maxIterations, setMaxIterations] = useState(5);
@@ -325,6 +346,119 @@ export function WorkflowFormView({
     DEFAULT_SWARM_CONCURRENCY_LIMIT
   );
 
+  // Pre-populate documents from URL params (e.g., from Output Dock chain)
+  useEffect(() => {
+    const inputDocsParam = searchParams.get("inputDocs");
+    if (inputDocsParam) {
+      const docIds = inputDocsParam.split(",").filter(Boolean);
+      if (docIds.length > 0) {
+        setSelectedDocIds(new Set(docIds));
+        // Fetch document metadata for display
+        Promise.all(
+          docIds.map((id) =>
+            fetch(`/api/documents?id=${id}`)
+              .then((r) => r.json())
+              .then((docs) =>
+                Array.isArray(docs) && docs.length > 0 ? docs[0] : null
+              )
+              .catch(() => null)
+          )
+        ).then((results) => {
+          setSelectedDocs(
+            results.filter(Boolean).map((d: Record<string, unknown>) => ({
+              id: d.id as string,
+              originalName: d.originalName as string,
+              mimeType: d.mimeType as string,
+              size: d.size as number,
+            }))
+          );
+        });
+      }
+    }
+  }, [searchParams]);
+
+  // Handle document picker confirmation
+  const handleDocPickerConfirm = useCallback(
+    (ids: string[]) => {
+      setSelectedDocIds(new Set(ids));
+      // Fetch metadata for newly selected docs
+      const newIds = ids.filter(
+        (id) => !selectedDocs.some((d) => d.id === id)
+      );
+      if (newIds.length > 0) {
+        fetch(`/api/documents?projectId=${projectId}&status=ready`)
+          .then((r) => r.json())
+          .then((allDocs: Array<Record<string, unknown>>) => {
+            const idSet = new Set(ids);
+            setSelectedDocs(
+              allDocs
+                .filter((d) => idSet.has(d.id as string))
+                .map((d) => ({
+                  id: d.id as string,
+                  originalName: d.originalName as string,
+                  mimeType: d.mimeType as string,
+                  size: d.size as number,
+                }))
+            );
+          })
+          .catch(() => {});
+      } else {
+        // Remove deselected docs
+        setSelectedDocs((prev) =>
+          prev.filter((d) => ids.includes(d.id))
+        );
+      }
+    },
+    [projectId, selectedDocs]
+  );
+
+  function removeDocument(id: string) {
+    setSelectedDocIds((prev) => {
+      const next = new Set(prev);
+      next.delete(id);
+      return next;
+    });
+    setSelectedDocs((prev) => prev.filter((d) => d.id !== id));
+  }
+
+  // Load existing document bindings when editing
+  useEffect(() => {
+    if (!workflow || clone) return;
+    fetch(`/api/workflows/${workflow.id}/documents`)
+      .then((r) => r.json())
+      .then((bindings: Array<{ documentId: string; document: { id: string; originalName: string; mimeType: string; size: number } | null }>) => {
+        const docs = bindings
+          .filter((b) => b.document)
+          .map((b) => b.document!);
+        if (docs.length > 0) {
+          setSelectedDocIds(new Set(docs.map((d) => d.id)));
+          setSelectedDocs(docs);
+        }
+      })
+      .catch(() => {});
+  }, [workflow, clone]);
+
+  // Auto-populate project default documents for new workflows
+  useEffect(() => {
+    if (workflow || !projectId) return; // Only for create mode with a project selected
+    fetch(`/api/projects/${projectId}/documents`)
+      .then((r) => r.json())
+      .then((docs: Array<Record<string, unknown>>) => {
+        if (Array.isArray(docs) && docs.length > 0) {
+          setSelectedDocIds(new Set(docs.map((d) => d.id as string)));
+          setSelectedDocs(
+            docs.map((d) => ({
+              id: d.id as string,
+              originalName: d.originalName as string,
+              mimeType: d.mimeType as string,
+              size: d.size as number,
+            }))
+          );
+        }
+      })
+      .catch(() => {});
+  }, [projectId, workflow]);
+
   // Pre-populate form for edit/clone
   useEffect(() => {
     if (!workflow) return;
@@ -723,6 +857,23 @@ export function WorkflowFormView({
       });
 
       if (res.ok) {
+        const data = await res.json().catch(() => null);
+        const workflowId = isEdit ? workflow.id : data?.id;
+
+        // Attach pool documents to the workflow via junction table
+        if (workflowId && selectedDocIds.size > 0) {
+          await fetch(`/api/workflows/${workflowId}/documents`, {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({
+              documentIds: [...selectedDocIds],
+            }),
+          }).catch(() => {
+            // Non-blocking — workflow was created, docs attachment is best-effort
+            console.warn("[workflow-form] Failed to attach pool documents");
+          });
+        }
+
         toast.success(
           mode === "edit"
             ? "Workflow updated"
@@ -734,9 +885,8 @@ export function WorkflowFormView({
         if (isEdit) {
           router.push(`/workflows/${workflow.id}`);
         } else {
-          const data = await res.json().catch(() => null);
-          if (data?.id) {
-            router.push(`/workflows/${data.id}`);
+          if (workflowId) {
+            router.push(`/workflows/${workflowId}`);
           } else {
             router.push("/workflows");
           }
@@ -963,15 +1113,20 @@ export function WorkflowFormView({
                 </div>
                 <div className="space-y-1.5">
                   <Label>Pattern</Label>
+                  {mode === "edit" ? (
+                    <div className="flex h-9 w-fit items-center gap-2 rounded-md border border-input bg-transparent px-3 py-2 text-sm opacity-50 cursor-not-allowed">
+                      {PATTERN_ICONS[pattern]}
+                      {PATTERN_LABELS[pattern] ?? pattern}
+                    </div>
+                  ) : (
                   <Select
                     value={pattern}
                     onValueChange={(value) =>
                       setPattern(value as WorkflowPattern)
                     }
-                    disabled={mode === "edit"}
                   >
                     <SelectTrigger>
-                      <SelectValue />
+                      <SelectValue placeholder="Select pattern" />
                     </SelectTrigger>
                     <SelectContent>
                       <SelectItem value="sequence">
@@ -1012,6 +1167,7 @@ export function WorkflowFormView({
                       </SelectItem>
                     </SelectContent>
                   </Select>
+                  )}
                   <p className="text-xs text-muted-foreground">How steps execute</p>
                 </div>
                 {projects.length > 0 && (
@@ -1041,6 +1197,74 @@ export function WorkflowFormView({
               </div>
             </FormSectionCard>
 
+            {/* Input Documents — Document Pool */}
+            {projectId && (
+              <FormSectionCard
+                icon={FileText}
+                title="Input Documents"
+                hint="Attach documents from the project pool as context for this workflow"
+              >
+                <div className="space-y-3">
+                  {selectedDocs.length > 0 && (
+                    <div className="flex flex-wrap gap-2">
+                      {selectedDocs.map((doc) => {
+                        const Icon = getFileIcon(doc.mimeType);
+                        return (
+                          <Badge
+                            key={doc.id}
+                            variant="secondary"
+                            className="flex items-center gap-1.5 pl-2 pr-1 py-1"
+                          >
+                            <Icon className="h-3 w-3" />
+                            <span className="text-xs max-w-[180px] truncate">
+                              {doc.originalName}
+                            </span>
+                            <span className="text-[10px] text-muted-foreground">
+                              {formatSize(doc.size)}
+                            </span>
+                            <button
+                              type="button"
+                              onClick={() => removeDocument(doc.id)}
+                              className="ml-0.5 rounded-full p-0.5 hover:bg-muted transition-colors"
+                              aria-label={`Remove ${doc.originalName}`}
+                            >
+                              <X className="h-3 w-3" />
+                            </button>
+                          </Badge>
+                        );
+                      })}
+                    </div>
+                  )}
+                  <Button
+                    type="button"
+                    variant="outline"
+                    size="sm"
+                    onClick={() => setPickerOpen(true)}
+                    className="gap-1.5"
+                  >
+                    <Plus className="h-3.5 w-3.5" />
+                    {selectedDocs.length > 0
+                      ? "Add More Documents"
+                      : "Attach Documents"}
+                  </Button>
+                  {selectedDocs.length > 0 && (
+                    <p className="text-xs text-muted-foreground">
+                      {selectedDocs.length} document{selectedDocs.length !== 1 ? "s" : ""} will be injected as context for all steps
+                    </p>
+                  )}
+                </div>
+
+                <DocumentPickerSheet
+                  open={pickerOpen}
+                  onOpenChange={setPickerOpen}
+                  projectId={projectId}
+                  selectedIds={selectedDocIds}
+                  onConfirm={handleDocPickerConfirm}
+                  groupBy="workflow"
+                />
+              </FormSectionCard>
+            )}
+
             {isLoop && (
               <FormSectionCard icon={RefreshCw} title="Loop Config">
                 <div className="space-y-4">

package/src/components/workflows/workflow-kanban-card.tsx

@@ -3,7 +3,7 @@
 import Link from "next/link";
 import { Card } from "@/components/ui/card";
 import { Badge } from "@/components/ui/badge";
-import { Workflow, Loader2 } from "lucide-react";
+import { Workflow, Loader2, FileText } from "lucide-react";
 import { workflowStatusVariant, patternLabels } from "@/lib/constants/status-colors";
 
 export interface WorkflowKanbanItem {
@@ -16,6 +16,7 @@ export interface WorkflowKanbanItem {
   projectName?: string;
   stepProgress: { current: number; total: number };
   currentStepName?: string;
+  outputDocCount?: number;
   createdAt: string;
   updatedAt?: string;
 }
@@ -112,6 +113,12 @@ export function WorkflowKanbanCard({ workflow }: WorkflowKanbanCardProps) {
           >
             {workflow.status}
           </Badge>
+          {workflow.outputDocCount != null && workflow.outputDocCount > 0 && (
+            <span className="text-[11px] text-muted-foreground flex items-center gap-0.5">
+              <FileText className="h-3 w-3" />
+              {workflow.outputDocCount}
+            </span>
+          )}
           <div className="flex-1" />
           <span className="text-[11px] text-muted-foreground opacity-0 group-hover:opacity-100 transition-opacity">
             View →

package/src/components/workflows/workflow-list.tsx

@@ -10,6 +10,7 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { ConfirmDialog } from "@/components/shared/confirm-dialog";
 import { EmptyState } from "@/components/shared/empty-state";
 import { GitBranch, Pencil, Copy, RotateCcw, Trash2, FileCog, Play } from "lucide-react";
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
 import { toast } from "sonner";
 import { workflowStatusVariant, patternLabels } from "@/lib/constants/status-colors";
 import { IconCircle, getWorkflowIconFromName } from "@/lib/constants/card-icons";
@@ -23,6 +24,9 @@ interface Workflow {
   definition: string;
   createdAt: string;
   updatedAt: string;
+  taskCount?: number;
+  outputDocCount?: number;
+  runNumber?: number;
 }
 
 interface WorkflowListProps {
@@ -175,6 +179,18 @@ export function WorkflowList({ projects }: WorkflowListProps) {
                     <span>{patternLabels[pattern] ?? pattern}</span>
                     <span>&middot;</span>
                     <span>{stepCount} step{stepCount !== 1 ? "s" : ""}</span>
+                    {wf.taskCount != null && wf.taskCount > 0 && (
+                      <>
+                        <span className="text-muted-foreground">&middot;</span>
+                        <span>{wf.taskCount} task{wf.taskCount !== 1 ? "s" : ""}</span>
+                      </>
+                    )}
+                    {wf.outputDocCount != null && wf.outputDocCount > 0 && (
+                      <>
+                        <span className="text-muted-foreground">&middot;</span>
+                        <span>{wf.outputDocCount} doc{wf.outputDocCount !== 1 ? "s" : ""}</span>
+                      </>
+                    )}
                   </div>
                   {promptPreview && (
                     <p className="text-xs text-muted-foreground line-clamp-2 mt-1.5">
@@ -182,53 +198,82 @@ export function WorkflowList({ projects }: WorkflowListProps) {
                     </p>
                   )}
                   <div className="flex items-center justify-between mt-3">
-                    <Badge variant={workflowStatusVariant[wf.status] ?? "secondary"}>
-                      {wf.status}
-                    </Badge>
-                    <div className="flex items-center gap-1">
-                      {wf.status === "draft" && (
-                        <Button
-                          variant="ghost"
-                          size="icon"
-                          className="h-7 w-7"
-                          aria-label="Edit workflow"
-                          onClick={(e) => { e.stopPropagation(); router.push(`/workflows/${wf.id}/edit`); }}
-                        >
-                          <Pencil className="h-3.5 w-3.5" />
-                        </Button>
-                      )}
-                      <Button
-                        variant="ghost"
-                        size="icon"
-                        className="h-7 w-7"
-                        aria-label="Clone workflow"
-                        onClick={(e) => { e.stopPropagation(); router.push(`/workflows/${wf.id}/edit?clone=true`); }}
-                      >
-                        <Copy className="h-3.5 w-3.5" />
-                      </Button>
-                      {(wf.status === "completed" || wf.status === "failed") && (
-                        <Button
-                          variant="ghost"
-                          size="icon"
-                          className="h-7 w-7"
-                          aria-label="Re-run workflow"
-                          onClick={(e) => { e.stopPropagation(); handleRerun(wf.id); }}
-                        >
-                          <RotateCcw className="h-3.5 w-3.5" />
-                        </Button>
-                      )}
-                      {wf.status !== "active" && (
-                        <Button
-                          variant="ghost"
-                          size="icon"
-                          className="h-7 w-7 text-destructive"
-                          aria-label="Delete workflow"
-                          onClick={(e) => { e.stopPropagation(); setConfirmDeleteId(wf.id); }}
-                        >
-                          <Trash2 className="h-3.5 w-3.5" />
-                        </Button>
+                    <div className="flex items-center gap-2">
+                      <Badge variant={workflowStatusVariant[wf.status] ?? "secondary"}>
+                        {wf.status}
+                      </Badge>
+                      {wf.runNumber != null && wf.runNumber > 0 && (
+                        <Badge variant="outline" className="text-[10px] font-normal">
+                          Run #{wf.runNumber}
+                        </Badge>
                       )}
                     </div>
+                    <TooltipProvider>
+                      <div className="flex items-center gap-1">
+                        {(wf.status === "draft" || wf.status === "completed" || wf.status === "failed") && (
+                          <Tooltip>
+                            <TooltipTrigger asChild>
+                              <Button
+                                variant="ghost"
+                                size="icon"
+                                className="h-7 w-7"
+                                aria-label="Edit workflow"
+                                onClick={(e) => { e.stopPropagation(); router.push(`/workflows/${wf.id}/edit`); }}
+                              >
+                                <Pencil className="h-3.5 w-3.5" />
+                              </Button>
+                            </TooltipTrigger>
+                            <TooltipContent>Edit</TooltipContent>
+                          </Tooltip>
+                        )}
+                        <Tooltip>
+                          <TooltipTrigger asChild>
+                            <Button
+                              variant="ghost"
+                              size="icon"
+                              className="h-7 w-7"
+                              aria-label="Clone workflow"
+                              onClick={(e) => { e.stopPropagation(); router.push(`/workflows/${wf.id}/edit?clone=true`); }}
+                            >
+                              <Copy className="h-3.5 w-3.5" />
+                            </Button>
+                          </TooltipTrigger>
+                          <TooltipContent>Clone</TooltipContent>
+                        </Tooltip>
+                        {(wf.status === "completed" || wf.status === "failed") && (
+                          <Tooltip>
+                            <TooltipTrigger asChild>
+                              <Button
+                                variant="ghost"
+                                size="icon"
+                                className="h-7 w-7"
+                                aria-label="Re-run workflow"
+                                onClick={(e) => { e.stopPropagation(); handleRerun(wf.id); }}
+                              >
+                                <RotateCcw className="h-3.5 w-3.5" />
+                              </Button>
+                            </TooltipTrigger>
+                            <TooltipContent>Re-run</TooltipContent>
+                          </Tooltip>
+                        )}
+                        {wf.status !== "active" && (
+                          <Tooltip>
+                            <TooltipTrigger asChild>
+                              <Button
+                                variant="ghost"
+                                size="icon"
+                                className="h-7 w-7 text-destructive"
+                                aria-label="Delete workflow"
+                                onClick={(e) => { e.stopPropagation(); setConfirmDeleteId(wf.id); }}
+                              >
+                                <Trash2 className="h-3.5 w-3.5" />
+                              </Button>
+                            </TooltipTrigger>
+                            <TooltipContent>Delete</TooltipContent>
+                          </Tooltip>
+                        )}
+                      </div>
+                    </TooltipProvider>
                   </div>
                 </CardContent>
               </Card>