feat: make the right sidebar edit the tasks

Signed-off-by: Simon Emms <simon@simonemms.com>

Author: mrsimonemms

CLAUDE.md

@@ -417,18 +417,26 @@ Key expectations:
 
 Claude should not introduce formatting changes that contradict Prettier output.
 
-**IMPORTANT: Before completing any work, always run `npm run format` and
-`npm run lint` to ensure all files are properly formatted. This is mandatory.**
+**IMPORTANT: Before completing any work, always run the following commands in
+order and ensure they all pass. This is mandatory.**
+
+```sh
+npm run format          # auto-formats all files
+npm run lint            # Prettier check + ESLint + markdownlint
+npm run check           # svelte-check TypeScript type checking
+npm run dev             # verify the app starts without errors
+pre-commit run --all-files  # full pre-commit suite (license, YAML, markdown, ESLint, format)
+```
 
 The `npm run lint` command includes:
 
 - Prettier code formatting check
 - ESLint for JavaScript/TypeScript code
 - Markdown linting (markdownlint-cli2) for all .md files
 
-**IMPORTANT: After fixing format and lint issues, run `npm run dev` to verify
-the application starts without errors. Fix any runtime errors before considering
-the work complete. This is mandatory.**
+The `npm run check` command runs `svelte-kit sync && svelte-check` and must
+report 0 errors before work is considered complete. Fix type errors in source
+and test files; do not suppress them.
 
 ---
 
@@ -439,8 +447,9 @@ the work complete. This is mandatory.**
 - `no-undef` is intentionally disabled
 - Svelte files are type-checked via `typescript-eslint`
 
-**IMPORTANT: Before completing any work, always run `npm run lint` to ensure
-all code passes linting. This is mandatory.**
+**IMPORTANT: Before completing any work, always run `npm run lint` and
+`npm run check` to ensure all code passes linting and type checking. This is
+mandatory.**
 
 Do not:
 

src/lib/i18n/messages/en.json

@@ -27,6 +27,8 @@
   },
   "inspector": {
     "empty": "Select a node to inspect it.",
+    "name": "Name",
+    "nodeId": "Node ID",
     "id": "ID",
     "kind": "Kind",
     "detail": "Detail",
@@ -45,7 +47,108 @@
     "moveUpLabel": "Move task up",
     "moveDown": "↓ Move down",
     "moveDownLabel": "Move task down",
-    "delete": "Delete task"
+    "delete": "Delete task",
+    "set": {
+      "title": "Assignments",
+      "addRow": "+ Add assignment",
+      "keyLabel": "Key",
+      "valueLabel": "Value",
+      "removeRow": "Remove",
+      "overrideLabel": "Type for {{key}}",
+      "overrideAuto": "Auto",
+      "overrideString": "String",
+      "overrideNumber": "Number",
+      "overrideBoolean": "Boolean",
+      "overrideNull": "Null",
+      "errorObjectArray": "Objects and arrays are not supported",
+      "errorNotNumber": "Must be a valid number",
+      "errorNotBoolean": "Must be true or false"
+    },
+    "wait": {
+      "title": "Duration",
+      "seconds": "Seconds",
+      "minutes": "Minutes",
+      "hours": "Hours",
+      "days": "Days"
+    },
+    "fork": {
+      "compete": "Compete mode",
+      "competeHint": "First branch to finish wins"
+    },
+    "loop": {
+      "title": "Loop configuration",
+      "in": "Collection",
+      "each": "Item variable",
+      "at": "Index variable",
+      "while": "Break condition"
+    },
+    "callGrpc": {
+      "title": "Call gRPC",
+      "proto": {
+        "title": "Proto",
+        "endpoint": "Endpoint"
+      },
+      "service": {
+        "title": "Service",
+        "name": "Service name",
+        "host": "Host",
+        "hostPlaceholder": "localhost",
+        "port": "Port",
+        "portPlaceholder": "50051",
+        "portInvalid": "Port must be a positive integer"
+      },
+      "method": "Method",
+      "arguments": {
+        "title": "Arguments",
+        "addRow": "+ Add argument",
+        "keyLabel": "Name",
+        "valueLabel": "Value",
+        "removeRow": "Remove argument"
+      }
+    },
+    "callHttp": {
+      "title": "Call HTTP",
+      "method": "Method",
+      "endpoint": "URL",
+      "endpointRequired": "URL is required",
+      "headers": {
+        "title": "Headers",
+        "addRow": "+ Add header",
+        "keyLabel": "Header name",
+        "valueLabel": "Value",
+        "removeRow": "Remove header"
+      },
+      "body": {
+        "title": "Body",
+        "addBody": "+ Add body",
+        "removeBody": "Remove body"
+      }
+    },
+    "common": {
+      "title": "Common",
+      "if": {
+        "label": "Condition (if)"
+      },
+      "metadata": {
+        "title": "Metadata",
+        "addRow": "+ Add entry",
+        "keyLabel": "Key",
+        "valueLabel": "Value",
+        "removeRow": "Remove",
+        "overrideLabel": "Type for {{key}}",
+        "type": {
+          "auto": "Auto",
+          "string": "String",
+          "number": "Number",
+          "boolean": "Boolean",
+          "null": "Null"
+        }
+      }
+    }
+  },
+  "errors": {
+    "duplicateKey": "Duplicate key",
+    "invalidNumber": "Must be a valid number"
   },
   "sidebar": {
     "document": "Document",

src/lib/tasks/actions.ts

@@ -45,6 +45,7 @@ import type {
   WaitConfig,
   WorkflowFile,
 } from './model';
+import { ZIGFLOW_ID_KEY } from './model';
 import { TASK_REGISTRY } from './registry';
 
 // ---------------------------------------------------------------------------
@@ -182,13 +183,13 @@ export function createTaskNode(name: string, config: TaskConfig): TaskNode {
     type: 'task',
     name,
     config,
-    metadata: { __zigflow_id: zid },
+    metadata: { [ZIGFLOW_ID_KEY]: zid },
   };
 }
 
 export function createSetNode(
   name: string,
-  assignments: Record<string, string>,
+  assignments: SetConfig['assignments'],
 ): TaskNode {
   const config: SetConfig = { kind: 'set', assignments };
   return createTaskNode(name, config);
@@ -275,7 +276,7 @@ export function createSwitchNode(name: string): SwitchNode {
     type: 'switch',
     name,
     branches: [],
-    metadata: { __zigflow_id: zid },
+    metadata: { [ZIGFLOW_ID_KEY]: zid },
   };
 }
 
