@stigmer/react 3.2.2 → 3.3.0

package/library/useImportResource.js

@@ -1,188 +0,0 @@
-"use client";
-import { useCallback, useMemo, useRef, useState } from "react";
-import { stringify as stringifyYaml } from "yaml";
-import { useStigmer } from "../hooks.js";
-import { toError } from "../internal/toError.js";
-import { parseResourceYaml } from "./parse-resource-yaml.js";
-// ---------------------------------------------------------------------------
-// Hook
-// ---------------------------------------------------------------------------
-/**
- * Headless import hook for Stigmer resources.
- *
- * Orchestrates the file import workflow:
- * 1. User selects a `.yaml`, `.yml`, or `.json` file
- * 2. `readFile` reads the content, detects the format, and validates
- *    the structure via `parseResourceYaml`
- * 3. On success, `preview` is populated with kind, name, slug, format
- * 4. On validation error, `error` is populated with a user-facing message
- * 5. User confirms → `apply(org)` calls the appropriate SDK `apply()` method
- *
- * Follows the established mutation-hook pattern: `isApplying` + `error` +
- * `reset`. The `preview` state enables a confirmation step before committing
- * (Nielsen heuristic #3: user control, #5: error prevention).
- *
- * @example
- * ```tsx
- * const { readFile, preview, error, reset, apply, isApplying } = useImportResource();
- *
- * const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
- *   const file = e.target.files?.[0];
- *   if (file) readFile(file);
- * };
- *
- * if (preview) {
- *   return (
- *     <div>
- *       <p>Import {preview.kind}: {preview.name}</p>
- *       <button onClick={() => apply(org)} disabled={isApplying}>
- *         Confirm
- *       </button>
- *     </div>
- *   );
- * }
- * ```
- *
- * @see {@link parseResourceYaml} for the validation logic
- * @see {@link ImportResourceDialog} for the styled component that composes this hook
- */
-export function useImportResource() {
-    const stigmer = useStigmer();
-    const [preview, setPreview] = useState(null);
-    const [error, setError] = useState(null);
-    const [isApplying, setIsApplying] = useState(false);
-    const contentRef = useRef(null);
-    const parsedRef = useRef(null);
-    const reset = useCallback(() => {
-        setPreview(null);
-        setError(null);
-        setIsApplying(false);
-        contentRef.current = null;
-        parsedRef.current = null;
-    }, []);
-    const readFile = useCallback(async (file) => {
-        setPreview(null);
-        setError(null);
-        contentRef.current = null;
-        parsedRef.current = null;
-        let text;
-        try {
-            text = await file.text();
-        }
-        catch {
-            setError("Failed to read the selected file.");
-            return;
-        }
-        if (!text.trim()) {
-            setError("The selected file is empty.");
-            return;
-        }
-        const format = detectFormat(file.name, text);
-        // For JSON files, convert to YAML-parseable content first.
-        // parseResourceYaml expects YAML, but since YAML is a superset of JSON,
-        // we can pass JSON directly. However for cleaner error messages, we
-        // normalize JSON → plain object → YAML string if needed.
-        let yamlContent;
-        if (format === "json") {
-            try {
-                const parsed = JSON.parse(text);
-                if (typeof parsed !== "object" || parsed === null || Array.isArray(parsed)) {
-                    setError("JSON file must contain a single object (not an array or primitive).");
-                    return;
-                }
-                yamlContent = stringifyYaml(parsed);
-            }
-            catch {
-                setError("The file does not contain valid JSON.");
-                return;
-            }
-        }
-        else {
-            yamlContent = text;
-        }
-        // Validate structure using the existing parser. We use a dummy org
-        // here — the real org is provided at apply time.
-        let parsed;
-        try {
-            parsed = parseResourceYaml(yamlContent, "__preview__");
-        }
-        catch (err) {
-            setError(err instanceof Error ? err.message : "Failed to validate resource file.");
-            return;
-        }
-        contentRef.current = yamlContent;
-        parsedRef.current = parsed;
-        setPreview({
-            kind: parsed.kind,
-            name: parsed.input.name,
-            slug: "slug" in parsed.input ? parsed.input.slug : undefined,
-            format,
-            rawContent: text,
-        });
-    }, []);
-    const apply = useCallback(async (org) => {
-        const content = contentRef.current;
-        if (!content) {
-            throw new Error("No file has been validated. Call readFile first.");
-        }
-        setIsApplying(true);
-        setError(null);
-        try {
-            const parsed = parseResourceYaml(content, org);
-            switch (parsed.kind) {
-                case "Agent": {
-                    const agent = await stigmer.agent.apply(parsed.input);
-                    return {
-                        kind: "Agent",
-                        name: agent.metadata?.name ?? parsed.input.name,
-                        org: agent.metadata?.org ?? org,
-                        slug: agent.metadata?.slug ?? parsed.input.name,
-                    };
-                }
-                case "McpServer": {
-                    const mcpServer = await stigmer.mcpServer.apply(parsed.input);
-                    return {
-                        kind: "McpServer",
-                        name: mcpServer.metadata?.name ?? parsed.input.name,
-                        org: mcpServer.metadata?.org ?? org,
-                        slug: mcpServer.metadata?.slug ?? parsed.input.name,
-                    };
-                }
-            }
-        }
-        catch (err) {
-            const message = toError(err).message;
-            setError(message);
-            throw err;
-        }
-        finally {
-            setIsApplying(false);
-        }
-    }, [stigmer]);
-    return useMemo(() => ({ readFile, preview, error, reset, apply, isApplying }), [readFile, preview, error, reset, apply, isApplying]);
-}
-// ---------------------------------------------------------------------------
-// Format detection
-// ---------------------------------------------------------------------------
-const JSON_EXTENSIONS = new Set([".json"]);
-const YAML_EXTENSIONS = new Set([".yaml", ".yml"]);
-function detectFormat(filename, content) {
-    const lowerName = filename.toLowerCase();
-    const dotIndex = lowerName.lastIndexOf(".");
-    if (dotIndex >= 0) {
-        const ext = lowerName.slice(dotIndex);
-        if (JSON_EXTENSIONS.has(ext))
-            return "json";
-        if (YAML_EXTENSIONS.has(ext))
-            return "yaml";
-    }
-    // Fallback: try parsing as JSON. If it parses, treat as JSON.
-    try {
-        JSON.parse(content);
-        return "json";
-    }
-    catch {
-        return "yaml";
-    }
-}
-//# sourceMappingURL=useImportResource.js.map

