@checkstack/automation-frontend 0.2.0 → 0.3.0

package/src/editor/action-helpers.ts

@@ -10,6 +10,7 @@ import type {
   StopInput,
   VariablesInput,
   WaitForTriggerInput,
+  WaitUntilInput,
 } from "@checkstack/automation-common";
 import type { LucideIconName } from "@checkstack/ui";
 
@@ -27,6 +28,7 @@ export type ActionKind =
   | "condition"
   | "stop"
   | "wait_for_trigger"
+  | "wait_until"
   | "sequence"
   | "delay";
 
@@ -39,6 +41,7 @@ export const ACTION_KINDS: ActionKind[] = [
   "condition",
   "stop",
   "wait_for_trigger",
+  "wait_until",
   "sequence",
   "delay",
 ];
@@ -103,6 +106,12 @@ export const ACTION_KIND_META: Record<ActionKind, ActionKindMeta> = {
     description: "Suspend until a matching trigger event arrives.",
     icon: "Hourglass",
   },
+  wait_until: {
+    kind: "wait_until",
+    label: "Wait until",
+    description: "Suspend until a condition becomes true, with optional timeout.",
+    icon: "TimerReset",
+  },
   sequence: {
     kind: "sequence",
     label: "Sequence",
@@ -132,6 +141,7 @@ export function actionKindOf(action: ActionInput): ActionKind {
   if ("condition" in action) return "condition";
   if ("stop" in action) return "stop";
   if ("wait_for_trigger" in action) return "wait_for_trigger";
+  if ("wait_until" in action) return "wait_until";
   if ("sequence" in action) return "sequence";
   return "delay";
 }
@@ -190,6 +200,15 @@ export function makeEmptyAction(kind: ActionKind): ActionInput {
         wait_for_trigger: { event: "" },
       } satisfies WaitForTriggerInput;
     }
+    case "wait_until": {
+      return {
+        ...BASE,
+        wait_until: {
+          condition: "",
+          continue_on_timeout: true,
+        },
+      } satisfies WaitUntilInput;
+    }
     case "sequence": {
       return {
         ...BASE,
@@ -344,6 +363,59 @@ export function assignDefaultIds(
   });
 }
 
