Add the connector contract, reusable nodes and per-port intervals

Connectors are the device-facing node class third parties write, so the
surface they build against is versioned and documented: ConnectorNode carries
a declared contract version, a polling loop that publishes only what changed
and reports health around it, and parameters whose credential fields are
marked x-secret so the editor offers the secrets store instead of a text box.
They are found through the fluksio.node_types entry point group, with the
package's own metadata as the manifest. docs/connectors/ has the contract and
the authoring guide; connector-skeleton/ is a working one to copy.

The controller no longer knows what any node type is: start, stop and
report_health are protocol methods on Node, and the built-ins were migrated to
them first, so the hooks a connector implements are the ones the engine has
been driving all along.

Marking a node reusable moves its source to _lib/ and points the node at it by
name. Other flows instantiate it with their own ports and settings, one fix
reaches all of them, and a shared source still in use cannot be deleted.

Ports gained an interval: an output publishes, and an input wakes its node, at
most every n seconds. State keeps the latest value, so only the delivery is
skipped, and pressing Run is never throttled.

Also fixes autosave sending no version on its first save of a session, which
made every flow saved more than once conflict with itself.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

frontend/src/components/Flow/NodePanel.tsx

@@ -1,8 +1,14 @@
-import { useQuery } from "@tanstack/react-query"
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"
 import { Maximize2, Minimize2, X } from "lucide-react"
 import { lazy, Suspense, useEffect, useRef, useState } from "react"
 
