ui: field help text + editable program commands

- Add a 'hint' to the shared Field/TextField; annotate the config forms with
  short, accurate descriptions of each field:
  - program: source (working copy castle builds from), behavior (tool/daemon/
    frontend), stack (optional toolchain template), repo/ref (for clone),
    system deps (listed for reference, NOT auto-installed), commands.
  - service: port (listened-on, health-checked, proxied; map via ${port}),
    health path, proxy path vs proxy host, runs.
  - job: schedule (cron → systemd timer), runs.
- ProgramFields: the Commands section is now editable (build/test/lint/
  type-check/run), so a program with no stack can declare its own dev verbs
  by hand — a declared command overrides the stack default. Verified the
  commands/build shape round-trips through the config API.

App builds clean.
This commit is contained in:
2026-06-15 08:50:03 -07:00
parent 32e2ac1f8e
commit ba60019a52
4 changed files with 165 additions and 36 deletions

View File

@@ -5,11 +5,22 @@ import { SecretsEditor } from "@/components/SecretsEditor"
const INPUT =
"bg-black/30 border border-[var(--border)] rounded px-3 py-1.5 text-sm focus:outline-none focus:border-[var(--primary)]"
export function Field({ label, children }: { label: string; children: React.ReactNode }) {
export function Field({
label,
children,
hint,
}: {
label: string
children: React.ReactNode
hint?: string
}) {
return (
<div className="flex items-start gap-4">
<label className="w-32 shrink-0 text-sm font-medium pt-1.5">{label}</label>
<div className="flex-1">{children}</div>
<div className="flex-1">
{children}
{hint && <p className="text-xs text-[var(--muted)] mt-1 leading-snug">{hint}</p>}
</div>
</div>
)
}
@@ -21,6 +32,7 @@ export function TextField({
placeholder,
mono,
width,
hint,
}: {
label: string
value: string
@@ -28,9 +40,10 @@ export function TextField({
placeholder?: string
mono?: boolean
width?: string
hint?: string
}) {
return (
<Field label={label}>
<Field label={label} hint={hint}>
<input
value={value}
onChange={(e) => onChange(e.target.value)}