+/**
+ * Produce a duplicate of `action` (and every nested child) with FRESH, unique,
+ * identifier-safe ids, deduped against `taken`. Unlike {@link assignDefaultIds}
+ * - which preserves existing ids and only fills blanks - this strips every id
+ * so a duplicated step never collides with its original. `taken` is mutated as
+ * ids are assigned, so callers can clone several actions against one set.
+ *
+ * Used by the per-card "Duplicate" command: clone the item, insert it directly
+ * after the original, and keep the editor's parallel `ids` array in sync.
+ */
+export function duplicateAction(
+  action: ActionInput,
+  taken: Set<string>,
+): ActionInput {
+  // Strip ids top-down, then run the standard default-id assignment so the
+  // clone (and its children) get brand-new unique ids rather than the
+  // originals'.
+  const stripIds = (input: ActionInput): ActionInput => {
+    const { id: _id, ...rest } = input;
+    const next = rest as ActionInput;
+    if ("choose" in next) {
+      return {
+        ...next,
+        choose: next.choose.map((branch) => ({
+          ...branch,
+          sequence: branch.sequence.map((child) => stripIds(child)),
+        })),
+        else: next.else
+          ? next.else.map((child) => stripIds(child))
+          : undefined,
+      };
+    }
+    if ("parallel" in next) {
+      return { ...next, parallel: next.parallel.map((child) => stripIds(child)) };
+    }
+    if ("repeat" in next) {
+      return {
+        ...next,
+        repeat: {
+          ...next.repeat,
+          sequence: next.repeat.sequence.map((child) => stripIds(child)),
+        },
+      };
+    }
+    if ("sequence" in next) {
+      return { ...next, sequence: next.sequence.map((child) => stripIds(child)) };
+    }
+    return next;
+  };
+  const [cloned] = assignDefaultIds([stripIds(action)], taken);
+  return cloned!;
+}
+
 /**
  * Display-name for an action card's header. For provider actions we
  * fall back to the namespaced id when the registry doesn't know the

package/src/editor/action-leaf-cards.tsx

@@ -27,11 +27,16 @@ import type {
   StopInput,
   VariablesInput,
   WaitForTriggerInput,
+  WaitUntilInput,
 } from "@checkstack/automation-common";
 import { useAutomationRegistry } from "./registry-context";
 import { ItemPicker } from "./ItemPicker";
 import { ConditionEditor } from "./ConditionEditor";
 import { useConnectionOptionResolvers } from "./useConnectionOptionResolvers";
+import { automationScriptTestRenderer } from "./ScriptTestRenderer";
+import { useScriptPackageTypeAcquisition } from "@checkstack/script-packages-frontend";
+import { useSecretNames } from "@checkstack/secrets-frontend";
+import { generateSecretEnvTypes, secretEnvEnvNames } from "../script-context";
 
 /**
  * Provider action body. Picks an action id from `listActions()` then
@@ -72,6 +77,17 @@ export const ProviderActionBody: React.FC<{
   shellEnvVars,
 }) => {
   const { actions, loading } = useAutomationRegistry();
+  // Lazy ATA: the editor fetches + registers the `.d.ts` of any npm package
+  // the script imports (incl. its `@types/*` companion), so
+  // `import { debounce } from "lodash"` autocompletes. Coexists with the
+  // scope-derived `context` ambient types already threaded down.
+  // `importablePackages` drives import-specifier name completion (the package
+  // name itself) before any module is registered.
+  const { acquireTypes, acquireResetKey, importablePackages } =
+    useScriptPackageTypeAcquisition();
+  // Secret names (never values) for the secret -> env mapping editor's
+  // ${{ secrets.* }} autocomplete.
+  const { secretNames } = useSecretNames();
   // The shell script action exposes a user-editable `env` field; surface
   // its keys as `$`-completions alongside the run-scope `$CHECKSTACK_*`
   // vars (memoised so the editor's completion provider isn't re-registered
@@ -87,6 +103,21 @@ export const ProviderActionBody: React.FC<{
   // this one. So the card just resolves the registry entry and renders its
   // config; there is no in-card action switcher.
   const selected = actions.find((action) => action.qualifiedId === value.action);
+  // Type the inline TS/JS editor's `process.env.<ENV_NAME>` from the action's
+  // own `secretEnv` mapping: the declared env-var keys (located by the
+  // `x-secret-env` schema annotation, never a hard-coded field name) become
+  // ambient `ProcessEnv` members so they autocomplete and are typed `string`.
+  // Merged onto the scope-derived `context` types; re-derived when the
+  // secretEnv keys change (or the action's schema does). Coexists with
+  // @types/node's existing index signature — this only adds known keys.
+  const mergedTypeDefinitions = React.useMemo(() => {
+    const envNames = secretEnvEnvNames({
+      configSchema: selected?.configSchema,
+      config: value.config,
+    });
+    const secretEnvLib = generateSecretEnvTypes({ envNames });
+    return [typeDefinitions, secretEnvLib].filter(Boolean).join("\n\n");
+  }, [typeDefinitions, selected?.configSchema, value.config]);
   // Connection-backed actions (Jira / Teams / Webex) declare a
   // `connectionProviderId`; the bridge turns their `x-options-resolver`
   // fields into a live connection picker + cascading provider dropdowns.
@@ -142,8 +173,13 @@ export const ProviderActionBody: React.FC<{
         optionsResolvers={optionsResolvers}
         templateProperties={templateProperties}
         templateCompletionProvider={completionProvider}
-        typeDefinitions={typeDefinitions}
+        typeDefinitions={mergedTypeDefinitions}
         shellEnvVars={mergedShellEnvVars}
+        scriptTestRenderer={automationScriptTestRenderer}
+        secretNames={secretNames}
+        acquireTypes={acquireTypes}
+        acquireResetKey={acquireResetKey}
+        importablePackages={importablePackages}
       />
     </div>
   );
@@ -424,3 +460,64 @@ export const ConditionGuardActionBody: React.FC<{
     />
   </div>
 );
+
+/**
+ * `wait_until` card — mirrors {@link WaitForTriggerActionBody} but waits on
+ * a CONDITION (re-checked on a poll interval) rather than an event. Reuses
+ * the expression-based {@link ConditionEditor}; the structured
+ * numeric/time/state condition branches arrive with the rest of the
+ * sensing-layer editor work.
+ */
+export const WaitUntilActionBody: React.FC<{
+  value: WaitUntilInput;
+  onChange: (next: WaitUntilInput) => void;
+  variableNodes: VariableNode[];
+  completionProvider: TemplateCompletionProvider;
+  disabled?: boolean;
+}> = ({ value, onChange, variableNodes, completionProvider, disabled }) => {
+  const wu = value.wait_until;
+  const patch = (next: Partial<WaitUntilInput["wait_until"]>) =>
+    onChange({ ...value, wait_until: { ...wu, ...next } });
+
+  return (
+    <div className="space-y-3">
+      <div className="space-y-1">
+        <Label className="text-xs">Wait until condition</Label>
+        <ConditionEditor
+          value={wu.condition}
+          onChange={(next: ConditionInput) => patch({ condition: next })}
+          variableNodes={variableNodes}
+          completionProvider={completionProvider}
+          bare
+        />
+      </div>
+      <div className="space-y-1">
+        <Label className="text-xs">Timeout (seconds)</Label>
+        <Input
+          type="number"
+          min={1}
+          value={wu.timeout_seconds ?? ""}
+          onChange={(event) =>
+            patch({
+              timeout_seconds: event.target.value
+                ? Number(event.target.value)
+                : undefined,
+            })
+          }
+          disabled={disabled}
+          placeholder="No timeout"
+        />
+      </div>
+      <div className="flex items-center justify-between">
+        <Label className="text-xs">
+          Continue on timeout (off = fail the run on timeout)
+        </Label>
+        <Toggle
+          checked={wu.continue_on_timeout ?? true}
+          onCheckedChange={(checked) => patch({ continue_on_timeout: checked })}
+          disabled={disabled}
+        />
+      </div>
+    </div>
+  );
+};