package/library/useImportResource.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useImportResource.js","sourceRoot":"","sources":["../../src/library/useImportResource.ts"],"names":[],"mappings":"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"}

package/src/execution/__tests__/agent-execution-document.test.ts

@@ -1,45 +0,0 @@
-import { describe, it, expect } from "vitest";
-import {
-  AGENT_EXECUTION_DOCUMENT_ENTRY_ID,
-  agentExecutionTabPath,
-  parseAgentExecutionTabPath,
-} from "../agent-execution-document";
-import { ARTIFACT_DOCUMENT_ENTRY_ID } from "../artifact-document";
-import { FILE_CHANGE_DOCUMENT_ENTRY_ID } from "../file-change-document";
-
-describe("agent-execution-document identity", () => {
-  it("has a distinct family id from the other virtual-document families", () => {
-    expect(AGENT_EXECUTION_DOCUMENT_ENTRY_ID).not.toBe(ARTIFACT_DOCUMENT_ENTRY_ID);
-    expect(AGENT_EXECUTION_DOCUMENT_ENTRY_ID).not.toBe(FILE_CHANGE_DOCUMENT_ENTRY_ID);
-    // NUL-namespaced so it can never alias a real workspace entry id.
-    expect(AGENT_EXECUTION_DOCUMENT_ENTRY_ID.startsWith("\u0000")).toBe(true);
-  });
-
-  it("labels the tab with the task name (path basename)", () => {
-    const path = agentExecutionTabPath("aex_abc123", "summarize-report");
-    expect(path).toBe("aex_abc123/summarize-report");
-    expect(path.split("/").pop()).toBe("summarize-report");
-  });
-
-  it("round-trips the child execution id", () => {
-    const path = agentExecutionTabPath("aex_abc123", "summarize-report");
-    expect(parseAgentExecutionTabPath(path)).toBe("aex_abc123");
-  });
-
-  it("round-trips the id when the task name itself contains a separator", () => {
-    const path = agentExecutionTabPath("aex_abc123", "stage/publish");
-    expect(parseAgentExecutionTabPath(path)).toBe("aex_abc123");
-  });
-
-  it("keeps two calls to the same agent distinct (per-child identity)", () => {
-    const first = agentExecutionTabPath("aex_1", "call-agent");
-    const second = agentExecutionTabPath("aex_2", "call-agent");
-    expect(first).not.toBe(second);
-    expect(parseAgentExecutionTabPath(first)).toBe("aex_1");
-    expect(parseAgentExecutionTabPath(second)).toBe("aex_2");
-  });
-
-  it("degrades to the whole path when no separator is present", () => {
-    expect(parseAgentExecutionTabPath("aex_bare")).toBe("aex_bare");
-  });
-});