@@ -290,7 +291,7 @@ export function addSwitchBranch(
     label,
     condition,
     graph: emptyFlowGraph(),
-    metadata: { __zigflow_id: zid },
+    metadata: { [ZIGFLOW_ID_KEY]: zid },
   };
   return { ...node, branches: [...node.branches, branch] };
 }
@@ -343,7 +344,7 @@ export function createForkNode(name: string): ForkNode {
     name,
     compete: false,
     branches: [],
-    metadata: { __zigflow_id: zid },
+    metadata: { [ZIGFLOW_ID_KEY]: zid },
   };
 }
 
@@ -353,7 +354,7 @@ export function addForkBranch(node: ForkNode, label: string): ForkNode {
     id: zid,
     label,
     graph: emptyFlowGraph(),
-    metadata: { __zigflow_id: zid },
+    metadata: { [ZIGFLOW_ID_KEY]: zid },
   };
   return { ...node, branches: [...node.branches, branch] };
 }
@@ -402,7 +403,7 @@ export function createTryNode(name: string): TryNode {
     type: 'try',
     name,
     tryGraph: emptyFlowGraph(),
-    metadata: { __zigflow_id: zid },
+    metadata: { [ZIGFLOW_ID_KEY]: zid },
   };
 }
 
@@ -426,7 +427,7 @@ export function createLoopNode(name: string, inExpr: string): LoopNode {
     name,
     in: inExpr,
     bodyGraph: emptyFlowGraph(),
-    metadata: { __zigflow_id: zid },
+    metadata: { [ZIGFLOW_ID_KEY]: zid },
   };
 }
 

src/lib/tasks/model.ts

@@ -20,6 +20,13 @@
 // representation (IR). It must remain free of UI dependencies and serialisable
 // to JSON at all times.
 
+// ---------------------------------------------------------------------------
+// Internal metadata key — used to persist stable node/branch IDs across
+// round-trips through the Zigflow DSL YAML format.
+// ---------------------------------------------------------------------------
+
+export const ZIGFLOW_ID_KEY = '__zigflow_id';
+
 // ---------------------------------------------------------------------------
 // Document & file
 // ---------------------------------------------------------------------------