package/src/editor/condition-kind.test.ts

@@ -0,0 +1,126 @@
+import { describe, it, expect } from "bun:test";
+import {
+  ConditionSchema,
+  type ConditionInput,
+} from "@checkstack/automation-common";
+import {
+  CONDITION_KIND_META,
+  defaultForKind,
+  kindOf,
+  type ConditionKind,
+  type ConditionKindGroup,
+} from "./condition-kind";
+
+describe("defaultForKind", () => {
+  const structured: ConditionKind[] = ["numeric_state", "time", "state"];
+
+  // Every structured seed must classify back to its own kind so the
+  // editor's kind selector stays consistent after a switch.
+  for (const kind of structured) {
+    it(`kindOf round-trips its own ${kind} default`, () => {
+      expect(kindOf(defaultForKind(kind))).toBe(kind);
+    });
+  }
+
+  // The `time` seed is fully valid as-is (both bounds are real HH:mm).
+  it("seeds a schema-valid time condition", () => {
+    expect(ConditionSchema.safeParse(defaultForKind("time")).success).toBe(
+      true,
+    );
+  });
+
+  // numeric_state / state seed an empty required text field (value /
+  // entity) the operator fills in - like the bare `expr` empty string.
+  // Once filled, they round-trip through zod (the lossless contract).
+  it("numeric_state becomes schema-valid once `value` is filled", () => {
+    const seed = defaultForKind("numeric_state") as {
+      numeric_state: { value: string; above?: number };
+    };
+    expect(ConditionSchema.safeParse(seed).success).toBe(false);
+    seed.numeric_state.value = "health.system.p95_latency_ms";
+    expect(ConditionSchema.safeParse(seed).success).toBe(true);
+  });
+
+  it("state becomes schema-valid once `entity` is filled", () => {
+    const seed = defaultForKind("state") as {
+      state: { entity: string; status: string };
+    };
+    expect(ConditionSchema.safeParse(seed).success).toBe(false);
+    seed.state.entity = "payments-api";
+    expect(ConditionSchema.safeParse(seed).success).toBe(true);
+  });
+
+  it("combinator defaults discriminate correctly", () => {
+    expect(kindOf(defaultForKind("and"))).toBe("and");
+    expect(kindOf(defaultForKind("or"))).toBe("or");
+    expect(kindOf(defaultForKind("not"))).toBe("not");
+    expect(kindOf(defaultForKind("expr"))).toBe("expr");
+  });
+});
+
+describe("CONDITION_KIND_META", () => {
+  // The full kind union — the picker groups every one of these, so a missing
+  // entry would silently drop a condition type from the type picker.
+  const ALL_KINDS: ConditionKind[] = [
+    "expr",
+    "and",
+    "or",
+    "not",
+    "numeric_state",
+    "time",
+    "state",
+  ];
+  const VALID_GROUPS: ConditionKindGroup[] = [
+    "Structured",
+    "Logical",
+    "Advanced",
+  ];
+
+  it("has exactly one entry per ConditionKind (no missing/extra keys)", () => {
+    expect(Object.keys(CONDITION_KIND_META).toSorted()).toEqual(
+      [...ALL_KINDS].toSorted(),
+    );
+  });
+
+  // Every kind reachable from the editor's seed switch must have meta so the
+  // picker can render a row for it.
+  for (const kind of ALL_KINDS) {
+    it(`describes ${kind} with a non-empty label/description and valid group`, () => {
+      const meta = CONDITION_KIND_META[kind];
+      expect(meta.kind).toBe(kind);
+      expect(meta.label.length).toBeGreaterThan(0);
+      expect(meta.description.length).toBeGreaterThan(0);
+      expect(meta.icon.length).toBeGreaterThan(0);
+      expect(VALID_GROUPS).toContain(meta.group);
+    });
+  }
+
+  // defaultForKind is the editor's source of truth for which kinds exist;
+  // assert the meta map covers exactly the same set so they can never drift.
+  it("covers every kind defaultForKind can seed", () => {
+    for (const kind of ALL_KINDS) {
+      expect(defaultForKind(kind)).toBeDefined();
+      expect(CONDITION_KIND_META[kind]).toBeDefined();
+    }
+  });
+});
+
+describe("kindOf", () => {
+  it("classifies a raw expression string as expr", () => {
+    expect(kindOf("trigger.payload.x == 1")).toBe("expr");
+  });
+
+  it("classifies each structured variant", () => {
+    const cases: Array<[ConditionInput, ConditionKind]> = [
+      [{ numeric_state: { value: "v", above: 1 } }, "numeric_state"],
+      [{ time: { after: "09:00" } }, "time"],
+      [{ state: { entity: "s", status: "unhealthy" } }, "state"],
+      [{ and: ["a"] }, "and"],
+      [{ or: ["a"] }, "or"],
+      [{ not: "a" }, "not"],
+    ];
+    for (const [condition, expected] of cases) {
+      expect(kindOf(condition)).toBe(expected);
+    }
+  });
+});