package/src/execution/agent-execution-document.ts

@@ -1,54 +0,0 @@
-// Identity of agent-execution transcript tabs in the workspace surface's
-// editor group. Domain: execution (the transcript renderer and the
-// AgentExecution data model are execution-domain; the workflow panel is the
-// first host, and a future session-side consumer — e.g. sub-agent expansion —
-// would share this identity rather than minting a divergent one).
-//
-// Kept in its own module (not in a component file) so behavior-only
-// consumers — the panel controller opens the tabs, the viewer routes them —
-// depend on the identity without pulling the transcript renderer into their
-// module graph (DD-003 headless-first). Mirrors artifact-document.ts and
-// file-change-document.ts.
-
-import { virtualEntryId } from "../internal/store/index.js";
-
-/**
- * Virtual entry id of the agent-execution transcript document FAMILY. Like
- * artifacts and file changes (and unlike the session's single plan tab),
- * transcripts are many: every opened child AgentExecution shares this one
- * entry id and is distinguished by its id-derived tab path, so
- * `editorKey(AGENT_EXECUTION_DOCUMENT_ENTRY_ID, path)` yields one tab per
- * child execution — the VS Code "each file is a tab" model. The
- * NUL-namespaced virtual id can never alias a real workspace entry, and its
- * distinct `"agentexec"` kind can never collide with the
- * `"artifact"`/`"filechange"`/`"plan"` families.
- */
-export const AGENT_EXECUTION_DOCUMENT_ENTRY_ID = virtualEntryId("agentexec");
-
-/**
- * The identity of a child AgentExecution's transcript tab within the family.
- *
- * The path deliberately CARRIES the child execution id (unlike artifact tabs,
- * which need an owner-level record map to resolve content): a transcript
- * needs only the id to fetch/stream itself, so the viewer parses it straight
- * back out with {@link parseAgentExecutionTabPath} — no lookup map to keep in
- * sync. The suffix is the AGENT_CALL task name because the editor tab's LABEL
- * is the path's basename: the task name correlates the tab with the DAG node
- * the user opened it from, and keeps two calls to the same agent distinct.
- */
-export function agentExecutionTabPath(
-  childExecutionId: string,
-  taskName: string,
-): string {
-  return `${childExecutionId}/${taskName}`;
-}
-
-/**
- * Recovers the child execution id from a transcript tab's path — the inverse
- * of {@link agentExecutionTabPath}. Splits on the FIRST separator: execution
- * ids never contain `/`, so a task name that does still round-trips.
- */
-export function parseAgentExecutionTabPath(path: string): string {
-  const separator = path.indexOf("/");
-  return separator === -1 ? path : path.slice(0, separator);
-}