@@ -160,9 +167,14 @@ export type LoopNode = {
 // Each config carries a `kind` discriminant for exhaustive switching.
 // ---------------------------------------------------------------------------
 
+// Assignment values support JSON primitives. Objects and arrays are
+// intentionally excluded from the Studio editor (they remain valid in
+// the IR for round-trip purposes but cannot be created via the UI).
+export type AssignmentValue = string | number | boolean | null;
+
 export type SetConfig = {
   kind: 'set';
-  assignments: Record<string, string>;
+  assignments: Record<string, AssignmentValue>;
 };
 
 export type CallHTTPConfig = {

src/lib/tasks/parse.ts

@@ -64,6 +64,7 @@ import type {
   WaitConfig,
   WorkflowFile,
 } from './model';
+import { ZIGFLOW_ID_KEY } from './model';
 
 // ---------------------------------------------------------------------------
 // Public types
@@ -339,13 +340,13 @@ function resolveId(
   ctx: ParseCtx,
 ): { id: string; metadata: Record<string, unknown> } {
   const metadata = (def['metadata'] ?? {}) as Record<string, unknown>;
-  const existing = metadata['__zigflow_id'];
+  const existing = metadata[ZIGFLOW_ID_KEY];
   if (typeof existing === 'string' && existing.length > 0) {
     return { id: existing, metadata };
   }
   const id = crypto.randomUUID();
   ctx.modified = true;
-  return { id, metadata: { ...metadata, __zigflow_id: id } };
+  return { id, metadata: { ...metadata, [ZIGFLOW_ID_KEY]: id } };
 }
 
 // ---------------------------------------------------------------------------
@@ -412,7 +413,11 @@ function parseTaskConfig(
 function buildSetConfig(def: RawEntry): SetConfig {
   return {
     kind: 'set',
-    assignments: (def['set'] ?? {}) as Record<string, string>,
+    // js-yaml parses YAML scalars to their native JS types (boolean, number,
+    // null, string). The cast here is intentionally permissive; invalid
+    // complex types (objects/arrays) are blocked by the Studio editor, not
+    // the parser, to allow round-trip fidelity for manually authored files.
+    assignments: (def['set'] ?? {}) as SetConfig['assignments'],
   };
 }
 

src/lib/tasks/registry.ts

@@ -28,6 +28,7 @@ import type {
   TaskNode,
   TryNode,
 } from './model';
+import { ZIGFLOW_ID_KEY } from './model';
 
 // ---------------------------------------------------------------------------
 // Types
@@ -62,7 +63,7 @@ function taskNode(name: string, type: NodeType): TaskNode {
     type: 'task',
     name,
     config: defaultConfig(type),
-    metadata: { __zigflow_id: nid },
+    metadata: { [ZIGFLOW_ID_KEY]: nid },
   } as TaskNode;
 }
 
@@ -78,7 +79,7 @@ function defaultConfig(type: NodeType): TaskNode['config'] {
         protoEndpoint: '',
         serviceName: '',
         serviceHost: '',
-        servicePort: 443,
+        servicePort: 50051,
         method: '',
       };
     case 'call-activity':
@@ -205,7 +206,7 @@ export const TASK_REGISTRY: readonly TaskDefinition[] = [
         type: 'switch',
         name: 'switch',
         branches: [],
-        metadata: { __zigflow_id: nid },
+        metadata: { [ZIGFLOW_ID_KEY]: nid },
       };
     },
   },
@@ -222,7 +223,7 @@ export const TASK_REGISTRY: readonly TaskDefinition[] = [
         name: 'fork',
         compete: false,
         branches: [],
-        metadata: { __zigflow_id: nid },
+        metadata: { [ZIGFLOW_ID_KEY]: nid },
       };
     },
   },
@@ -238,7 +239,7 @@ export const TASK_REGISTRY: readonly TaskDefinition[] = [
         type: 'try',
         name: 'try-catch',
         tryGraph: emptyGraph(),
-        metadata: { __zigflow_id: nid },
+        metadata: { [ZIGFLOW_ID_KEY]: nid },
       };
     },
   },
@@ -255,7 +256,7 @@ export const TASK_REGISTRY: readonly TaskDefinition[] = [
         name: 'loop',
         in: '$.',
         bodyGraph: emptyGraph(),
-        metadata: { __zigflow_id: nid },
+        metadata: { [ZIGFLOW_ID_KEY]: nid },
       };
     },
   },