package/src/editor/condition-kind.ts

@@ -0,0 +1,130 @@
+/**
+ * Pure helpers for the structured `ConditionEditor` - kept free of any
+ * React / `@checkstack/ui` imports so they can be unit-tested under bun
+ * (the UI barrel drags Monaco's vscode-only modules, which break bun's
+ * test runner).
+ */
+import type { ConditionInput } from "@checkstack/automation-common";
+import type { LucideIconName } from "@checkstack/ui";
+
+export type ConditionKind =
+  | "expr"
+  | "and"
+  | "or"
+  | "not"
+  | "numeric_state"
+  | "time"
+  | "state";
+
+/** Picker groups, mirroring the structured / logical / advanced split. */
+export type ConditionKindGroup = "Structured" | "Logical" | "Advanced";
+
+export interface ConditionKindMeta {
+  kind: ConditionKind;
+  label: string;
+  description: string;
+  icon: LucideIconName;
+  group: ConditionKindGroup;
+}
+
+/**
+ * The only "registry" conditions have: per-kind labels, descriptions, icons
+ * and picker groups. Single source of truth for the condition type picker
+ * (and the labels mirror the `ConditionEditor` kind selector). Every
+ * {@link ConditionKind} has exactly one entry.
+ */
+export const CONDITION_KIND_META: Record<ConditionKind, ConditionKindMeta> = {
+  numeric_state: {
+    kind: "numeric_state",
+    label: "numeric state",
+    description: "Compare a numeric value (path or template) to a threshold.",
+    icon: "Gauge",
+    group: "Structured",
+  },
+  time: {
+    kind: "time",
+    label: "time of day",
+    description: "Gate on a time window, weekdays and timezone.",
+    icon: "Clock",
+    group: "Structured",
+  },
+  state: {
+    kind: "state",
+    label: "system state",
+    description: "Require a system's status (with optional dwell).",
+    icon: "Activity",
+    group: "Structured",
+  },
+  and: {
+    kind: "and",
+    label: "and",
+    description: "All child conditions must hold.",
+    icon: "Ampersand",
+    group: "Logical",
+  },
+  or: {
+    kind: "or",
+    label: "or",
+    description: "At least one child condition must hold.",
+    icon: "GitBranch",
+    group: "Logical",
+  },
+  not: {
+    kind: "not",
+    label: "not",
+    description: "Negate a single child condition.",
+    icon: "Ban",
+    group: "Logical",
+  },
+  expr: {
+    kind: "expr",
+    label: "expression",
+    description: "Raw boolean expression — the escape hatch.",
+    icon: "Braces",
+    group: "Advanced",
+  },
+};
+
+/** Discriminate a condition into its editor kind. */
+export function kindOf(condition: ConditionInput): ConditionKind {
+  if (typeof condition === "string") return "expr";
+  if ("and" in condition) return "and";
+  if ("or" in condition) return "or";
+  if ("not" in condition) return "not";
+  if ("numeric_state" in condition) return "numeric_state";
+  if ("time" in condition) return "time";
+  return "state";
+}
+
+/**
+ * Seed value when the operator switches a condition to a given kind.
+ * Structured kinds seed schema-valid defaults so a freshly-added
+ * structured condition round-trips through zod / YAML without error;
+ * the bare `expr` / combinator seeds use empty strings the operator
+ * fills in (the editor surfaces a validation hint until then).
+ */
+export function defaultForKind(kind: ConditionKind): ConditionInput {
+  switch (kind) {
+    case "expr": {
+      return "";
+    }
+    case "and": {
+      return { and: [""] };
+    }
+    case "or": {
+      return { or: [""] };
+    }
+    case "not": {
+      return { not: "" };
+    }
+    case "numeric_state": {
+      return { numeric_state: { value: "", above: 0 } };
+    }
+    case "time": {
+      return { time: { after: "09:00", before: "17:00" } };
+    }
+    case "state": {
+      return { state: { entity: "", status: "unhealthy" } };
+    }
+  }
+}