package/src/library/ImportResourceDialog.tsx

@@ -1,227 +0,0 @@
-"use client";
-
-import { useCallback, useEffect, useRef } from "react";
-import { cn } from "@stigmer/theme";
-import { toast } from "../feedback/toast.js";
-import { useImportResource } from "./useImportResource.js";
-import type { ApplyResourceResult } from "./useApplyResource.js";
-
-// ---------------------------------------------------------------------------
-// Props
-// ---------------------------------------------------------------------------
-
-/** Props for {@link ImportResourceDialog}. */
-export interface ImportResourceDialogProps {
-  /** Whether the dialog is open. */
-  readonly open: boolean;
-  /** Called when the dialog should open or close. */
-  readonly onOpenChange: (open: boolean) => void;
-  /** Target organization slug to apply the imported resource to. */
-  readonly org: string;
-  /** Called after a successful import. Use for navigation or list refresh. */
-  readonly onSuccess?: (result: ApplyResourceResult) => void;
-}
-
-// ---------------------------------------------------------------------------
-// Component
-// ---------------------------------------------------------------------------
-
-/**
- * Modal dialog for importing a Stigmer resource from a YAML or JSON file.
- *
- * Workflow:
- * 1. User selects a `.yaml`, `.yml`, or `.json` file via the file picker
- * 2. The file is validated and a preview card shows the detected resource
- * 3. User confirms the import, which calls `apply()` on the target org
- * 4. On success: toast notification and `onSuccess` callback
- * 5. On error: inline error message with guidance
- *
- * Uses the native `<dialog>` element for built-in focus trapping, Escape
- * key handling, and backdrop — consistent with {@link ConfirmDialog}.
- *
- * Zero Console dependencies — safe for platform builder embedding.
- *
- * @example
- * ```tsx
- * const [open, setOpen] = useState(false);
- *
- * <ImportResourceDialog
- *   open={open}
- *   onOpenChange={setOpen}
- *   org={activeOrg}
- *   onSuccess={(result) => {
- *     router.push(`/library/${result.kind === "Agent" ? "agents" : "mcp-servers"}`);
- *   }}
- * />
- * ```
- */
-export function ImportResourceDialog({
-  open,
-  onOpenChange,
-  org,
-  onSuccess,
-}: ImportResourceDialogProps) {
-  const dialogRef = useRef<HTMLDialogElement>(null);
-  const fileInputRef = useRef<HTMLInputElement>(null);
-  const { readFile, preview, error, reset, apply, isApplying } = useImportResource();
-
-  // Sync dialog open state with the native <dialog> element.
-  useEffect(() => {
-    const dialog = dialogRef.current;
-    if (!dialog) return;
-    if (open && !dialog.open) {
-      dialog.showModal();
-    } else if (!open && dialog.open) {
-      dialog.close();
-    }
-  }, [open]);
-
-  // Reset state when the dialog opens.
-  useEffect(() => {
-    if (open) {
-      reset();
-      if (fileInputRef.current) {
-        fileInputRef.current.value = "";
-      }
-    }
-  }, [open, reset]);
-
-  const handleCancel = useCallback(
-    (e: React.SyntheticEvent) => {
-      e.preventDefault();
-      onOpenChange(false);
-    },
-    [onOpenChange],
-  );
-
-  const handleClose = useCallback(() => {
-    onOpenChange(false);
-  }, [onOpenChange]);
-
-  const handleFileChange = useCallback(
-    (e: React.ChangeEvent<HTMLInputElement>) => {
-      const file = e.target.files?.[0];
-      if (file) {
-        readFile(file);
-      }
-    },
-    [readFile],
-  );
-
-  const handleConfirm = useCallback(async () => {
-    try {
-      const result = await apply(org);
-      toast.success(`${result.kind === "Agent" ? "Agent" : "MCP Server"} "${result.name}" imported successfully`);
-      onOpenChange(false);
-      onSuccess?.(result);
-    } catch {
-      // error is set by the hook
-    }
-  }, [apply, org, onOpenChange, onSuccess]);
-
-  return (
-    <dialog
-      ref={dialogRef}
-      onCancel={handleCancel}
-      className={cn(
-        "fixed inset-0 z-50 m-auto w-full max-w-md rounded-lg border border-border bg-popover p-0 text-popover-foreground shadow-lg",
-        "backdrop:bg-black/50",
-        "open:animate-in open:fade-in-0 open:zoom-in-95",
-      )}
-    >
-      <div className="flex flex-col gap-5 p-6">
-        {/* Header */}
-        <div className="flex flex-col gap-1">
-          <h3 className="text-base font-semibold text-foreground">
-            Import resource
-          </h3>
-          <p className="text-sm text-muted-foreground">
-            Select a YAML or JSON file containing a Stigmer Agent or MCP Server definition.
-          </p>
-        </div>
-
-        {/* File picker */}
-        <div>
-          <input
-            ref={fileInputRef}
-            type="file"
-            accept=".yaml,.yml,.json"
-            onChange={handleFileChange}
-            className={cn(
-              "w-full rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground",
-              "file:mr-3 file:rounded-md file:border-0 file:bg-primary file:px-2.5 file:py-1 file:text-xs file:font-medium file:text-primary-foreground",
-              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-            )}
-            aria-label="Select resource file"
-          />
-        </div>
-
-        {/* Validation error */}
-        {error && (
-          <div
-            role="alert"
-            className="rounded-md border border-destructive bg-card px-3 py-2.5 text-sm text-destructive"
-          >
-            {error}
-          </div>
-        )}
-
-        {/* Preview card */}
-        {preview && !error && (
-          <div className="rounded-md border border-border bg-card px-4 py-3">
-            <div className="flex items-center gap-2">
-              <span className="inline-flex rounded bg-muted px-1.5 py-0.5 text-xs font-medium text-muted-foreground">
-                {preview.kind === "Agent" ? "Agent" : "MCP Server"}
-              </span>
-              <span className="inline-flex rounded bg-muted px-1.5 py-0.5 text-xs text-muted-foreground uppercase">
-                {preview.format}
-              </span>
-            </div>
-            <p className="mt-1.5 text-sm font-medium text-foreground">
-              {preview.name}
-            </p>
-            {preview.slug && preview.slug !== preview.name && (
-              <p className="mt-0.5 text-xs text-muted-foreground">
-                {preview.slug}
-              </p>
-            )}
-            <p className="mt-1.5 text-xs text-muted-foreground">
-              Will be applied to <span className="font-medium text-foreground">{org}</span>
-            </p>
-          </div>
-        )}
-
-        {/* Actions */}
-        <div className="flex justify-end gap-2">
-          <button
-            type="button"
-            onClick={handleClose}
-            disabled={isApplying}
-            className={cn(
-              "rounded-md px-3 py-1.5 text-sm font-medium transition-colors",
-              "border border-input bg-background text-foreground",
-              "hover:bg-accent hover:text-accent-foreground",
-              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-              "disabled:pointer-events-none disabled:opacity-50",
-            )}
-          >
-            Cancel
-          </button>
-          <button
-            type="button"
-            onClick={handleConfirm}
-            disabled={!preview || !!error || isApplying}
-            className={cn(
-              "rounded-md px-3 py-1.5 text-sm font-medium transition-colors",
-              "bg-primary text-primary-foreground hover:bg-primary-hover",
-              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
-              "disabled:pointer-events-none disabled:opacity-50",
-            )}
-          >
-            {isApplying ? "Importing\u2026" : "Import"}
-          </button>
-        </div>
-      </div>
-    </dialog>
-  );
-}