-import type { DType, MessageSpec, NodeDef_Input, NodeTypeInfo } from "@/client"
+import {
+  type DType,
+  FlowsService,
+  type MessageSpec,
+  type NodeDef_Input,
+  type NodeTypeInfo,
+} from "@/client"
 import { Button } from "@/components/ui/button"
 import {
   Command,
@@ -22,15 +28,24 @@ import {
   SelectValue,
 } from "@/components/ui/select"
 import { Switch } from "@/components/ui/switch"
+import useCustomToast from "@/hooks/useCustomToast"
 import { cn } from "@/lib/utils"
 import { MessageSparkline } from "./MessageSparkline"
-import { nodeSourceQueryOptions } from "./queries"
+import {
+  flowKeys,
+  libraryQueryOptions,
+  nodeSourceQueryOptions,
+  secretsQueryOptions,
+} from "./queries"
 import { PANEL_SECTION, SidePanel } from "./SidePanel"
 
 const NodeEditor = lazy(() => import("./NodeEditor"))
 
 const DTYPES: DType[] = ["float", "int", "str", "bool", "json"]
 
+/** Radix selects cannot hold an empty value, so "no secret" needs a name. */
+const NO_SECRET = "__none__"
+
 const SECTION = PANEL_SECTION
 
 /**
@@ -208,6 +223,19 @@ function PortList({
                 ))}
               </SelectContent>
             </Select>
+            <Input
+              type="number"
+              min={0}
+              step="any"
+              value={spec.interval ? String(spec.interval) : ""}
+              placeholder="∞"
+              aria-label="Deliver at most every n seconds"
+              title="Deliver at most every n seconds; empty is every time"
+              className="h-8 w-16 text-sm"
+              onChange={(event) =>
+                update(index, { interval: Number(event.target.value) || 0 })
+              }
+            />
             <Button
               variant="ghost"
               size="icon-sm"
@@ -235,6 +263,8 @@ function ParamsForm({
   params: Record<string, unknown>
   onChange: (next: Record<string, unknown>) => void
 }) {
+  const { data: secretList } = useQuery(secretsQueryOptions())
+  const secrets = secretList?.data ?? []
   const properties = (schema?.properties ?? {}) as Record<
     string,
     {
@@ -242,6 +272,7 @@ function ParamsForm({
       title?: string
       description?: string
       default?: unknown
+      "x-secret"?: boolean
     }
   >
   const entries = Object.entries(properties)
@@ -272,6 +303,41 @@ function ParamsForm({
           )
         }
 
+        // A credential is stored once and referenced, so it never ends up in
+        // flow.json where the whole team can read it.
+        if (property["x-secret"]) {
+          const reference = (params[key] ?? null) as { $secret?: string } | null
+          return (
+            <div key={key} className="grid gap-1.5">
+              <Label className="text-sm font-normal">{label}</Label>
+              <Select
+                value={reference?.$secret ?? ""}
+                onValueChange={(name) =>
+                  set(key, name === NO_SECRET ? null : { $secret: name })
+                }
+              >
+                <SelectTrigger className="!h-8 text-sm" aria-label={label}>
+                  <SelectValue placeholder="Pick a stored secret" />
+                </SelectTrigger>
+                <SelectContent>
+                  <SelectItem value={NO_SECRET}>None</SelectItem>
+                  {secrets.map((secret) => (
+                    <SelectItem key={secret} value={secret}>
+                      {secret}
+                    </SelectItem>
+                  ))}
+                </SelectContent>
+              </Select>
+              <p className="text-xs text-muted-foreground">
+                {secrets.length
+                  ? property.description ||
+                    "Stored in the secrets store, never in the flow file."
+                  : "No secrets stored yet."}
+              </p>
+            </div>
+          )
+        }
+
         if (property.type === "object" || property.type === "array") {
           return null
         }
@@ -307,6 +373,108 @@ function ParamsForm({
   )
 }
 
+/**
+ * Sharing a node moves its code to the library, where other flows can point at
+ * it. Each flow keeps its own ports and settings; only the code is common, so
+ * one fix reaches all of them.
+ */
+function SharingSection({
+  flow,
+  node,
+  onShared,
+}: {
+  flow: string
+  node: NodeDef_Input
+  onShared: () => void
+}) {
+  const queryClient = useQueryClient()
+  const { showErrorToast } = useCustomToast()
+  const { data: library } = useQuery(libraryQueryOptions())
+  const [name, setName] = useState("")
+
+  const shared = node.source_ref
+  const usages = library?.find((entry) => entry.name === shared)?.used_by ?? []
+
+  const done = () => {
+    queryClient.invalidateQueries({ queryKey: flowKeys.library })
+    queryClient.invalidateQueries({ queryKey: flowKeys.detail(flow) })
+    onShared()
+  }
+
+  const share = useMutation({
+    mutationFn: (libName: string) =>
+      FlowsService.shareNode({
+        name: flow,
+        nodeId: node.id,
+        requestBody: { lib_name: libName },
+      }),
+    onSuccess: done,
+    onError: () =>
+      showErrorToast("That name is taken, or is not a valid name."),
+  })
+
+  const unshare = useMutation({
+    mutationFn: () => FlowsService.unshareNode({ name: flow, nodeId: node.id }),
+    onSuccess: done,
+    onError: () => showErrorToast("The node could not be unshared."),
+  })
+
+  if (shared) {
+    return (
+      <div className="grid gap-2">
+        <span className={SECTION}>Shared</span>
+        <p className="text-sm text-muted-foreground">
+          Runs <span className="font-mono">{shared}</span> from the library
+          {usages.length > 1
+            ? `, along with ${usages.length - 1} other node${
+                usages.length === 2 ? "" : "s"
+              }`
+            : ""}
+          . Editing the code here changes it everywhere.
+        </p>
+        <Button
+          variant="outline"
+          size="sm"
+          className="h-8 justify-self-start"
+          disabled={unshare.isPending}
+          onClick={() => unshare.mutate()}
+          data-testid="unshare-node"
+        >
+          Keep a private copy
+        </Button>
+      </div>
+    )
+  }
+
+  return (
+    <div className="grid gap-2">
+      <span className={SECTION}>Reuse</span>
+      <p className="text-sm text-muted-foreground">
+        Move this node's code to the library so other flows can run it too.
+      </p>
+      <div className="flex items-center gap-1.5">
+        <Input
+          value={name}
+          placeholder="read_temperature"
+          aria-label="Shared name"
+          autoComplete="off"
+          className="h-8 flex-1 font-mono text-sm"
+          onChange={(event) => setName(event.target.value)}
+        />
+        <Button
+          size="sm"
+          className="h-8"
+          disabled={!name || share.isPending}
+          onClick={() => share.mutate(name)}
+          data-testid="share-node"
+        >
+          Share
+        </Button>
+      </div>
+    </div>
+  )
+}
+
 function PanelBody({
   node,
   flow,
@@ -316,6 +484,7 @@ function PanelBody({
   onChange,
   onRenameMessage,
   onSaveSource,
+  onShared,
   onToggleExpand,
 }: {
   node: NodeDef_Input
@@ -326,6 +495,7 @@ function PanelBody({
   onChange: (next: NodeDef_Input) => void
   onRenameMessage: (previous: string, next: string) => void
   onSaveSource: (code: string) => void
+  onShared: () => void
   onToggleExpand: () => void
 }) {
   const hasSource = nodeType?.has_source ?? node.type === "python"
@@ -387,12 +557,17 @@ function PanelBody({
           params={node.params ?? {}}
           onChange={(params) => onChange({ ...node, params })}
         />
+        {hasSource ? (
+          <SharingSection flow={flow} node={node} onShared={onShared} />
+        ) : null}
       </div>
 
       {hasSource ? (
         <div className="flex min-h-[280px] flex-1 flex-col gap-2 px-4 pb-4">
           <div className="flex items-center justify-between">
-            <span className={SECTION}>Code</span>
+            <span className={SECTION}>
+              {node.source_ref ? `Shared code · ${node.source_ref}` : "Code"}
+            </span>
             <Button
               variant="ghost"
               size="icon-sm"
@@ -440,6 +615,7 @@ export function NodePanel({
   onChange,
   onRenameMessage,
   onSaveSource,
+  onShared,
   onToggleExpand,
   onClose,
   onDelete,
@@ -452,6 +628,7 @@ export function NodePanel({
   onChange: (next: NodeDef_Input) => void
   onRenameMessage: (previous: string, next: string) => void
   onSaveSource: (code: string) => void
+  onShared: () => void
   onToggleExpand: () => void
   onClose: () => void
   onDelete: () => void
@@ -506,6 +683,7 @@ export function NodePanel({
           onChange={onChange}
           onRenameMessage={onRenameMessage}
           onSaveSource={onSaveSource}
+          onShared={onShared}
           onToggleExpand={onToggleExpand}
         />
       ) : null}