package/src/editor/item-summary.test.ts

@@ -0,0 +1,171 @@
+import { describe, it, expect } from "bun:test";
+import type {
+  ActionInput,
+  ConditionInput,
+} from "@checkstack/automation-common";
+import {
+  summarizeAction,
+  summarizeCondition,
+  summarizeTrigger,
+} from "./item-summary";
+
+describe("summarizeTrigger", () => {
+  it("returns the event id when no advanced fields are set", () => {
+    expect(summarizeTrigger({ event: "incident.created" })).toBe(
+      "incident.created",
+    );
+  });
+
+  it("appends the filter and dwell hints", () => {
+    expect(
+      summarizeTrigger({
+        event: "incident.created",
+        filter: "{{ trigger.payload.sev == 'high' }}",
+        for: { minutes: 5 },
+      }),
+    ).toBe("incident.created · if {{ trigger.payload.sev == 'high' }} · with dwell");
+  });
+
+  it("appends the windowed-count rate hint", () => {
+    expect(
+      summarizeTrigger({
+        event: "healthcheck.check_failed",
+        window: { count: 3, minutes: 60, refire: "once" },
+      }),
+    ).toBe("healthcheck.check_failed · 3× / 60m");
+  });
+
+  it("includes the partition expression in the rate hint when set", () => {
+    expect(
+      summarizeTrigger({
+        event: "healthcheck.check_failed",
+        window: {
+          count: 3,
+          minutes: 60,
+          refire: "once",
+          partitionBy: "trigger.payload.severity",
+        },
+      }),
+    ).toBe("healthcheck.check_failed · 3× / 60m by trigger.payload.severity");
+  });
+
+  it("returns undefined for an event-less trigger", () => {
+    expect(summarizeTrigger({ event: "" })).toBeUndefined();
+  });
+});
+
+describe("summarizeAction", () => {
+  it("uses the local name for a provider action", () => {
+    const action: ActionInput = {
+      action: "integration-jira.create_issue",
+      config: {},
+      enabled: true,
+      continue_on_error: false,
+    };
+    expect(summarizeAction(action)).toBe("create_issue");
+  });
+
+  it("returns undefined for an unpicked provider action", () => {
+    const action: ActionInput = {
+      action: "",
+      config: {},
+      enabled: true,
+      continue_on_error: false,
+    };
+    expect(summarizeAction(action)).toBeUndefined();
+  });
+
+  it("summarizes a choose by branch count and else", () => {
+    const action: ActionInput = {
+      enabled: true,
+      continue_on_error: false,
+      choose: [
+        { when: "a", sequence: [] },
+        { when: "b", sequence: [] },
+      ],
+      else: [
+        {
+          action: "automation.log",
+          config: {},
+          enabled: true,
+          continue_on_error: false,
+        },
+      ],
+    };
+    expect(summarizeAction(action)).toBe("2 branches + else");
+  });
+
+  it("summarizes a single-branch choose without pluralizing", () => {
+    const action: ActionInput = {
+      enabled: true,
+      continue_on_error: false,
+      choose: [{ when: "a", sequence: [] }],
+    };
+    expect(summarizeAction(action)).toBe("1 branch");
+  });
+
+  it("summarizes a delay in seconds", () => {
+    const action: ActionInput = {
+      enabled: true,
+      continue_on_error: false,
+      delay: { seconds: 30 },
+    };
+    expect(summarizeAction(action)).toBe("delay 30s");
+  });
+
+  it("summarizes a repeat count", () => {
+    const action: ActionInput = {
+      enabled: true,
+      continue_on_error: false,
+      repeat: { count: 5, sequence: [] },
+    };
+    expect(summarizeAction(action)).toBe("count 5");
+  });
+
+  it("summarizes variables by name", () => {
+    const action: ActionInput = {
+      enabled: true,
+      continue_on_error: false,
+      variables: { foo: "1", bar: "2" },
+    };
+    expect(summarizeAction(action)).toBe("set foo, bar");
+  });
+});
+
+describe("summarizeCondition", () => {
+  it("returns the trimmed expression source", () => {
+    expect(summarizeCondition("  trigger.payload.x == 1  ")).toBe(
+      "trigger.payload.x == 1",
+    );
+  });
+
+  it("labels an empty expression", () => {
+    expect(summarizeCondition("")).toBe("empty expression");
+  });
+
+  it("summarizes combinators by child count", () => {
+    expect(summarizeCondition({ and: ["a", "b"] })).toBe("all of 2");
+    expect(summarizeCondition({ or: ["a"] })).toBe("any of 1");
+  });
+
+  it("summarizes a numeric_state with bounds", () => {
+    const condition: ConditionInput = {
+      numeric_state: { value: "health.p95", above: 100, below: 500 },
+    };
+    expect(summarizeCondition(condition)).toBe("health.p95 > 100 and < 500");
+  });
+
+  it("summarizes a system state condition", () => {
+    const condition: ConditionInput = {
+      state: { entity: "api", status: "unhealthy" },
+    };
+    expect(summarizeCondition(condition)).toBe("api is unhealthy");
+  });
+
+  it("clips very long expressions", () => {
+    const long = "x".repeat(200);
+    const out = summarizeCondition(long);
+    expect(out.length).toBeLessThanOrEqual(80);
+    expect(out.endsWith("…")).toBe(true);
+  });
+});