cb94ff9 · 44a201a · 56a28f4 · c41897a · 5d1e952 · 7a8d636
@@ -436,6 +436,7 @@
This page is the front door. Everything else is a file of its own under
- [`docs/GIT.md`](docs/GIT.md) — cloning over HTTPS and SSH, and partial clones of big repositories.
- [`docs/features/csv-view.md`](docs/features/csv-view.md) — open a `.csv` or `.tsv` in the code view to read it as a table; `?all=1` draws more rows, `?view=source` shows the text. The terminal has its own table view for them (see the `.csv` paragraph above).
- [`docs/features/file-media.md`](docs/features/file-media.md) — a file in the browser: every file page has **Raw** and **Download** (any size), and `/:owner/:name/media/:ref/*path` serves images, audio, video and PDFs under their real type, sandboxed, with byte ranges.
- [`docs/features/config-form.md`](docs/features/config-form.md) — a JSON file opens as a form: typed fields (from its schema when one is found), cards to add and reorder, and a save that commits for a writer or proposes a pull for anyone else. In the terminal, a reader edits in the workspace (`e`) and `c` proposes the change from their fork; any commit there that breaks a JSON file's schema is refused first.
- [`docs/ROLES.md`](docs/ROLES.md) — guest, member and admin, and what each may do.
- [`docs/MCP.md`](docs/MCP.md) — the forge as a connector; [`docs/STANDARDS.md`](docs/STANDARDS.md) is what it answers by default: `.well-known`, feeds, cards, the manifest.
@@ -0,0 +1,11 @@
# Config form
A JSON file edited as a form (`src/web/render/config-form.ts`, `src/web/pages/config.ts`, #7336). Styled in
`style/content.ts`.
- `.config-form` — the card that holds the form, on the blob page (read-only) and on the editor page.
- `.config-group` — a nested object or an array, as a `fieldset.field` with a thin rule down its left edge, so depth reads
  without boxes inside boxes.
- `.config-card` — one item of an array of objects: a `.card` with its Up, Down and Remove buttons in a `.bar`.
- `.config-chips` — an array of scalars: a wrapping row of small inputs, each with its Remove button.
- `.config-diff` — the review step's change, one line per row, `data-op="add|del|same"` tinted with the diff tokens.
@@ -7,9 +7,9 @@
specification.
| component                                     | web class                                                                                              | variants (`data-*`)                                                                                                                      | states                                                                                                                                                                                                                                             | terminal equivalent                                                   |
| --------------------------------------------- | ------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------- | ------ | ------ |
| **button** `btn()`                            | `.btn`                                                                                                 | `variant=primary\|secondary\|outline\|ghost\|danger\|link`, `size=sm\|lg`                                                                | hover, active, `:focus-visible`, `[disabled]`, `[aria-busy]`                                                                                                                                                                                       | a labelled key or a highlighted action cell                           |
| **button** `btn()`                            | `.btn`                                                                                                 | `variant=primary\|secondary\|outline\|ghost\|danger\|link`, `size=sm\|lg`, `formnovalidate`                                                                | hover, active, `:focus-visible`, `[disabled]`, `[aria-busy]`                                                                                                                                                                                       | a labelled key or a highlighted action cell                           |
| **icon button** `iconBtn()`                   | `.btn.btn-icon`                                                                                        | same                                                                                                                                     | `aria-label` required                                                                                                                                                                                                                              | a single glyph with a status-bar hint                                 |
| **input / textarea / select** `field()`       | `.input`                                                                                               | `size=sm`, `[aria-invalid]`                                                                                                              | focus, `:user-invalid`, `[readonly]`                                                                                                                                                                                                               | a line editor with an inline error row                                |
| **input / textarea / select** `field()`       | `.input`                                                                                               | `size=sm`, `[aria-invalid]`, `type=select\|checkbox\|number` (`min`, `max`, `step`)                                                                                                              | focus, `:user-invalid`, `[readonly]`                                                                                                                                                                                                               | a line editor with an inline error row                                |
| **form field** `field()`                      | `.field` (`label`, `.hint`, `.error`)                                                                  | `data-invalid`                                                                                                                           | —                                                                                                                                                                                                                                                  | label line, value line, hint line                                     |
| **checkbox**                                  | `.check`                                                                                               | —                                                                                                                                        | native, `accent-color` themed                                                                                                                                                                                                                      | `[x]` / `[ ]`                                                         |
| **badge** `badge()` / `stateBadge()`          | `.badge`                                                                                               | `variant=secondary\|outline\|success\|danger\|merged\|attn`; `data-state=open\|closed`, `data-pr=merged`                                 | —                                                                                                                                                                                                                                                  | a bracketed word in the state color                                   |
@@ -0,0 +1,77 @@
# Config files as a form
A `.json` file in a repository opens as a form (#7336, part of #7329).
## Reading
The blob page's **Rendered** view draws the file's values as read-only
fields. **Source**, **Raw** and **Download** are where they always are.
A file that is not valid JSON says why, with the line and column, above
its text. YAML, TOML and other config files keep their source view.
## Editing
**Edit as form** opens `/:owner/:name/config/:ref/*path`. You need to be
signed in. A private repository's file is a 404 to anyone who cannot read it.
- **Without a schema** each value's type picks its control. A string is a text
  input, or a textarea when it has more than one line. A number is a number
  input and a boolean is a checkbox. `null` is shown as `null`. A nested
  object is a fieldset. An array of scalars is a row of chips, and an array
  of objects is a list of cards you can add, remove and move up or down.
- **With a schema** the fields follow it. An `enum` becomes a select, and
  `description` becomes help text. `required`, `minimum`, `maximum` and
  `pattern` are set as the inputs' own attributes, so the browser checks
  them as you type. The server checks `required`, the bounds, `enum` and
  `type` again on save. It never runs a pattern the repository wrote.
  A glob in `.forge/schemas.json` is matched segment by segment in
  O(glob × path); no regular expression is built from it.
  Properties the schema names but the file does not have are offered as
  **+ key** buttons. Local `$ref`s (`#/definitions/…`, `#/$defs/…`) are
  followed.
- **Finding the schema.** The first one found is used:
  1. `$schema` in the file, if it is a path. A path that starts with `/`
     is read from the repository root; any other path is read from the
     file's folder. A URL is ignored.
  2. A sibling `<name>.schema.json`.
  3. `.forge/schemas.json`, an object that maps globs to schema paths, for
     example `{ "config/**/*.json": "schemas/config.json" }`.
## Saving
**Review** shows the change as a diff, under a commit message.
- **A writer** commits one commit to the branch.
- **Anyone else** gets **Propose change**: one commit on a new branch and a
  pull request into the branch they were reading. That includes a reader,
  an agent, and a writer facing a protected default branch. A writer's
  branch goes in the repository itself. A reader's goes on their fork; the
  forge makes the fork if they have none, and the usual fork rules apply
  (`actions/propose_edit.ts`).
- The file is written back with its own key order, indent (spaces or tabs),
  line endings and final newline. Numbers keep their spelling.
- A save that changes nothing writes nothing.
- If the file changed on the branch after you opened it, the save stops
  and asks you to review again.
All of this works without JavaScript, as plain form posts: each card button
submits the form, and the form comes back with the change applied.
Files over 256 KB, or with more than 2,000 values, open in the source view
and can be edited as text.
## In the terminal
The workspace is the terminal's editor. Open a repository, press `e` on a
file, then `c`:
- A writer gets the commit dialog, as before.
- A signed-in reader of a forge repository now gets **Propose a change**:
  `ctrl+s` puts the commit on a branch of their fork (made if needed) and
  opens a pull back. This is the same `proposeEdit` the web uses, with the
  same refusals in the same words. The status line says "proposes from your
  fork".
- Before any commit or proposal, each JSON file in the change is checked
  against its schema (`schemaRefusal`, found the same three ways). A file
  that breaks it is refused in the dialog, naming the field and the schema,
  and nothing is written.
@@ -0,0 +1,123 @@
/**
 * Proposing a change to files: one commit on a new branch, and a pull that
 * asks for it. The shape every person who cannot (or should not) commit to
 * a branch gets, in one call.
 *
 * - A writer — an agent, or a person facing a protected branch — gets the
 *   branch in the repository itself and a pull inside it.
 * - Anyone else who can read the repository gets it on their fork: the fork
 *   they already have, or a new one (`forkRepo`, with its limits), and a
 *   pull from that fork back to the branch they were reading.
 *
 * The commit lands on the fork's copy of `base`, so a fork far behind its
 * parent proposes against its own older snapshot; the pull's mergeability
 * says so, as it does for any fork's pull.
 */
import type { App } from "../app.ts";
import { canWrite, getForkOf, type Repo } from "../core/repos.ts";
import type { Pull } from "../core/pulls.ts";
import type { User } from "../core/users.ts";
import { isSafeRef } from "../git/guard.ts";
import { err, ok, type Result } from "../kernel/result.ts";
import { requireParticipant } from "./access.ts";
import { editFiles, type EditFile } from "./contents.ts";
import { openPull } from "./pulls.ts";
import { forkRepo } from "./repos.ts";
export interface ProposeEditInput {
  /** The branch the pull asks to change. */
  readonly base: string;
  readonly files: readonly EditFile[];
  readonly message: string;
  readonly title: string;
  readonly body?: string;
  /** The new branch's name; one is made up (`proposalBranch`) when absent. */
  readonly branch?: string;
}
export interface Proposed {
  readonly pull: Pull;
  /** The repository the commit landed in: `repo` itself, or the actor's fork. */
  readonly head: Repo;
  readonly branch: string;
}
/** A refusal, as the code a page turns into words. */
export type ProposeEditError = { readonly step: "fork" | "commit" | "pull"; readonly reason: string };
/** `alice/edit-settings-lq3k2`: whose, what, and unique enough not to collide. */
export function proposalBranch(username: string, path: string, now = Date.now()): string {
  const name = (path.split("/").pop() ?? "file")
    .replace(/\.[^.]*$/, "")
    .toLowerCase()
    .replace(/[^a-z0-9]+/g, "-")
    .replace(/^-+|-+$/g, "")
    .slice(0, 40) || "file";
  return `${username}/edit-${name}-${now.toString(36)}`;
}
const reasonOf = (e: unknown): string =>
  typeof e === "string" ? e : typeof e === "object" && e !== null && "kind" in e ? String((e as { kind: unknown }).kind) : "refused";
export async function proposeEdit(
  app: App,
  actor: User | undefined,
  repo: Repo,
  input: ProposeEditInput,
): Promise<Result<Proposed, ProposeEditError>> {
  const user = requireParticipant(app, actor, repo);
  if (!user.ok) return err({ step: "fork", reason: user.error });
  if (!isSafeRef(input.base)) return err({ step: "commit", reason: "invalid_branch" });
  let head = repo;
  if (!canWrite(app.db, repo, user.value)) {
    const mine = getForkOf(app.db, user.value.id, repo.id);
    if (mine !== undefined) head = mine;
    else {
      const forked = await forkRepo(app, user.value, repo);
      if (!forked.ok) return err({ step: "fork", reason: forked.error });
      head = forked.value;
    }
  }
  const branch = input.branch?.trim() || proposalBranch(user.value.username, input.files[0]?.path ?? "file");
      
        sentinelcrew
        17d ago
        
      
      Non-blocking: a branch name the person picks in the terminal dialog that already exists on their fork ends as branch_failed ("It may already exist."). That is fine. A test of it would keep that wording honest.
    
  if (!isSafeRef(branch)) return err({ step: "commit", reason: "invalid_branch" });
  const written = await editFiles(app, user.value, head, {
    base: input.base,
    newBranch: branch,
    message: input.message,
    files: input.files,
  });
  if (!written.ok) return err({ step: "commit", reason: reasonOf(written.error) });
  const pull = await openPull(app, user.value, repo, {
    title: input.title,
    body: input.body ?? "",
    baseBranch: input.base,
    headBranch: branch,
    ...(head.id === repo.id ? {} : { headRepo: head }),
  });
  if (!pull.ok) return err({ step: "pull", reason: reasonOf(pull.error) });
  return ok({ pull: pull.value, head, branch });
}
/** A refused proposal as the sentence the page and the terminal both show. */
export function proposeEditText(error: ProposeEditError): string {
  const { step, reason } = error;
  if (step === "fork") {
    if (reason === "unverified")
      return "Confirm your email first: proposing a change makes a fork, and a fork needs a confirmed address.";
    if (reason === "not_member")
      return "Proposing a change makes a fork, and forks are for members of this forge. Ask its admin to make you one.";
    if (reason === "limit" || reason === "repository_limit" || reason === "storage_limit")
      return "You cannot make another fork right now, so this could not be proposed. Try again later.";
    if (reason === "not_found") return "That repository is not one you can read.";
    return "A fork to carry this change could not be made.";
  }
  if (step === "pull")
    return "The commit landed on a new branch, but the pull request could not be opened. Open it from the branch.";
  if (reason === "invalid_branch") return "That branch name is not one git will take.";
  if (reason === "branch_failed") return "That branch could not be created. It may already exist.";
  return "The change could not be committed, so nothing was proposed.";
}
@@ -222,6 +222,7 @@
import {
  newFilePage,
  previewSubmit,
} from "../web/pages/edit.ts";
import { configPage, configSubmit } from "../web/pages/config.ts";
import { commitPage, commitsPage } from "../web/pages/commits.ts";
import {
  issueCommentSubmit,
@@ -1359,6 +1360,9 @@
export function buildRouter(): Router<Handler> {
  // A mirror of a repository you cannot push to takes its edits as
  // proposals: fork at the origin, commit there, open the pull upstream.
  router.add("POST", "/:owner/:name/contribute", contributeSubmit);
  // A JSON config file as a form: a writer commits, anyone else proposes.
  router.add("GET", "/:owner/:name/config/:ref/*path", configPage);
  router.add("POST", "/:owner/:name/config", configSubmit);
  router.add("GET", "/:owner/:name/commits", commitsPage);
  router.add("GET", "/:owner/:name/commit/:oid", commitPage);
@@ -35,6 +35,8 @@
 */
import { editFiles } from "../../actions/contents.ts";
import { proposeEdit, proposeEditText } from "../../actions/propose_edit.ts";
import { schemaRefusal } from "../../web/render/json-schema.ts";
import { err, ok } from "../../kernel/result.ts";
import { createBranch } from "../../actions/branches.ts";
import { NAME_THE_BRANCH } from "../../actions/branch_words.ts";
@@ -560,8 +562,15 @@
export function workspaceScreen(
  /** Set when a change made here has to travel to another forge to land. */
  const proposal = (): OriginTarget | undefined =>
    proposeTarget(src, canPushUpstream());
  /**
   * A forge repository you can read and not write: a change to it goes on
   * your fork, as a pull back here (`actions/propose_edit.ts`). A mirror
   * proposes through its origin instead (`proposal`).
   */
  const forkable = (): boolean =>
    !writable() && repo !== undefined && repo.origin == null && f.user !== undefined && src.where.kind === "local";
  /** Editing is allowed wherever the change has somewhere to go. */
  const editable = (): boolean => writable() || proposal() !== undefined;
  const editable = (): boolean => writable() || proposal() !== undefined || forkable();
  const admin = (): boolean =>
    repo !== undefined && canAdmin(f.db, repo, f.user);
  const readPin = (): void => {
@@ -842,9 +851,28 @@
export function workspaceScreen(
  // ---- mutations ----
  /**
   * Why the change breaks a schema one of its JSON files names, or
   * undefined. The same check the web form makes before a save.
   */
  const schemaCheck = async (
    files: readonly { path: string; content: Uint8Array | null }[],
  ): Promise<string | undefined> => {
    const read = async (p: string): Promise<string | undefined> => {
      const blob = await src.blob(ref, p);
      return blob.ok && blob.value.kind === "text" ? new TextDecoder().decode(blob.value.body) : undefined;
    };
    for (const file of files) {
      if (file.content === null) continue;
      const refused = await schemaRefusal(file.path, new TextDecoder().decode(file.content), read);
      if (refused !== undefined) return refused;
    }
    return undefined;
  };
  const commit = (): void => {
    const target = proposal();
    if (!writable() && target === undefined) {
    if (!writable() && target === undefined && !forkable()) {
      readOnlyToast();
      return;
    }
@@ -881,6 +909,10 @@
export function workspaceScreen(
      proposeChange(target, files, subject, payload);
      return;
    }
    if (forkable() && repo !== undefined) {
      proposeHere(repo, files, subject, payload);
      return;
    }
    if (repo === undefined) {
      readOnlyToast();
      return;
@@ -896,6 +928,8 @@
export function workspaceScreen(
        files,
        defaultBranchName: suggestBranch(f, "edit", slug(first.path)),
        commit: async (plan) => {
          const broken = await schemaCheck(payload(plan.paths));
          if (broken !== undefined) return err(broken);
          const made = await editFiles(f.app, f.user, here, {
            branch: ref,
            base: ref,
@@ -929,6 +963,68 @@
export function workspaceScreen(
    );
  };
  /**
   * The same dialog, for a forge repository you can only read: the commit
   * goes on a branch of your fork (made if you have none) and a pull asks
   * for it here — what the web's Propose change does.
   */
  const proposeHere = (
    here: Repo,
    files: readonly CommitFile[],
    subject: string,
    payload: (paths: readonly string[]) => {
      path: string;
      content: Uint8Array | null;
    }[],
  ): void => {
    const first = files[0]!;
    const base = ref === "" ? here.defaultBranch : ref;
    const fullName = `${here.ownerName}/${here.name}`;
    ctx.push(
      commitScreen(f, ctx, screen, {
        repo: here,
        where: fullName,
        branch: ref,
        title: "Propose a change",
        subject,
        files,
        mode: "propose",
        upstream: { fullName, base },
        defaultBranchName: suggestBranch(f, "edit", slug(first.path)),
        commit: async (plan) => {
          const chosen = payload(plan.paths);
          const broken = await schemaCheck(chosen);
          if (broken !== undefined) return err(broken);
          const sent = await proposeEdit(f.app, f.user, here, {
            base,
            files: chosen,
            message: plan.message,
            title: plan.pull?.title ?? subject,
            ...(plan.pull?.body === undefined ? {} : { body: plan.pull.body }),
            ...(plan.newBranch === undefined ? {} : { branch: plan.newBranch }),
          });
          if (!sent.ok) return err(proposeEditText(sent.error));
          const pull = sent.value.pull;
          return ok({
            message: `opened pull #${pull.number} on ${fullName} from ${sent.value.head.ownerName}/${sent.value.head.name}`,
            then: () => {
              // The work lives on the fork and in the pull: the buffers go
              // back to what this repository holds.
              for (const t of tabs) {
                t.creating = false;
                t.editor = null;
                t.mode = "view";
                t.rebuild(ctx.theme.c);
              }
              pending.clear();
              ctx.invalidate();
            },
          });
        },
      }),
    );
  };
  /**
   * The same dialog, aimed at somebody else's forge.
   *
@@ -2325,7 +2421,9 @@
export function workspaceScreen(
                          ? ""
                          : ` · ${tableProblem(t.table)}`
                      }`
                }${writable() || target !== undefined ? "" : " · read only"}`;
                }${
                  writable() || target !== undefined ? "" : forkable() ? " · proposes from your fork" : " · read only"
                }`;
    if (tail === "") return;
    const shown = truncate(tail, Math.max(0, r.w - 4));
    s.text(
@@ -0,0 +1,321 @@
/**
 * Editing a JSON config file as a form (#7336).
 *
 * GET  /:owner/:name/config/:ref/*path — the file's values as fields, typed
 *      by its schema when one is found (`render/json-schema.ts`), else by
 *      the values themselves.
 * POST /:owner/:name/config — one route, three steps:
 *      `op`          add, remove or reorder a card; the form comes back.
 *      step=review   the change as a diff, with a commit message.
 *      step=save     a writer commits to the branch; anyone else (a
 *                    reader, an agent, a writer facing a protected branch)
 *                    proposes it: one commit on a new branch and a pull
 *                    (`actions/propose_edit.ts`).
 *
 * The file is written back in its own key order and indent, and a save
 * that changes nothing writes nothing. Everything works as a plain form
 * POST; a browser with HTML validation checks a schema's bounds inline.
 * A file that is not valid JSON goes back to its source view, with the
 * error and its line.
 */
import { editFiles } from "../../actions/contents.ts";
import { proposeEdit, proposeEditText } from "../../actions/propose_edit.ts";
import { canAdmin } from "../../core/repos.ts";
import { isSafeRef, isSafeTreePath } from "../../git/guard.ts";
import type { Ctx } from "../../http/context.ts";
import { loadRepo, notFoundPage, pageHead, signInFirst } from "../chrome.ts";
import { field as formValue, readForm, type Form } from "../form.ts";
import { html, when, type Html } from "../html.ts";
import { flashTo, page } from "../layout.ts";
import { isFormJson } from "../render/config.ts";
import { applyOp, configFields, countFields, MAX_FIELDS, readValues } from "../render/config-form.ts";
import {
  detectStyle,
  lineDiff,
  parseJson,
  sameDoc,
  stringify,
  type Json,
} from "../render/json-doc.ts";
import { findSchema, validate, type FoundSchema } from "../render/json-schema.ts";
import { localScope, type RepoScope } from "../scope.ts";
import { btn, field, icon } from "../ui.ts";
import { editErrorText } from "./edit.ts";
import { refSetFrom } from "./refs.ts";
/** Bigger than this, the form is no help; the source editor is. */
export const MAX_FORM_BYTES = 256 * 1024;
/** A schema file larger than this is not read. */
const MAX_SCHEMA_BYTES = 256 * 1024;
/** Names the file's text as it was opened, so a save sees whether it moved. */
export const digestOf = (text: string): string => Bun.hash(text).toString(16);
const blobHref = (scope: RepoScope, ref: string, path: string, view = ""): string =>
  `${scope.base}/blob/${encodeURIComponent(ref)}/${path}${view}`;
/** Who this is to the file: commits straight on, or proposes. */
async function commitsDirectly(ctx: Ctx, scope: RepoScope, ref: string): Promise<boolean> {
  const repo = scope.repo;
  const user = ctx.auth.user;
  if (repo === undefined || user === undefined || !scope.caps.write || user.kind === "agent") return false;
      
        sentinelcrew
        17d ago
        
      
      Nothing tests that an agent with write access proposes, or (line 65) that a non-admin writer on a protected default branch proposes on a branch in the repository itself. Add a test for each; deleting either condition today breaks no test.
    
  const refs = await refSetFrom(scope.source);
  if (!refs.branches.includes(ref)) return false;
  return !(ref === repo.defaultBranch && repo.protectDefault && !canAdmin(ctx.app.db, repo, user));
}
/** The repository, the signed-in person, and a ref and path fit to edit; or the refusal. */
function configContext(ctx: Ctx, ref: string, path: string): RepoScope | Response {
  const repo = loadRepo(ctx);
  if (!repo) return notFoundPage(ctx);
  if (!ctx.auth.user) return signInFirst(ctx);
  if (!isSafeRef(ref) || !isSafeTreePath(path) || !isFormJson(path)) return notFoundPage(ctx);
  const scope = localScope(ctx, repo);
  // A mirror you cannot push to proposes through its origin: the source editor's card.
  if (scope.propose !== undefined)
    return flashTo(ctx, blobHref(scope, ref, path), {
      tone: "danger",
      message: "This file mirrors an origin. Propose a change to it from the editor.",
    });
  return scope;
}
/** The file's text at `ref`, when it is text the form can hold. */
async function readText(scope: RepoScope, ref: string, path: string, max: number): Promise<string | undefined> {
  const blob = await scope.source.blob(ref, path);
  if (!blob.ok || blob.value.kind !== "text" || blob.value.size > max) return undefined;
  return new TextDecoder().decode(blob.value.body);
}
const schemaFor = (scope: RepoScope, ref: string, path: string, doc: Json): Promise<FoundSchema | undefined> =>
  findSchema(path, doc, (p) => (isSafeTreePath(p) ? readText(scope, ref, p, MAX_SCHEMA_BYTES) : Promise.resolve(undefined)));
interface FormState {
  readonly ref: string;
  readonly path: string;
  readonly base: string;
  readonly doc: Json;
  readonly found: FoundSchema | undefined;
  readonly errors?: ReadonlyMap<string, string>;
  readonly typed?: ReadonlyMap<string, string>;
  readonly flash?: { tone: "danger" | "success"; message: string };
}
const hidden = (s: FormState, doc: Json): Html => html`<input type="hidden" name="ref" value="${s.ref}" />
  <input type="hidden" name="path" value="${s.path}" />
  <input type="hidden" name="base" value="${s.base}" />
  <input type="hidden" name="doc" value="${stringify(doc)}" />`;
function head(scope: RepoScope, s: FormState, proposing: boolean, step: string): Html {
  return pageHead(html`${icon(proposing ? "fork" : "pencil")}${s.path.split("/").pop() ?? s.path}`, {
    sub: html`${step} · <span class="mono">${s.path}</span> on <span class="mono">${s.ref}</span> in
      <span class="mono">${scope.fullName}</span>${
        s.found === undefined
          ? html` · fields from the values`
          : html` · fields from <a href="${blobHref(scope, s.ref, s.found.from)}" class="mono">${s.found.from}</a>`
      }`,
  });
}
async function formPage(ctx: Ctx, scope: RepoScope, s: FormState): Promise<Response> {
  const proposing = !(await commitsDirectly(ctx, scope, s.ref));
  // The first submit button in the form, so Enter in any field reviews
  // rather than pressing a card's Up or Remove.
  const review = btn(proposing ? "Review and propose" : "Review changes", { name: "step", value: "review", variant: "primary" });
  return page({
    ctx,
    ...(s.flash === undefined ? {} : { flash: s.flash }),
    title: `${s.path} · ${scope.facts.name}`,
    crumbs: scope.crumbs,
    palette: scope.palette,
      
        sentinelcrew
        17d ago
        outdated
      
      Remove this raw() submit button, which is aria-hidden and sr-only. Make Review the first submit button in the form, so Enter in a field submits it without a hidden control.
    
    body: html`${head(scope, s, proposing, "Editing settings")}
      <form method="post" action="${scope.base}/config" class="card config-form">
        <div class="bar mb">
          <span class="muted small">Enter in a field reviews the change.</span><span class="spacer"></span>
          ${review}
        </div>
        ${hidden(s, s.doc)}
        <input type="hidden" name="from" value="form" />
        ${configFields(s.doc, {
          found: s.found,
          ...(s.errors === undefined ? {} : { errors: s.errors }),
          ...(s.typed === undefined ? {} : { typed: s.typed }),
        })}
        <div class="form-actions">
          ${review}
          ${btn("Source", { href: blobHref(scope, s.ref, s.path, "?view=source"), variant: "outline" })}
          ${when(scope.caps.write, () =>
            btn("Edit as text", { href: `${scope.base}/edit/${encodeURIComponent(s.ref)}/${s.path}`, variant: "ghost" }),
          )}
        </div>
      </form>`,
  });
}
async function reviewPage(
  ctx: Ctx,
  scope: RepoScope,
  s: FormState,
  diff: { before: string; after: string },
  o: { message?: string; description?: string; error?: string } = {},
): Promise<Response> {
  const proposing = !(await commitsDirectly(ctx, scope, s.ref));
  const lines = lineDiff(diff.before, diff.after);
  return page({
    ctx,
    ...(s.flash === undefined ? {} : { flash: s.flash }),
    title: `Review ${s.path} · ${scope.facts.name}`,
    crumbs: scope.crumbs,
    palette: scope.palette,
    body: html`${head(scope, s, proposing, "Review")}
      <pre class="card mono config-diff" aria-label="The change">${lines.map(
        (l) => html`<span data-op="${l.op === " " ? "same" : l.op === "+" ? "add" : "del"}">${l.op} ${l.text}</span>\n`,
      )}</pre>
      <form method="post" action="${scope.base}/config" class="card">
        ${hidden(s, s.doc)}
        ${field({
          name: "message",
          label: "Commit message",
          value: o.message ?? `Update ${s.path}`,
          required: true,
          ...(o.error === undefined ? {} : { error: o.error }),
        })}
        ${field({ name: "description", label: "Description", type: "textarea", rows: 3, value: o.description ?? "" })}
        <p class="muted small">${
          proposing
            ? scope.caps.write
              ? html`This goes on a new branch, with a pull request into <span class="mono">${s.ref}</span>.`
      
        sentinelcrew
        17d ago
        outdated
      
      Same here: use btn() with formnovalidate, not a raw() string.
    
              : html`You cannot push here, so this goes on a branch of your fork, with a pull request into <span class="mono">${s.ref}</span>.`
            : html`One commit on <span class="mono">${s.ref}</span>.`
        }</p>
        <div class="form-actions">
          ${btn(proposing ? "Propose change" : `Commit to ${s.ref}`, { name: "step", value: "save", variant: "primary", icon: proposing ? "fork" : "check" })}
          ${btn("Back to the form", { name: "step", value: "edit", variant: "outline", formnovalidate: true })}
        </div>
      </form>`,
  });
}
// GET /:owner/:name/config/:ref/*path
export async function configPage(ctx: Ctx): Promise<Response> {
  const ref = ctx.params.ref ?? "";
  const path = ctx.params.path ?? "";
  const scope = configContext(ctx, ref, path);
  if (scope instanceof Response) return scope;
  const blob = await scope.source.blob(ref, path);
  if (!blob.ok) return notFoundPage(ctx);
  const tooBig = (message: string): Response =>
    flashTo(ctx, blobHref(scope, ref, path, "?view=source"), { tone: "danger", message });
  if (blob.value.kind !== "text" || blob.value.size > MAX_FORM_BYTES)
    return tooBig("This file is too large to edit as a form. Edit it as text, or with git.");
  const text = new TextDecoder().decode(blob.value.body);
  const parsed = parseJson(text);
  if (!parsed.ok) {
    const e = parsed.error;
    return tooBig(`Not valid JSON: ${e.message} at line ${e.line}, column ${e.column}. Fix it in the source first.`);
  }
  if (countFields(parsed.value) > MAX_FIELDS)
    return tooBig(`This file has more than ${MAX_FIELDS.toLocaleString()} values, too many for a form. Edit it as text.`);
  return formPage(ctx, scope, {
    ref,
    path,
    base: digestOf(text),
    doc: parsed.value,
    found: await schemaFor(scope, ref, path, parsed.value),
  });
}
/** The document the form carried, with what was typed into it. */
function docFrom(form: Form): { doc: Json; errors: Map<string, string>; typed: Map<string, string> } | undefined {
  const parsed = parseJson(formValue(form, "doc"));
  if (!parsed.ok || countFields(parsed.value) > MAX_FIELDS) return undefined;
  if (formValue(form, "from") !== "form") return { doc: parsed.value, errors: new Map(), typed: new Map() };
  return readValues(parsed.value, (name) => {
    const v = form.get(name);
    return typeof v === "string" ? v : undefined;
  });
}
// POST /:owner/:name/config
export async function configSubmit(ctx: Ctx): Promise<Response> {
  // Who may write is settled before the body is read: a private repository
  // answers a stranger 404, as every page about it does.
  if (!loadRepo(ctx)) return notFoundPage(ctx);
  if (!ctx.auth.user) return signInFirst(ctx);
  const form = await readForm(ctx, "rw");
  if (form instanceof Response) return form;
  const ref = formValue(form, "ref");
  const path = formValue(form, "path");
  const scope = configContext(ctx, ref, path);
  if (scope instanceof Response) return scope;
  const repo = scope.repo;
  const user = ctx.auth.user;
  if (repo === undefined || user === undefined) return notFoundPage(ctx);
  const read = docFrom(form);
  if (read === undefined) return flashTo(ctx, blobHref(scope, ref, path), { tone: "danger", message: "That form could not be read. Open the file again." });
  const current = await readText(scope, ref, path, MAX_FORM_BYTES);
  if (current === undefined) return notFoundPage(ctx);
  const original = parseJson(current);
  const found = await schemaFor(scope, ref, path, read.doc);
  let state: FormState = { ref, path, base: formValue(form, "base"), doc: read.doc, found };
  const op = formValue(form, "op");
  if (op !== "") return formPage(ctx, scope, { ...state, doc: applyOp(read.doc, op, found) });
  const step = formValue(form, "step");
  if (step === "edit") return formPage(ctx, scope, state);
  const errors = new Map([...validate(read.doc, found), ...read.errors]);
  if (errors.size > 0)
    return formPage(ctx, scope, {
      ...state,
      errors,
      typed: read.typed,
      flash: { tone: "danger", message: errors.size === 1 ? "One field needs a fix." : `${errors.size} fields need a fix.` },
    });
  if (state.base !== digestOf(current)) {
    // Someone else saved first. Their file is now the base; the form keeps
    // this person's values, and a second review shows them over the new file.
    return formPage(ctx, scope, {
      ...state,
      base: digestOf(current),
      flash: { tone: "danger", message: `${path} changed on ${ref} since you opened it. Check your values, then review again.` },
    });
  }
  if (original.ok && sameDoc(original.value, read.doc))
    return formPage(ctx, scope, { ...state, flash: { tone: "success", message: "Nothing changed, so there is nothing to save." } });
  const after = stringify(read.doc, detectStyle(current));
  if (step !== "save") return reviewPage(ctx, scope, state, { before: current, after });
  const subject = formValue(form, "message").trim();
  const description = formValue(form, "description").trim();
  if (subject === "")
    return reviewPage(ctx, scope, state, { before: current, after }, { description, error: "A commit needs a message." });
  const message = description === "" ? subject : `${subject}\n\n${description}`;
  const files = [{ path, content: after }];
  if (await commitsDirectly(ctx, scope, ref)) {
    const written = await editFiles(ctx.app, user, repo, { branch: ref, base: ref, message, files });
    if (!written.ok) {
      state = { ...state, flash: { tone: "danger", message: editErrorText(written.error) } };
      return reviewPage(ctx, scope, state, { before: current, after }, { message: subject, description });
    }
    return flashTo(ctx, blobHref(scope, ref, path), { tone: "success", message: `Committed to ${ref}.` });
  }
  const proposed = await proposeEdit(ctx.app, user, repo, { base: ref, files, message, title: subject, body: description });
  if (!proposed.ok) {
    const words = proposeEditText(proposed.error);
    state = { ...state, flash: { tone: "danger", message: words } };
    return reviewPage(ctx, scope, state, { before: current, after }, { message: subject, description });
  }
  const pull = proposed.value.pull;
  return flashTo(ctx, `${scope.base}/pulls/${pull.number}`, {
    tone: "success",
    message: `Proposed on ${proposed.value.head.ownerName}/${proposed.value.head.name}:${proposed.value.branch}, as this pull request.`,
  });
}
@@ -0,0 +1,316 @@
/**
 * A JSON document as form fields, and a submitted form back as a document.
 *
 * Every field is named for the JSON pointer of its value: `v/servers/0/port`
 * carries text, `j/mode` carries a JSON value (an enum's select), and a
 * boolean is a checkbox whose absence means false. The document's shape
 * travels beside them in a hidden `doc`, so a plain form POST — no script —
 * can add, remove and reorder cards: each of those is a submit button named
 * `op` (`opValue`), applied by `applyOp` before the form is drawn again.
 *
 * Without a schema a field's control comes from its value; with one, from
 * the schema too: an enum is a select, `description` is the help text, and
 * `required`, `minimum`, `maximum` and `pattern` are the input's own
 * attributes, so a browser checks them inline before the form is sent.
 */
import { html, raw, when, type Html } from "../html.ts";
import { btn, field } from "../ui.ts";
import {
  blankLike,
  fromPlain,
  pointer,
  splitPointer,
  updateAt,
  type Json,
} from "./json-doc.ts";
import { isJsonNumber, schemaAt, type FoundSchema, type Schema } from "./json-schema.ts";
/** More values than this and the form is no help: the source editor is. */
export const MAX_FIELDS = 2_000;
/** How many values (leaves) a document has, for `MAX_FIELDS`. */
export function countFields(doc: Json): number {
  if (doc.t === "array") return doc.items.reduce((n, v) => n + countFields(v), 1);
  if (doc.t === "object") return doc.entries.reduce((n, [, v]) => n + countFields(v), 1);
  return 1;
}
export interface FieldsOptions {
  readonly found?: FoundSchema | undefined;
  /** Messages by pointer, each drawn under its field. */
  readonly errors?: ReadonlyMap<string, string>;
  /** What was typed into a field that could not hold it (a bad number). */
  readonly typed?: ReadonlyMap<string, string>;
  /** Draw the values only: no inputs that submit, no buttons. */
  readonly readonly?: boolean;
}
export type Op = "add" | "remove" | "up" | "down" | "key";
/** A structural button's value: which change, at which pointer. */
export const opValue = (op: Op, at: string, key?: string): string =>
  JSON.stringify(key === undefined ? [op, at] : [op, at, key]);
const isScalar = (v: Json): boolean => v.t !== "array" && v.t !== "object";
const typeList = (s: Schema | undefined): readonly string[] =>
  s?.type === undefined ? [] : typeof s.type === "string" ? [s.type] : s.type;
/** What a new value under schema `s` starts as, shaped like `like` when the schema is silent. */
function blankFor(s: Schema | undefined, like: Json | undefined): Json {
  if (s?.default !== undefined) return fromPlain(s.default);
  if (Array.isArray(s?.enum) && s.enum.length > 0) return fromPlain(s.enum[0]);
  const t = typeList(s)[0];
  if (t === "string") return { t: "string", v: "" };
  if (t === "number" || t === "integer") return { t: "number", v: "0" };
  if (t === "boolean") return { t: "boolean", v: false };
  if (t === "array") return { t: "array", items: [] };
  if (t === "object") {
    const props = s?.properties ?? {};
    const keys = Array.isArray(s?.required) ? s.required.filter((k) => typeof k === "string") : [];
    return { t: "object", entries: keys.map((k) => [k, blankFor(props[k], undefined)] as const) };
  }
  return blankLike(like);
}
const parentOf = (p: string): { parent: string; index: number } | undefined => {
  const cut = p.lastIndexOf("/");
  const tail = p.slice(cut + 1);
  return cut < 0 || !/^(0|[1-9]\d*)$/.test(tail) ? undefined : { parent: p.slice(0, cut), index: Number(tail) };
};
/** One structural change to the document; anything unrecognised changes nothing. */
export function applyOp(doc: Json, raw: string, found?: FoundSchema): Json {
  let parsed: unknown;
  try {
    parsed = JSON.parse(raw);
  } catch {
    return doc;
  }
  if (!Array.isArray(parsed) || typeof parsed[0] !== "string" || typeof parsed[1] !== "string") return doc;
  const [op, at, key] = parsed as [string, string, unknown];
  if (splitPointer(at) === undefined) return doc;
  if (op === "add")
    return updateAt(doc, at, (arr) =>
      arr.t !== "array"
        ? arr
        : { t: "array", items: [...arr.items, blankFor(schemaAt(found, pointer(at, arr.items.length)), arr.items.at(-1))] },
    );
  if (op === "key" && typeof key === "string" && key !== "")
    return updateAt(doc, at, (obj) =>
      obj.t !== "object" || obj.entries.some(([k]) => k === key)
        ? obj
        : { t: "object", entries: [...obj.entries, [key, blankFor(schemaAt(found, pointer(at, key)), undefined)] as const] },
    );
  const place = parentOf(at);
  if (place === undefined) return doc;
  const { parent, index } = place;
  return updateAt(doc, parent, (arr) => {
    if (arr.t !== "array" || index >= arr.items.length) return arr;
    const items = [...arr.items];
    if (op === "remove") items.splice(index, 1);
    else if (op === "up" || op === "down") {
      const to = op === "up" ? index - 1 : index + 1;
      if (to < 0 || to >= items.length) return arr;
      [items[index], items[to]] = [items[to]!, items[index]!];
    } else return arr;
    return { t: "array", items };
  });
}
/**
 * The document with the form's values written into it. A number that is not
 * one keeps the old value and comes back in `typed` with an error, so the
 * form can be drawn again with the person's text still in it.
 */
export function readValues(
  doc: Json,
  get: (name: string) => string | undefined,
): { doc: Json; errors: Map<string, string>; typed: Map<string, string> } {
  const errors = new Map<string, string>();
  const typed = new Map<string, string>();
  const walk = (v: Json, p: string): Json => {
    if (v.t === "object") return { t: "object", entries: v.entries.map(([k, x]) => [k, walk(x, pointer(p, k))] as const) };
    if (v.t === "array") return { t: "array", items: v.items.map((x, i) => walk(x, pointer(p, i))) };
    const chosen = get(`j${p}`);
    if (chosen !== undefined) {
      try {
        return fromPlain(JSON.parse(chosen));
      } catch {
        return v;
      }
    }
    const text = get(`v${p}`);
    if (v.t === "boolean") return { t: "boolean", v: text === "true" };
    if (text === undefined || v.t === "null") return v;
    if (v.t === "string") return { t: "string", v: text.replace(/\r\n/g, "\n") };
    const n = text.trim();
    if (isJsonNumber(n)) return { t: "number", v: n };
    errors.set(p, "Must be a number.");
    typed.set(p, text);
    return v;
  };
  return { doc: walk(doc, ""), errors, typed };
}
// ---- drawing ----
/** The last segment of a pointer, as a field's label. */
const labelOf = (p: string): string => splitPointer(p)?.at(-1) ?? "";
let fieldSerial = 0;
const description = (s: Schema | undefined): string | undefined =>
  typeof s?.description === "string" && s.description !== "" ? s.description : undefined;
/**
 * One scalar value as `field()`: its label, control, help and error. The
 * control follows the schema when it says (an enum is a select), else the
 * value (a boolean is a checkbox, a number a number input).
 */
function scalarField(
  v: Json,
  p: string,
  s: Schema | undefined,
  o: FieldsOptions,
  f: { label: string; required: boolean; labelHidden?: boolean; after?: Html | null },
): Html {
  const off = o.readonly === true;
  const help = description(s);
  const error = o.errors?.get(p);
  const shared = {
    id: `cf-${++fieldSerial}`,
    label: f.required && !off ? `${f.label} (required)` : f.label,
    ...(help === undefined ? {} : { hint: help }),
    ...(error === undefined ? {} : { error }),
    ...(f.labelHidden ? { labelHidden: true } : {}),
    ...(f.after ? { after: f.after } : {}),
  };
  if (Array.isArray(s?.enum) && s.enum.length > 0) {
    const current = JSON.stringify(v.t === "number" ? Number(v.v) : v.t === "string" || v.t === "boolean" ? v.v : null);
    const choices = s.enum.map((e) => ({ value: JSON.stringify(e), label: typeof e === "string" ? e : JSON.stringify(e) }));
    const options = [
      ...(choices.some((c) => c.value === current) ? [] : [{ value: current, label: current }]),
      ...choices,
    ].map((c) => ({ ...c, selected: c.value === current }));
    return field({ ...shared, name: `j${p}`, type: "select", options, ...(off ? { disabled: true } : {}) });
  }
  if (v.t === "boolean")
    return field({ ...shared, name: `v${p}`, type: "checkbox", value: "true", checked: v.v, ...(off ? { disabled: true } : {}) });
  if (v.t === "null") return field({ ...shared, name: `v${p}`, value: "null", readonly: true, mono: true });
  if (v.t === "number")
    return field({
      ...shared,
      name: `v${p}`,
      type: off ? "text" : "number",
      value: o.typed?.get(p) ?? v.v,
      mono: true,
      step: typeList(s).includes("integer") ? "1" : "any",
      ...(typeof s?.minimum === "number" ? { min: s.minimum } : {}),
      ...(typeof s?.maximum === "number" ? { max: s.maximum } : {}),
      ...(off ? { readonly: true } : { required: true }),
    });
      
        sentinelcrew
        17d ago
        outdated
      
      Design: this is a hand-rolled .btn. Use btn() from ui.ts, adding a formnovalidate option to it if needed, so buttons keep one source.
    
  const text = v.t === "string" ? v.v : "";
  return field({
    ...shared,
    name: `v${p}`,
    value: text,
    ...(text.includes("\n") ? { type: "textarea", rows: Math.min(12, text.split("\n").length + 1) } : {}),
    ...(typeof s?.pattern === "string" ? { pattern: s.pattern } : {}),
    ...(off ? { readonly: true } : f.required ? { required: true } : {}),
  });
}
function errorLine(p: string, id: string, o: FieldsOptions): Html | null {
  const message = o.errors?.get(p);
  return message === undefined ? null : html`<span class="error" id="${id}-err">${message}</span>`;
}
function hint(s: Schema | undefined, id: string): Html | null {
  return typeof s?.description === "string" && s.description !== ""
    ? html`<span class="hint" id="${id}-hint">${s.description}</span>`
    : null;
}
/** A structural button: it skips the browser's checks, since removing a card must not wait for a field in it. */
const opBtn = (label: string, op: Op, at: string, plus?: "plus" | "trash", key?: string): Html =>
  btn(label, {
    name: "op",
    value: opValue(op, at, key),
    size: "sm",
    variant: op === "remove" ? "ghost" : "outline",
    formnovalidate: true,
    ...(plus === undefined ? {} : { icon: plus }),
  });
      
        sentinelcrew
        17d ago
        outdated
      
      Design: field() owns .field / label / .hint / .error / data-invalid. Draw scalars through it, extending it for checkbox, select and number bounds, and do not re-create the markup here.
    
function node(v: Json, p: string, label: string, parentSchema: Schema | undefined, o: FieldsOptions): Html {
  const s = schemaAt(o.found, p);
  const id = `cf-${++fieldSerial}`;
  const title = typeof s?.title === "string" && s.title !== "" ? s.title : label;
  const required = Array.isArray(parentSchema?.required) && parentSchema.required.includes(label);
  const errored = o.errors?.has(p) === true;
  if (v.t === "object") {
    const body = objectBody(v, p, s, o);
    if (p === "") return body;
    return html`<fieldset class="field config-group" ${errored ? raw("data-invalid") : null}>
      <legend>${title}</legend>${hint(s, id)}${errorLine(p, id, o)}${body}
    </fieldset>`;
  }
  if (v.t === "array") {
    const cards = v.items.length > 0 ? !v.items.every(isScalar) : ["object", "array"].includes(typeList(s?.items)[0] ?? "");
    return html`<fieldset class="field config-group" ${errored ? raw("data-invalid") : null}>
      <legend>${title} <span class="muted small num">${v.items.length}</span></legend>
      ${hint(s, id)}${errorLine(p, id, o)}
      ${cards ? cardList(v, p, title, o) : chipList(v, p, s, o)}
      ${when(o.readonly !== true, () => html`<div class="form-actions">${opBtn(cards ? `Add ${title}` : "Add", "add", p, "plus")}</div>`)}
    </fieldset>`;
  }
  return scalarField(v, p, s, o, { label: title, required });
}
function objectBody(v: Extract<Json, { t: "object" }>, p: string, s: Schema | undefined, o: FieldsOptions): Html {
  const present = new Set(v.entries.map(([k]) => k));
  const missing = Object.keys(s?.properties ?? {}).filter((k) => !present.has(k));
  return html`${v.entries.map(([k, x]) => node(x, pointer(p, k), k, s, o))}
  ${when(
    o.readonly !== true && missing.length > 0,
    () => html`<div class="form-actions">${missing.map((k) => opBtn(k, "key", p, "plus", k))}</div>`,
  )}`;
}
function chipList(v: Extract<Json, { t: "array" }>, p: string, s: Schema | undefined, o: FieldsOptions): Html {
  if (v.items.length === 0) return html`<p class="muted small">Empty.</p>`;
  return html`<ul class="config-chips">
    ${v.items.map((x, i) => {
      const at = pointer(p, i);
      return html`<li>${scalarField(x, at, s?.items, o, {
        label: `${labelOf(p)} ${i + 1}`,
        required: false,
        labelHidden: true,
        after: o.readonly === true ? null : opBtn("Remove", "remove", at),
      })}</li>`;
    })}
  </ul>`;
}
function cardList(v: Extract<Json, { t: "array" }>, p: string, title: string, o: FieldsOptions): Html {
  return html`${v.items.map((x, i) => {
    const at = pointer(p, i);
    const last = v.items.length - 1;
    return html`<div class="card config-card">
      <div class="bar">
        <strong>${title} ${i + 1}</strong><span class="spacer"></span>
        ${when(o.readonly !== true, () => html`${i > 0 ? opBtn("Up", "up", at) : null}${i < last ? opBtn("Down", "down", at) : null}${opBtn("Remove", "remove", at, "trash")}`)}
      </div>
      ${x.t === "object" ? objectBody(x, at, schemaAt(o.found, at), o) : node(x, at, `${title} ${i + 1}`, undefined, o)}
    </div>`;
  })}`;
}
/** Every field of `doc`, drawn as `o` says. */
export function configFields(doc: Json, o: FieldsOptions = {}): Html {
  fieldSerial = 0;
  if (doc.t !== "object" && doc.t !== "array") return node(doc, "", "value", undefined, o);
  return node(doc, "", "", undefined, o);
}
@@ -0,0 +1,62 @@
/**
 * A JSON config file on the blob page: its values as a form, read-only, with
 * "Edit as form" one click away (`pages/config.ts` is the editor, and draws
 * the schema the file names). A file that is not valid JSON says why, at
 * which line, above its text; Source keeps its highlighted view.
 */
import { html, type Html } from "../html.ts";
import { btn } from "../ui.ts";
import { configFields, countFields, MAX_FIELDS } from "./config-form.ts";
import { parseJson } from "./json-doc.ts";
import type { Rendered, RenderInput } from "./renderers.ts";
/** Only JSON draws as a form; YAML, TOML and the rest keep their source. */
export const isFormJson = (path: string): boolean => /\.json$/i.test(path);
/**
 * `/:owner/:name/media/:ref/*path` → `/:owner/:name/config/:ref/*path`: the
 * ref is encoded whole, so the last `/media/` before it is the route's. A
 * mirror's pages (`/origins/…`) edit through the source editor instead.
 */
function editHref(input: RenderInput): string | undefined {
  const head = input.media.slice(0, input.media.length - input.path.length - 1);
  const cut = head.lastIndexOf("/media/");
  if (cut < 0 || head.startsWith("/origins/")) return undefined;
  return `${head.slice(0, cut)}/config/${head.slice(cut + "/media/".length)}/${input.path}`;
}
function brokenJson(text: string, line: number, column: number, message: string): Html {
  const lines = text.split("\n");
  return html`<div class="card" role="alert">
      <p><strong>Not valid JSON:</strong> ${message} at line ${String(line)}, column ${String(column)}.</p>
      <p class="muted small">The form needs valid JSON. Source shows the file highlighted.</p>
    </div>
    <pre class="card mono">${lines.map((l, i) => (i + 1 === line ? html`<mark>${l}</mark>\n` : `${l}\n`))}</pre>`;
}
export function config(input: RenderInput): Rendered {
  const text = new TextDecoder().decode(input.body);
  const lines = text === "" ? 0 : text.replace(/\n$/, "").split("\n").length;
  const parsed = parseJson(text);
  if (!parsed.ok) {
    const e = parsed.error;
    return { lines, content: brokenJson(text, e.line, e.column, e.message) };
  }
  if (countFields(parsed.value) > MAX_FIELDS)
    return {
      lines,
      content: html`<div class="card"><p class="muted">This file has more than ${MAX_FIELDS.toLocaleString()} values, too many for a form. Source shows it whole.</p></div>`,
    };
  const edit = editHref(input);
  return {
    lines,
    content: html`<div class="card config-form">
      <div class="bar mb">
        <span class="muted small">Settings in this file</span><span class="spacer"></span>
        ${edit === undefined ? null : btn("Edit as form", { href: edit, size: "sm", variant: "outline", icon: "pencil" })}
      </div>
      ${configFields(parsed.value, { readonly: true })}
    </div>`,
  };
}
@@ -0,0 +1,346 @@
/**
 * A JSON document as the config form holds it: ordered, exact, and written
 * back in the file's own style.
 *
 * `JSON.parse` loses two things the form must keep: the order of keys that
 * look like integers (an object puts those first) and the spelling of a
 * number (`1.0` comes back `1`). So a document is parsed here into plain
 * data — objects as ordered entries, numbers as their source text — and a
 * parse error names its line and column, which `JSON.parse` does not.
 *
 * Plain data in, plain data out; nothing here knows about HTML.
 */
export type Json =
  | { readonly t: "string"; readonly v: string }
  /** The number's own text, so `1.0` stays `1.0`. */
  | { readonly t: "number"; readonly v: string }
  | { readonly t: "boolean"; readonly v: boolean }
  | { readonly t: "null" }
  | { readonly t: "array"; readonly items: readonly Json[] }
  | { readonly t: "object"; readonly entries: readonly (readonly [string, Json])[] };
export interface ParseError {
  readonly message: string;
  readonly line: number;
  readonly column: number;
}
export type Parsed =
  | { readonly ok: true; readonly value: Json }
  | { readonly ok: false; readonly error: ParseError };
/** Deeper than this is not a config file a person edits in a form. */
const MAX_DEPTH = 64;
export const NUMBER = /^-?(?:0|[1-9]\d*)(?:\.\d+)?(?:[eE][+-]?\d+)?$/;
class Stop extends Error {
  constructor(
    message: string,
    readonly at: number,
  ) {
    super(message);
  }
}
/** Parse strict JSON (RFC 8259) into a `Json`, or say where it went wrong. */
export function parseJson(text: string): Parsed {
  let i = 0;
  const ws = (): void => {
    while (i < text.length && " \t\n\r".includes(text[i]!)) i++;
  };
  const fail = (message: string): never => {
    throw new Stop(message, i);
  };
  const expect = (word: string): void => {
    if (text.startsWith(word, i)) i += word.length;
    else fail(`Expected ${word}`);
  };
  const str = (): string => {
    i++; // the opening quote
    let out = "";
    for (;;) {
      if (i >= text.length) fail("Unterminated string");
      const c = text[i]!;
      if (c === '"') {
        i++;
        return out;
      }
      if (c === "\\") {
        const e = text[i + 1];
        const simple: Record<string, string> = { '"': '"', "\\": "\\", "/": "/", b: "\b", f: "\f", n: "\n", r: "\r", t: "\t" };
        if (e !== undefined && simple[e] !== undefined) {
          out += simple[e];
          i += 2;
        } else if (e === "u" && /^[0-9a-fA-F]{4}$/.test(text.slice(i + 2, i + 6))) {
          out += String.fromCharCode(parseInt(text.slice(i + 2, i + 6), 16));
          i += 6;
        } else fail("Bad escape in string");
        continue;
      }
      if (c.charCodeAt(0) < 0x20) fail("Control character in string");
      out += c;
      i++;
    }
  };
  const value = (depth: number): Json => {
    if (depth > MAX_DEPTH) fail("Nested too deeply");
    ws();
    const c = text[i];
    if (c === "{") {
      i++;
      const entries: [string, Json][] = [];
      const seen = new Set<string>();
      ws();
      if (text[i] === "}") {
        i++;
        return { t: "object", entries };
      }
      for (;;) {
        ws();
        if (text[i] !== '"') fail("Expected a key in quotes");
        const keyAt = i;
        const key = str();
        if (seen.has(key)) throw new Stop(`Duplicate key "${key}"`, keyAt);
        seen.add(key);
        ws();
        expect(":");
        entries.push([key, value(depth + 1)]);
        ws();
        if (text[i] === ",") i++;
        else if (text[i] === "}") {
          i++;
          return { t: "object", entries };
        } else fail("Expected , or }");
      }
    }
    if (c === "[") {
      i++;
      const items: Json[] = [];
      ws();
      if (text[i] === "]") {
        i++;
        return { t: "array", items };
      }
      for (;;) {
        items.push(value(depth + 1));
        ws();
        if (text[i] === ",") i++;
        else if (text[i] === "]") {
          i++;
          return { t: "array", items };
        } else fail("Expected , or ]");
      }
    }
    if (c === '"') return { t: "string", v: str() };
    if (c === "t") return expect("true"), { t: "boolean", v: true };
    if (c === "f") return expect("false"), { t: "boolean", v: false };
    if (c === "n") return expect("null"), { t: "null" };
    const m = /^-?(?:0|[1-9]\d*)(?:\.\d+)?(?:[eE][+-]?\d+)?/.exec(text.slice(i, i + 400));
    if (m === null || m[0] === "" || m[0] === "-") return fail(c === undefined ? "Unexpected end of file" : `Unexpected ${JSON.stringify(c)}`);
    i += m[0].length;
    return { t: "number", v: m[0] };
  };
  try {
    // A byte-order mark is not JSON, but editors write one.
    if (text.charCodeAt(0) === 0xfeff) i = 1;
    const v = value(0);
    ws();
    if (i < text.length) fail("Unexpected text after the value");
    return { ok: true, value: v };
  } catch (e) {
    if (!(e instanceof Stop)) throw e;
    const before = text.slice(0, e.at);
    const line = before.split("\n").length;
    return {
      ok: false,
      error: { message: e.message, line, column: e.at - before.lastIndexOf("\n") },
    };
  }
}
/** How a file lays itself out, so a save writes it back the same way. */
export interface Style {
  /** "" for a one-line file; else the indent unit (spaces or a tab). */
  readonly indent: string;
  readonly eol: "\n" | "\r\n";
  readonly finalNewline: boolean;
}
export function detectStyle(text: string): Style {
  const eol = text.includes("\r\n") ? "\r\n" : "\n";
  const body = text.replace(/\s+$/, "");
  const indented = /\n([ \t]+)\S/.exec(body);
  return {
    indent: !body.includes("\n") ? "" : (indented?.[1] ?? "  "),
    eol,
    finalNewline: /\n$/.test(text),
  };
}
/** The document as text, in `style`: arrays and objects open one per line. */
export function stringify(doc: Json, style: Style = { indent: "", eol: "\n", finalNewline: false }): string {
  const nl = style.indent === "" ? "" : style.eol;
  const colon = style.indent === "" ? ":" : ": ";
  const write = (v: Json, pad: string): string => {
    const inner = pad + style.indent;
    switch (v.t) {
      case "string":
        return JSON.stringify(v.v);
      case "number":
        return v.v;
      case "boolean":
        return v.v ? "true" : "false";
      case "null":
        return "null";
      case "array":
        if (v.items.length === 0) return "[]";
        return `[${nl}${v.items.map((x) => inner + write(x, inner)).join(`,${nl}`)}${nl}${pad}]`;
      case "object":
        if (v.entries.length === 0) return "{}";
        return `{${nl}${v.entries
          .map(([k, x]) => `${inner}${JSON.stringify(k)}${colon}${write(x, inner)}`)
          .join(`,${nl}`)}${nl}${pad}}`;
    }
  };
  return write(doc, "") + (style.finalNewline ? style.eol : "");
}
/** Whether two documents say the same thing, key order included. */
export const sameDoc = (a: Json, b: Json): boolean => stringify(a) === stringify(b);
// ---- pointers (RFC 6901), the form's field names ----
export const pointer = (parent: string, key: string | number): string =>
  `${parent}/${String(key).replace(/~/g, "~0").replace(/\//g, "~1")}`;
export function splitPointer(p: string): string[] | undefined {
  if (p === "") return [];
  if (!p.startsWith("/")) return undefined;
  return p
    .slice(1)
    .split("/")
    .map((s) => s.replace(/~1/g, "/").replace(/~0/g, "~"));
}
/** The value at `p`, if there is one. */
export function getAt(doc: Json, p: string): Json | undefined {
  const parts = splitPointer(p);
  if (parts === undefined) return undefined;
  let at: Json | undefined = doc;
  for (const part of parts) {
    if (at === undefined) return undefined;
    if (at.t === "object") at = at.entries.find(([k]) => k === part)?.[1];
    else if (at.t === "array" && /^(0|[1-9]\d*)$/.test(part)) at = at.items[Number(part)];
    else return undefined;
  }
  return at;
}
/**
 * A copy of `doc` with the value at `p` replaced by `change(old)`. A path
 * that names nothing leaves the document as it was.
 */
export function updateAt(doc: Json, p: string, change: (old: Json) => Json): Json {
  const parts = splitPointer(p);
  if (parts === undefined) return doc;
  const walk = (at: Json, rest: string[]): Json => {
    const [head, ...tail] = rest;
    if (head === undefined) return change(at);
    if (at.t === "object") {
      if (!at.entries.some(([k]) => k === head)) return at;
      return { t: "object", entries: at.entries.map(([k, v]) => [k, k === head ? walk(v, tail) : v] as const) };
    }
    if (at.t === "array" && /^(0|[1-9]\d*)$/.test(head)) {
      const n = Number(head);
      if (n >= at.items.length) return at;
      return { t: "array", items: at.items.map((v, j) => (j === n ? walk(v, tail) : v)) };
    }
    return at;
  };
  return walk(doc, parts);
}
/** An empty value shaped like `like`: what a new card or chip starts as. */
export function blankLike(like: Json | undefined): Json {
  if (like === undefined) return { t: "string", v: "" };
  switch (like.t) {
    case "string":
      return { t: "string", v: "" };
    case "number":
      return { t: "number", v: "0" };
    case "boolean":
      return { t: "boolean", v: false };
    case "null":
      return { t: "null" };
    case "array":
      return { t: "array", items: [] };
    case "object":
      return { t: "object", entries: like.entries.map(([k, v]) => [k, blankLike(v)] as const) };
  }
}
/** From a value `JSON.parse` made (a schema's default, an enum member). */
export function fromPlain(v: unknown): Json {
  if (typeof v === "string") return { t: "string", v };
  if (typeof v === "number" && Number.isFinite(v)) return { t: "number", v: String(v) };
  if (typeof v === "boolean") return { t: "boolean", v };
  if (Array.isArray(v)) return { t: "array", items: v.map(fromPlain) };
  if (v !== null && typeof v === "object")
    return { t: "object", entries: Object.entries(v).map(([k, x]) => [k, fromPlain(x)] as const) };
  return { t: "null" };
}
/** Lines of `before` and `after` as a unified-style list, unchanged runs trimmed to context. */
export interface DiffLine {
  readonly op: " " | "-" | "+";
  readonly text: string;
}
/** Past this many changed lines each side, the diff shows the whole swap. */
const DIFF_LCS_MAX = 1_000;
export function lineDiff(before: string, after: string, context = 3): DiffLine[] {
  const a = before.split("\n");
  const b = after.split("\n");
  let start = 0;
  while (start < a.length && start < b.length && a[start] === b[start]) start++;
  let endA = a.length;
  let endB = b.length;
  while (endA > start && endB > start && a[endA - 1] === b[endB - 1]) endA--, endB--;
  const midA = a.slice(start, endA);
  const midB = b.slice(start, endB);
  const mid: DiffLine[] = [];
  if (midA.length > DIFF_LCS_MAX || midB.length > DIFF_LCS_MAX) {
    for (const t of midA) mid.push({ op: "-", text: t });
    for (const t of midB) mid.push({ op: "+", text: t });
  } else {
    // Longest common subsequence, then walked forwards.
    const n = midA.length;
    const m = midB.length;
    const lcs: Uint32Array[] = Array.from({ length: n + 1 }, () => new Uint32Array(m + 1));
    for (let x = n - 1; x >= 0; x--)
      for (let y = m - 1; y >= 0; y--)
        lcs[x]![y] = midA[x] === midB[y] ? lcs[x + 1]![y + 1]! + 1 : Math.max(lcs[x + 1]![y]!, lcs[x]![y + 1]!);
    let x = 0;
    let y = 0;
    while (x < n || y < m) {
      if (x < n && y < m && midA[x] === midB[y]) mid.push({ op: " ", text: midA[x++]! }), y++;
      else if (y < m && (x === n || lcs[x]![y + 1]! >= lcs[x + 1]![y]!)) mid.push({ op: "+", text: midB[y++]! });
      else mid.push({ op: "-", text: midA[x++]! });
    }
  }
  const all: DiffLine[] = [
    ...a.slice(0, start).map((text) => ({ op: " " as const, text })),
    ...mid,
    ...a.slice(endA).map((text) => ({ op: " " as const, text })),
  ];
  // Keep only the context around a change.
  const near = all.map(() => false);
  all.forEach((l, k) => {
    if (l.op === " ") return;
    for (let j = Math.max(0, k - context); j <= Math.min(all.length - 1, k + context); j++) near[j] = true;
  });
  return all.filter((_, k) => near[k]);
}
@@ -0,0 +1,242 @@
/**
 * The part of JSON Schema the config form uses: which fields there are, what
 * type each holds, the choices an enum allows, the help text, and the bounds
 * a save is checked against. Anything else in a schema is ignored, never an
 * error: a schema written for another tool still draws a better form.
 *
 * Where the schema comes from, first found wins (`findSchema`):
 *   1. `$schema` in the file, when it is a path in the repository;
 *   2. a sibling `<name>.schema.json`;
 *   3. `.forge/schemas.json`, an object mapping globs to schema paths.
 *
 * `pattern` is drawn as the input's own `pattern` attribute, checked in the
 * browser; the server never runs a regular expression a repository wrote.
 */
import { NUMBER, getAt, parseJson, pointer, splitPointer, type Json } from "./json-doc.ts";
export interface Schema {
  readonly type?: string | readonly string[];
  readonly title?: string;
  readonly description?: string;
  readonly properties?: Readonly<Record<string, Schema>>;
  readonly items?: Schema;
  readonly required?: readonly string[];
  readonly enum?: readonly unknown[];
  readonly minimum?: number;
  readonly maximum?: number;
  readonly pattern?: string;
  readonly default?: unknown;
  readonly $ref?: string;
}
/** A schema with the document it came from, for `$ref` inside it. */
export interface FoundSchema {
  readonly root: Schema;
  /** The repository path it was read from. */
  readonly from: string;
}
const isObject = (v: unknown): v is Record<string, unknown> =>
  v !== null && typeof v === "object" && !Array.isArray(v);
/** A schema file's text as a `Schema`, or undefined when it is not one. */
export function parseSchema(text: string): Schema | undefined {
  try {
    const v: unknown = JSON.parse(text);
    return isObject(v) ? (v as Schema) : undefined;
  } catch {
    return undefined;
  }
}
/** Follow a local `$ref` (`#/definitions/x`, `#/$defs/x`), a few hops at most. */
function deref(root: Schema, s: Schema | undefined): Schema | undefined {
  let at = s;
  for (let hops = 0; at?.$ref !== undefined && hops < 8; hops++) {
    if (!at.$ref.startsWith("#")) return at;
    let next: unknown = root;
    for (const part of splitPointer(at.$ref.slice(1)) ?? []) next = isObject(next) ? next[part] : undefined;
    at = isObject(next) ? (next as Schema) : undefined;
  }
  return isObject(at) ? at : undefined;
}
/** The schema that describes the value at pointer `p`, if the schema says. */
export function schemaAt(found: FoundSchema | undefined, p: string): Schema | undefined {
  if (found === undefined) return undefined;
  let at = deref(found.root, found.root);
  for (const part of splitPointer(p) ?? []) {
    if (at === undefined) return undefined;
    at = /^(0|[1-9]\d*)$/.test(part) && isObject(at.items)
      ? deref(found.root, at.items)
      : deref(found.root, isObject(at.properties) ? at.properties[part] : undefined);
  }
  return at;
}
const typeOf = (v: Json): string => (v.t === "number" && /^-?\d+$/.test(v.v) ? "integer" : v.t);
const typeAllows = (s: Schema, v: Json): boolean => {
  if (s.type === undefined) return true;
  const types = typeof s.type === "string" ? [s.type] : s.type;
  const t = typeOf(v);
  return types.includes(t) || (t === "integer" && types.includes("number"));
};
/** A JSON value as the plain value an enum lists, for comparing. */
const plain = (v: Json): unknown =>
  v.t === "number" ? Number(v.v) : v.t === "null" ? null : v.t === "string" || v.t === "boolean" ? v.v : undefined;
/**
 * What is wrong with `doc` by the schema, as messages keyed by pointer: a
 * field's own error sits under that field. Empty when the document passes.
 */
export function validate(doc: Json, found: FoundSchema | undefined): Map<string, string> {
  const errors = new Map<string, string>();
  if (found === undefined) return errors;
  const walk = (v: Json, s: Schema | undefined, p: string): void => {
    if (s === undefined) return;
    if (!typeAllows(s, v)) {
      errors.set(p, `Must be ${typeof s.type === "string" ? s.type : (s.type ?? []).join(" or ")}.`);
      return;
    }
    if (Array.isArray(s.enum) && !s.enum.some((e) => e === plain(v)))
      errors.set(p, `Must be one of ${s.enum.map((e) => JSON.stringify(e)).join(", ")}.`);
    if (v.t === "number") {
      const n = Number(v.v);
      if (typeof s.minimum === "number" && n < s.minimum) errors.set(p, `Must be at least ${s.minimum}.`);
      if (typeof s.maximum === "number" && n > s.maximum) errors.set(p, `Must be at most ${s.maximum}.`);
    }
    if (v.t === "object") {
      const missing = (Array.isArray(s.required) ? s.required : []).filter(
        (k) => typeof k === "string" && !v.entries.some(([key]) => key === k),
      );
      if (missing.length > 0) errors.set(p, `Needs ${missing.join(", ")}.`);
      for (const [k, x] of v.entries) walk(x, schemaAt(found, pointer(p, k)), pointer(p, k));
    }
    if (v.t === "array") v.items.forEach((x, i) => walk(x, schemaAt(found, `${p}/${i}`), `${p}/${i}`));
  };
  walk(doc, schemaAt(found, ""), "");
  return errors;
}
/** Whether a typed number is a number JSON can hold. */
export const isJsonNumber = (text: string): boolean => NUMBER.test(text);
// ---- finding the schema ----
/** `a/b/../c` → `a/c`; undefined when the path climbs out of the repository. */
export function normalizePath(path: string): string | undefined {
  const out: string[] = [];
  for (const part of path.split("/")) {
    if (part === "" || part === ".") continue;
    if (part === "..") {
      if (out.pop() === undefined) return undefined;
    } else out.push(part);
  }
  return out.length === 0 ? undefined : out.join("/");
}
/**
 * The classic wildcard walk: `many` matches any run of items, `one` any
 * single item. One restart point (the last `many`) makes it O(n·m) with no
 * backtracking blow-up, whatever the pattern.
 */
function wildcard<T>(pattern: readonly T[], subject: readonly T[], many: T, one: (p: T, s: T) => boolean): boolean {
  let p = 0;
  let s = 0;
  let star = -1;
  let resume = 0;
  while (s < subject.length) {
    if (p < pattern.length && pattern[p] !== many && one(pattern[p]!, subject[s]!)) {
      p++;
      
        sentinelcrew
        17d ago
        outdated
      
      High: ReDoS. A glob such as aa*a…b becomes ^.a.a.a…b$, which backtracks exponentially. With 12 repeats against a 34-character path it takes 1.7 s, and it runs synchronously on every GET/POST to /config for a matching file. The glob comes from .forge/schemas.json, which any repository owner writes. Replace the RegExp with a segment-wise wildcard match (O(n·m) with one backtrack point), and add a test with this glob that finishes in a few ms.
    
      s++;
    } else if (p < pattern.length && pattern[p] === many) {
      star = p++;
      resume = s;
    } else if (star >= 0) {
      p = star + 1;
      s = ++resume;
    } else return false;
  }
  while (p < pattern.length && pattern[p] === many) p++;
  return p === pattern.length;
}
/** One path segment against one glob segment: `*` any run, `?` one character. */
const segmentMatches = (glob: string, name: string): boolean =>
  wildcard([...glob.replace(/\*+/g, "*")], [...name], "*", (g, c) => g === "?" || g === c);
/**
 * A glob as a whole-path test, segment by segment: a `**` segment matches
 * any number of folders, `*` and `?` stay inside one. No regular expression
 * is built from a glob a repository wrote.
 */
export function globMatches(glob: string, path: string): boolean {
  const globParts = glob.replace(/^\/+/, "").split("/");
  const pathParts = path.replace(/^\/+/, "").split("/");
  return wildcard(globParts, pathParts, "**", segmentMatches);
}
const MAX_GLOBS = 200;
const MAX_GLOB = 200;
/** Where a schema for `path` might be, in the order they are tried. */
export async function findSchema(
  path: string,
      
        sentinelcrew
        17d ago
        outdated
      
      This is not linear: capping the glob at 200 characters still allows 66 .* in a row. Remove the comment along with the RegExp.
    
  doc: Json,
  read: (path: string) => Promise<string | undefined>,
): Promise<FoundSchema | undefined> {
  const dir = path.includes("/") ? path.slice(0, path.lastIndexOf("/") + 1) : "";
  const tryRead = async (candidate: string | undefined): Promise<FoundSchema | undefined> => {
    if (candidate === undefined || candidate === path) return undefined;
    const text = await read(candidate);
    const root = text === undefined ? undefined : parseSchema(text);
    return root === undefined ? undefined : { root, from: candidate };
  };
  const declared = doc.t === "object" ? getAt(doc, "/$schema") : undefined;
  if (declared?.t === "string" && !/^[a-z][a-z0-9+.-]*:/i.test(declared.v)) {
    const found = await tryRead(
      normalizePath(declared.v.startsWith("/") ? declared.v : dir + declared.v),
    );
    if (found !== undefined) return found;
  }
  const name = path.slice(dir.length).replace(/\.json$/i, "");
  const sibling = await tryRead(`${dir}${name}.schema.json`);
  if (sibling !== undefined) return sibling;
  const map = parseSchema((await read(".forge/schemas.json")) ?? "");
  if (map !== undefined) {
    // A bounded map of short globs, each matched in O(glob × path).
    for (const [glob, target] of Object.entries(map).slice(0, MAX_GLOBS)) {
      if (typeof target !== "string" || glob.length > MAX_GLOB || !globMatches(glob, path)) continue;
      const found = await tryRead(normalizePath(target));
      if (found !== undefined) return found;
    }
  }
  return undefined;
}
/**
 * Why a JSON file's new text breaks the schema it names, as one sentence, or
 * undefined when it keeps it (or is not JSON, or has no schema). The
 * terminal asks this before a commit, as the form does before a save.
 */
export async function schemaRefusal(
  path: string,
  text: string,
  read: (path: string) => Promise<string | undefined>,
): Promise<string | undefined> {
  if (!/\.json$/i.test(path)) return undefined;
  const parsed = parseJson(text);
  if (!parsed.ok) return undefined;
  const found = await findSchema(path, parsed.value, read);
  const errors = [...validate(parsed.value, found)];
  if (errors.length === 0) return undefined;
  const [at, message] = errors[0]!;
  const more = errors.length > 1 ? ` (and ${errors.length - 1} more)` : "";
  return `${path} breaks ${found!.from}: ${at === "" ? "the top level" : at} ${message.charAt(0).toLowerCase()}${message.slice(1)}${more}`;
}
@@ -7,6 +7,7 @@
import type { Html } from "../html.ts";
import type { Blob } from "../../view/source.ts";
import { audio } from "./audio.ts";
import { config, isFormJson } from "./config.ts";
import { csv } from "./csv.ts";
import { image } from "./image.ts";
import { claimedMedia, fileKind, HEAD_BYTES, NO_BYTES, RENDER_CAP, type FileKind } from "./kinds.ts";
@@ -49,6 +50,7 @@
export const RENDERERS: Partial<Readonly<Record<FileKind, Renderer>>> = {
  csv,
  audio,
  video,
  config,
};
/**
@@ -81,7 +83,9 @@
export function rendererFor(
        : claimedMedia(path)?.kind;
  if (kind === undefined || blob.size > RENDER_CAP[kind]) return undefined;
  if (blob.kind === "too_large" && !MEDIA_KINDS.has(kind)) return undefined;
  const render = renderers[kind];
  // A kind may draw only some of its files: `config` draws JSON as a form,
  // and leaves YAML and TOML their source.
  const render = kind === "config" && !isFormJson(path) ? undefined : renderers[kind];
  if (render === undefined) return undefined;
  return { render, body: blob.kind === "too_large" ? NO_BYTES : blob.body };
}
@@ -839,6 +839,18 @@
textarea.editor:focus-visible { outline: none; }
    #needs-you #asks-phone-more > .stack { margin-top: 0; }
  }
}
/* The config form (#7336): nested objects as quiet fieldsets, scalar
   arrays as a wrapping row of chips, object arrays as cards. */
.config-group { border-left: 2px solid var(--border); padding-left: 12px; }
.config-group > legend { font-weight: 600; margin-bottom: 8px; }
.config-card { padding: 12px; margin: 0 0 12px; }
.config-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.config-chips > li { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.config-chips .input { width: auto; min-width: 8rem; }
.config-chips .field { margin: 0; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.config-diff { overflow-x: auto; white-space: pre; padding: 12px; }
.config-diff > [data-op="add"] { background: var(--add-bg); color: var(--add-fg); }
.config-diff > [data-op="del"] { background: var(--del-bg); color: var(--del-fg); }
/* Reduced motion: the pulses hold still at a legible level, the scroll-tied
   fade stays at its resting width, and these transitions land at once. */
@media (prefers-reduced-motion: reduce) {
@@ -170,6 +170,9 @@
export interface BtnOptions {
   * opener handle back into this page. */
  external?: boolean;
  disabled?: boolean;
  /** A submit that skips the browser's checks: a structural step (add,
   * remove, go back) must not wait for a field to be filled in. */
  formnovalidate?: boolean;
  current?: boolean;
  /** A toggle: emits `aria-pressed` with its state. */
  pressed?: boolean;
@@ -206,6 +209,7 @@
export function btn(content: Html | string, o: BtnOptions = {}): Html {
    ${o.value !== undefined ? html`value="${o.value}"` : null}
    ${o.form ? html`form="${o.form}"` : null}
    ${o.disabled ? raw("disabled") : null}
    ${o.formnovalidate ? raw("formnovalidate") : null}
    ${btnAttrs(o)}
  >
    ${inner}
@@ -1137,6 +1141,20 @@
export interface FieldOptions {
  /** `false` for names and paths, which a spelling checker only underlines. */
  spellcheck?: boolean;
  id?: string;
  /** `type: "number"`'s bounds and step. */
  min?: number;
  max?: number;
  step?: string;
  /** `type: "checkbox"`: whether it is ticked; `value` is what it sends. */
  checked?: boolean;
  /** `type: "select"`: the choices, in order. */
  options?: readonly { value: string; label: string; selected?: boolean }[];
  /** Shown but not sent (a read-only view of a checkbox or a select). */
  disabled?: boolean;
  /** The label is for a screen reader only (a chip in a row of them). */
  labelHidden?: boolean;
  /** Drawn right after the control, before the hint: a chip's Remove. */
  after?: Html;
}
/** Label, control, hint and error, wired together with `aria-describedby`. */
@@ -1145,10 +1163,12 @@
export function field(o: FieldOptions): Html {
  const described = [o.hint ? `${id}-hint` : "", o.error ? `${id}-err` : ""]
    .filter(Boolean)
    .join(" ");
  const aria = html`${described !== "" ? html`aria-describedby="${described}"` : null}
  ${o.error ? raw('aria-invalid="true"') : null}
  ${o.disabled ? raw("disabled") : null}`;
  const shared = html`class="input${o.mono ? " mono" : ""}" id="${id}"
  name="${o.name}"
  ${described !== "" ? html`aria-describedby="${described}"` : null}
  ${o.error ? raw('aria-invalid="true"') : null}
  ${aria}
  ${o.required ? raw("required") : null}
  ${o.autofocus ? raw("autofocus") : null}
  ${o.readonly ? raw("readonly") : null}
@@ -1159,18 +1179,35 @@
export function field(o: FieldOptions): Html {
      ? html`<textarea ${shared} rows="${o.rows ?? 6}" data-grow>
${o.value ?? ""}</textarea
        >`
      : html`<input
          ${shared}
      : o.type === "select"
        ? html`<select ${shared}>
            ${(o.options ?? []).map(
              (c) => html`<option value="${c.value}" ${c.selected ? raw("selected") : null}>${c.label}</option>`,
            )}
          </select>`
        : html`<input
          ${o.type === "checkbox" ? html`id="${id}" name="${o.name}" ${aria}` : shared}
          type="${o.type ?? "text"}"
          value="${o.value ?? ""}"
          ${o.checked ? raw("checked") : null}
          ${o.autocomplete ? html`autocomplete="${o.autocomplete}"` : null}
          ${o.pattern ? html`pattern="${o.pattern}"` : null}
          ${o.minlength !== undefined ? html`minlength="${o.minlength}"` : null}
          ${o.maxlength !== undefined ? html`maxlength="${o.maxlength}"` : null}
          ${o.min !== undefined ? html`min="${String(o.min)}"` : null}
          ${o.max !== undefined ? html`max="${String(o.max)}"` : null}
          ${o.step !== undefined ? html`step="${o.step}"` : null}
        />`;
  const label =
    o.type === "checkbox"
      ? html`<label class="check">${control} ${o.label}</label>`
      : o.labelHidden
        ? html`<label for="${id}" class="sr-only">${o.label}</label>${control}`
        : html`<label for="${id}">${o.label}</label>
    ${control}`;
  return html`<div class="field" ${o.error ? raw("data-invalid") : null}>
    <label for="${id}">${o.label}</label>
    ${control}
    ${label}
    ${o.after ?? null}
    ${o.hint ? html`<span class="hint" id="${id}-hint">${o.hint}</span>` : null}
    ${o.error
      ? html`<span class="error" id="${id}-err">${o.error}</span>`
@@ -0,0 +1,451 @@
/**
 * Config files as a form (#7336): a JSON file's values as typed fields, a
 * schema's choices and bounds, and a save that writes the file back in its
 * own order and indent — committed by a writer, proposed by anyone else.
 */
import { afterAll, beforeAll, describe, expect, test } from "bun:test";
import { mkdtemp, rm } from "node:fs/promises";
import { tmpdir } from "node:os";
import { join } from "node:path";
import { createApp, type App } from "../src/app.ts";
import { commitToBranch, createRepo } from "../src/actions/repos.ts";
import { setRole } from "../src/actions/roles.ts";
import { createSession } from "../src/core/sessions.ts";
import { getRepo, updateRepoSettings } from "../src/core/repos.ts";
import { createAgent } from "../src/actions/crew.ts";
import { addTeamMember, createOrg, createTeam } from "../src/core/orgs.ts";
import { signUp } from "../src/actions/users.ts";
import { proposeEditText } from "../src/actions/propose_edit.ts";
import { fixtureSlot } from "./helpers/slot.ts";
import { listPulls } from "../src/core/pulls.ts";
import { repoDir } from "../src/git/repos.ts";
import { serve, type Servers } from "../src/http/server.ts";
import { localSource } from "../src/view/local.ts";
import { applyOp, configFields, opValue, readValues } from "../src/web/render/config-form.ts";
import { detectStyle, parseJson, sameDoc, stringify, type Json } from "../src/web/render/json-doc.ts";
import { findSchema, globMatches, validate } from "../src/web/render/json-schema.ts";
import { digestOf } from "../src/web/pages/config.ts";
import { seedAdmin } from "./helpers/admin.ts";
import { signUpProven } from "./helpers/verified.ts";
import { gitClientEnv } from "./helpers/git-client.ts";
import { quietLogs } from "./helpers/globals.ts";
quietLogs();
const doc = (text: string): Json => {
  const parsed = parseJson(text);
  if (!parsed.ok) throw new Error(parsed.error.message);
  return parsed.value;
};
describe("a JSON document, kept exact", () => {
  test("a round trip keeps key order, indent and the final newline", () => {
    for (const text of [
      '{\n  "b": 1,\n  "a": [\n    true,\n    null\n  ],\n  "2": "two",\n  "1": 1.0\n}\n',
      '{\n\t"z": {\n\t\t"y": []\n\t},\n\t"x": {}\n}',
      '{\r\n    "only": "four spaces"\r\n}\r\n',
      '{"compact":[1,2],"x":{"y":"z"}}',
    ])
      expect(stringify(doc(text), detectStyle(text))).toBe(text);
  });
  test("invalid JSON names its line and column", () => {
    const parsed = parseJson('{\n  "a": 1,\n  "b": ,\n}');
    expect(parsed.ok).toBe(false);
    if (!parsed.ok) expect(parsed.error).toMatchObject({ line: 3, column: 8 });
    expect(parseJson('{"a":1,"a":2}').ok).toBe(false);
  });
});
describe("fields inferred from the values", () => {
  const html = String(
    configFields(
      doc('{"name":"lamp","port":8080,"on":true,"gone":null,"db":{"host":"h"},"tags":["a","b"],"servers":[{"host":"x"},{"host":"y"}]}'),
    ),
  );
  test("each type gets its control", () => {
    expect(html).toMatch(/type="text"[^>]*value="lamp"|value="lamp"[^>]*type="text"/s);
    expect(html).toMatch(/name="v\/port"[^>]*type="number"/);
    expect(html).toMatch(/name="v\/on"[^>]*type="checkbox"\s*value="true"\s*checked/);
    expect(html).toMatch(/name="v\/gone"[^>]*readonly[^>]*value="null"/);
    expect(html).toMatch(/<fieldset class="field config-group"[^>]*>\s*<legend>db<\/legend>/);
    expect(html).toContain('class="config-chips"');
    expect(html).toContain('name="v/tags/1"');
    expect(html.match(/class="card config-card"/g)?.length).toBe(2);
    expect(html).toContain('name="v/servers/1/host"');
  });
  test("cards add, remove and move like the boards editor", () => {
    let d = doc('{"servers":[{"host":"x","port":1},{"host":"y","port":2}]}');
    d = applyOp(d, opValue("down", "/servers/0"));
    expect(stringify(d)).toBe('{"servers":[{"host":"y","port":2},{"host":"x","port":1}]}');
    d = applyOp(d, opValue("add", "/servers"));
    expect(stringify(d)).toBe('{"servers":[{"host":"y","port":2},{"host":"x","port":1},{"host":"","port":0}]}');
    d = applyOp(d, opValue("remove", "/servers/0"));
    d = applyOp(d, opValue("up", "/servers/1"));
    expect(stringify(d)).toBe('{"servers":[{"host":"","port":0},{"host":"x","port":1}]}');
    expect(stringify(applyOp(d, "not json"))).toBe(stringify(d));
  });
  test("the form's values write back by type, and a bad number is held, not saved", () => {
    const form: Record<string, string> = { "v/name": "lit", "v/port": "80x", "v/tags/0": "c" };
    const read = readValues(doc('{"name":"lamp","port":8080,"on":true,"tags":["a"]}'), (n) => form[n]);
    expect(stringify(read.doc)).toBe('{"name":"lit","port":8080,"on":false,"tags":["c"]}');
    expect(read.errors.get("/port")).toBe("Must be a number.");
    expect(read.typed.get("/port")).toBe("80x");
  });
});
describe("fields from a schema", () => {
  const schema = {
    root: {
      type: "object",
      required: ["mode", "port"],
      properties: {
        mode: { enum: ["dev", "prod"], description: "Where it runs." },
        port: { type: "integer", minimum: 1, maximum: 65535 },
        name: { type: "string", pattern: "^[a-z]+$" },
        extra: { type: "boolean" },
      },
    },
    from: "app.schema.json",
  };
  test("an enum is a select, a description is help, bounds are attributes", () => {
    const html = String(configFields(doc('{"mode":"dev","port":80,"name":"x"}'), { found: schema }));
    expect(html).toMatch(/<select class="input"[^>]*name="j\/mode"/);
    expect(html).toContain('<option value="&quot;prod&quot;"');
    // Every structural button skips the browser's checks, through btn().
    expect(html.match(/<button[^>]*>/g)!.every((b) => b.includes("formnovalidate"))).toBe(true);
    expect(html).toContain("Where it runs.");
    expect(html).toMatch(/min="1"[\s\S]*max="65535"/);
    expect(html).toContain('pattern="^[a-z]+$"');
    // A property the file lacks is one button away.
    expect(html).toMatch(/>extra\s*<\/button>/);
    // Help text is read with its field.
    expect(html).toMatch(/name="j\/mode"\s*aria-describedby="cf-\d+-hint"/);
  });
  test("required, minimum, maximum and enum are checked on the server too", () => {
    const errors = validate(doc('{"mode":"test","port":70000}'), schema);
    expect(errors.get("/mode")).toContain("one of");
    expect(errors.get("/port")).toBe("Must be at most 65535.");
    expect(validate(doc('{"port":1}'), schema).get("")).toBe("Needs mode.");
    expect(validate(doc('{"mode":"dev","port":1}'), schema).size).toBe(0);
  });
  test("found by $schema, then a sibling, then .forge/schemas.json", async () => {
    const files: Record<string, string> = {
      "conf/s.json": '{"title":"declared"}',
      "conf/app.schema.json": '{"title":"sibling"}',
      ".forge/schemas.json": '{"conf/**/*.json":"schemas/any.json"}',
      "schemas/any.json": '{"title":"mapped"}',
    };
    const read = async (p: string): Promise<string | undefined> => files[p];
    expect((await findSchema("conf/app.json", doc('{"$schema":"./s.json"}'), read))?.from).toBe("conf/s.json");
    expect((await findSchema("conf/app.json", doc("{}"), read))?.from).toBe("conf/app.schema.json");
    expect((await findSchema("conf/deep/x.json", doc("{}"), read))?.from).toBe("schemas/any.json");
    expect(await findSchema("other.json", doc('{"$schema":"https://x.dev/s.json"}'), read)).toBeUndefined();
    expect(globMatches("**/*.json", "a.json")).toBe(true);
    expect(globMatches("conf/**/*.json", "conf/a/b/c.json")).toBe(true);
    expect(globMatches("a?c.json", "abc.json")).toBe(true);
    expect(globMatches("*.json", "a/b.json")).toBe(false);
  });
});
test("a glob a repository wrote cannot stall the forge", () => {
  // As a regular expression this backtracked exponentially: 1.7 s at 30
  // characters of path, doubling every few more. The segment walk is
  // O(glob × path); the bound is only a hang guard.
  const t0 = performance.now();
  expect(globMatches("**a".repeat(66) + "b", `${"a".repeat(60)}.json`)).toBe(false);
  expect(globMatches("*a*a*a*a*a*a*a*a*a*a*a*a*b", `${"a".repeat(200)}.json`)).toBe(false);
  expect(performance.now() - t0).toBeLessThan(5_000);
});
describe("the config form on the web", () => {
  let dataDir: string;
  let app: App;
  let servers: Servers;
  let base = "";
  let origin = "";
  let alice = "";
  let kim = "";
  const SETTINGS = '{\n    "name": "lamp",\n    "port": 8080,\n    "tags": [\n        "a"\n    ]\n}\n';
  const get = (path: string, cookie = ""): Promise<Response> =>
    fetch(`${base}${path}`, { redirect: "manual", ...(cookie === "" ? {} : { headers: { cookie } }) });
  const post = (path: string, fields: Record<string, string>, cookie = ""): Promise<Response> =>
    fetch(`${base}${path}`, {
      method: "POST",
      headers: { origin, ...(cookie === "" ? {} : { cookie }) },
      body: new URLSearchParams(fields),
      redirect: "manual",
    });
  const fileAt = async (owner: string, name: string, ref: string, path: string): Promise<string | undefined> => {
    const repo = getRepo(app.db, owner, name)!;
    const blob = await localSource(app, repo, undefined).blob(ref, path);
    return blob.ok && blob.value.kind === "text" ? new TextDecoder().decode(blob.value.body) : undefined;
  };
  const commitCount = async (owner: string, name: string): Promise<number> => {
    const proc = Bun.spawn(["git", "rev-list", "--count", "main"], {
      cwd: repoDir(app.reposRoot, owner, name),
      env: gitClientEnv(),
      stdout: "pipe",
    });
    return Number((await new Response(proc.stdout).text()).trim());
  };
  const save = (repo: string, edited: string, cookie: string, before = SETTINGS): Promise<Response> =>
    post(`/alice/${repo}/config`, {
      ref: "main",
      path: "settings.json",
      base: digestOf(before),
      doc: edited,
      step: "save",
      message: "Port 9090",
    }, cookie);
  beforeAll(async () => {
    dataDir = await mkdtemp(join(tmpdir(), "forge-config-form-"));
    app = createApp({ dataDir, port: 0 });
    servers = await serve(app);
    base = servers.url;
    origin = new URL(base).origin;
    const a = await seedAdmin(app, { username: "alice", email: "[email protected]", password: "a-long-config-passphrase" });
    const k = await signUpProven(app, { username: "kim", email: "[email protected]", password: "a-long-config-passphrase" });
    if (!a.ok || !k.ok) throw new Error("signup failed");
    // A fork is a member's: a guest's proposal is refused before it starts.
    if (!setRole(app, a.value, "kim", "member").ok) throw new Error("role failed");
    alice = `forge_session=${createSession(app.db, a.value.id).token}`;
    kim = `forge_session=${createSession(app.db, k.value.id).token}`;
    for (const [name, visibility] of [["lamp", "public"], ["vault", "private"]] as const) {
      const made = await createRepo(app, a.value, { name, visibility });
      if (!made.ok) throw new Error("repo failed");
      await commitToBranch(app, a.value, made.value, {
        message: "first",
        files: [
          { path: "settings.json", content: SETTINGS },
          { path: "broken.json", content: '{\n  "a": 1,\n  oops\n}\n' },
        ],
      });
    }
  });
  afterAll(async () => {
    servers.stop();
    app.close();
    await rm(dataDir, { recursive: true, force: true });
  });
  test("the blob page draws a JSON file as a form, with Source and Edit as form one click away", async () => {
    const html = await (await get("/alice/lamp/blob/main/settings.json")).text();
    expect(html).toContain('class="card config-form"');
    expect(html).toContain("?view=source");
    expect(html).toContain('href="/alice/lamp/config/main/settings.json"');
    const source = await (await get("/alice/lamp/blob/main/settings.json?view=source")).text();
    expect(source).not.toContain('class="card config-form"');
  });
  test("the editor is a plain form that posts", async () => {
    const res = await get("/alice/lamp/config/main/settings.json", alice);
    expect(res.status).toBe(200);
    const html = await res.text();
    expect(html).toContain('action="/alice/lamp/config"');
    expect(html).toContain('name="v/port"');
    expect(html).toContain("Review changes");
    // A reader is offered the proposal, not the commit.
    expect(await (await get("/alice/lamp/config/main/settings.json", kim)).text()).toContain("Review and propose");
  });
  test("review shows the diff, and a no-op writes nothing", async () => {
    const fields = { ref: "main", path: "settings.json", base: digestOf(SETTINGS), doc: stringify(doc(SETTINGS)), from: "form", "v/name": "lamp", "v/port": "9090", "v/tags/0": "a", step: "review" };
    const review = await (await post("/alice/lamp/config", fields, alice)).text();
    expect(review).toContain('data-op="del">-     &quot;port&quot;: 8080,');
    expect(review).toContain('data-op="add">+     &quot;port&quot;: 9090,');
    expect(review).toContain("Commit to main");
    const before = await commitCount("alice", "lamp");
    const same = await (await post("/alice/lamp/config", { ...fields, "v/port": "8080" }, alice)).text();
    expect(same).toContain("Nothing changed");
    const again = await save("lamp", stringify(doc(SETTINGS)), alice);
    expect(again.status).toBe(200);
    expect(await commitCount("alice", "lamp")).toBe(before);
  });
  test("a writer's save makes one commit, in the file's own order and indent", async () => {
    const before = await commitCount("alice", "lamp");
    const res = await save("lamp", '{"name":"lamp","port":9090,"tags":["a"]}', alice);
    expect(res.status).toBe(303);
    expect(await commitCount("alice", "lamp")).toBe(before + 1);
    expect(await fileAt("alice", "lamp", "main", "settings.json")).toBe(SETTINGS.replace("8080", "9090"));
  });
  test("a save over a file that moved since it was opened is held", async () => {
    const res = await save("lamp", '{"name":"lamp","port":1,"tags":["a"]}', alice);
    expect(res.status).toBe(200);
    expect(await res.text()).toContain("changed on main since you opened it");
  });
  test("a reader's save opens a pull from their fork", async () => {
    const current = (await fileAt("alice", "lamp", "main", "settings.json"))!;
    const res = await save("lamp", '{"name":"kim","port":9090,"tags":["a"]}', kim, current);
    expect(res.status).toBe(303);
    const upstream = getRepo(app.db, "alice", "lamp")!;
    const pulls = listPulls(app.db, upstream.id, { state: "open" });
    expect(pulls.length).toBe(1);
    expect(res.headers.get("location")).toBe(`/alice/lamp/pulls/${pulls[0]!.number}`);
    expect(pulls[0]!.headRepoId).toBe(getRepo(app.db, "kim", "lamp")!.id);
    // Nothing landed on the branch the reader cannot push to.
    expect(await fileAt("alice", "lamp", "main", "settings.json")).toBe(current);
  });
  test("invalid JSON falls back to the source with the error and its line", async () => {
    const blob = await (await get("/alice/lamp/blob/main/broken.json")).text();
    expect(blob).toContain("Not valid JSON");
    expect(blob).toContain("at line 3, column 3");
    const res = await get("/alice/lamp/config/main/broken.json", alice);
    expect(res.status).toBe(303);
    expect(res.headers.get("location")).toContain("/alice/lamp/blob/main/broken.json?view=source");
  });
  test("a private repository's file is not editable signed out", async () => {
    expect((await get("/alice/vault/config/main/settings.json")).status).toBe(404);
    expect((await save("vault", '{"name":"x"}', "")).status).toBe(404);
    expect((await get("/alice/vault/config/main/settings.json", kim)).status).toBe(404);
    expect(await fileAt("alice", "vault", "main", "settings.json")).toBe(SETTINGS);
  });
  test("the hidden document is equal to the one drawn", () => {
    expect(sameDoc(doc(SETTINGS), doc(stringify(doc(SETTINGS))))).toBe(true);
  });
});
describe("who commits and who proposes", () => {
  let dataDir: string;
  let app: App;
  let servers: Servers;
  let base = "";
  let origin = "";
  const cookies: Record<string, string> = {};
  const SETTINGS = '{\n  "port": 8080,\n  "tags": [\n    "a"\n  ]\n}\n';
  const post = (path: string, fields: Record<string, string>, cookie: string): Promise<Response> =>
    fetch(`${base}${path}`, {
      method: "POST",
      headers: { origin, cookie },
      body: new URLSearchParams(fields),
      redirect: "manual",
    });
  const save = (repo: string, cookie: string): Promise<Response> =>
    post(`/${repo}/config`, {
      ref: "main",
      path: "settings.json",
      base: digestOf(SETTINGS),
      doc: '{"port":9090,"tags":["a"]}',
      step: "save",
      message: "Port 9090",
    }, cookie);
  const mainText = async (owner: string, name: string): Promise<string | undefined> => {
    const blob = await localSource(app, getRepo(app.db, owner, name)!, undefined).blob("main", "settings.json");
    return blob.ok && blob.value.kind === "text" ? new TextDecoder().decode(blob.value.body) : undefined;
  };
  const session = (id: string): string => `forge_session=${createSession(app.db, id).token}`;
  beforeAll(async () => {
    dataDir = await mkdtemp(join(tmpdir(), "forge-config-who-"));
    app = createApp({ dataDir, port: 0 });
    servers = await serve(app);
    base = servers.url;
    origin = new URL(base).origin;
    const a = await seedAdmin(app, { username: "alice", email: "[email protected]", password: "a-long-config-passphrase" });
    const dev = await signUpProven(app, { username: "dev", email: "[email protected]", password: "a-long-config-passphrase" });
    const gus = await signUpProven(app, { username: "gus", email: "[email protected]", password: "a-long-config-passphrase" });
    const una = await signUp(app, { username: "una", email: "[email protected]", password: "a-long-config-passphrase" }, { slot: fixtureSlot(app) });
    if (!a.ok || !dev.ok || !gus.ok || !una.ok) throw new Error("users failed");
    const agent = await createAgent(app, a.value, { username: "bot", brief: "Be brief." });
    if (!agent.ok) throw new Error(String(agent.error));
    const bot = { value: agent.value.user };
    for (const [name, user] of [["alice", a], ["dev", dev], ["gus", gus], ["una", una], ["bot", bot]] as const)
      cookies[name] = session(user.value.id);
    const org = createOrg(app.db, "acme", a.value.id);
    if (!org.ok) throw new Error("org failed");
    const writers = createTeam(app.db, org.value.id, "Writers", "write");
    if (!writers.ok) throw new Error("team failed");
    addTeamMember(app.db, writers.value, dev.value.id);
    // An agent with write access as a person would have it: on a write team.
    addTeamMember(app.db, writers.value, bot.value.id);
    for (const [owner, name] of [["alice", "lamp"], ["acme", "tower"], ["acme", "dock"]] as const) {
      const made = await createRepo(app, a.value, { owner, name, visibility: "public" });
      if (!made.ok) throw new Error(`repo failed: ${String(made.error)}`);
      await commitToBranch(app, a.value, made.value, { message: "first", files: [{ path: "settings.json", content: SETTINGS }] });
    }
    updateRepoSettings(app.db, getRepo(app.db, "acme", "tower")!, { protectDefault: true });
  });
  afterAll(async () => {
    servers.stop();
    app.close();
    await rm(dataDir, { recursive: true, force: true });
  });
  test("an agent with write access proposes, on a branch of the repository itself", async () => {
    const page = await (await fetch(`${base}/acme/dock/config/main/settings.json`, { headers: { cookie: cookies.bot! } })).text();
    expect(page).toContain("Review and propose");
    const res = await save("acme/dock", cookies.bot!);
    expect(res.status).toBe(303);
    const dock = getRepo(app.db, "acme", "dock")!;
    const pulls = listPulls(app.db, dock.id, { state: "open" });
    expect(pulls).toHaveLength(1);
    expect(pulls[0]!.headRepoId ?? dock.id).toBe(dock.id);
    expect(await mainText("acme", "dock")).toBe(SETTINGS);
    // A person on the same team, on the same unprotected branch, commits.
    const direct = await save("acme/dock", cookies.dev!);
    expect(direct.headers.get("location")).toBe("/acme/dock/blob/main/settings.json");
  });
  test("a writer who is not an admin, on a protected default, proposes inside the repository", async () => {
    const res = await save("acme/tower", cookies.dev!);
    expect(res.status).toBe(303);
    const tower = getRepo(app.db, "acme", "tower")!;
    const pulls = listPulls(app.db, tower.id, { state: "open" });
    expect(pulls).toHaveLength(1);
    expect(pulls[0]!.headRepoId ?? tower.id).toBe(tower.id);
    expect(getRepo(app.db, "dev", "tower")).toBeUndefined();
    expect(await mainText("acme", "tower")).toBe(SETTINGS);
  });
  test("a guest and an unconfirmed account hear why their proposal could not be made", async () => {
    const guest = await (await save("alice/lamp", cookies.gus!)).text();
    expect(guest).toContain(proposeEditText({ step: "fork", reason: "not_member" }));
    const unconfirmed = await (await save("alice/lamp", cookies.una!)).text();
    expect(unconfirmed).toContain("Confirm your email first");
    expect(getRepo(app.db, "gus", "lamp")).toBeUndefined();
  });
  test("a signed-in stranger to a private repository gets 404 on the POST", async () => {
    const alice = getRepo(app.db, "alice", "lamp")!;
    updateRepoSettings(app.db, alice, { visibility: "private" });
    try {
      expect((await save("alice/lamp", cookies.gus!)).status).toBe(404);
    } finally {
      updateRepoSettings(app.db, getRepo(app.db, "alice", "lamp")!, { visibility: "public" });
    }
  });
  test("a card button posted as a form comes back with the change, and saves nothing", async () => {
    const form = (op: string, doc: string, values: Record<string, string>) =>
      post("/alice/lamp/config", { ref: "main", path: "settings.json", base: digestOf(SETTINGS), doc, from: "form", op, ...values }, cookies.alice!);
    const added = await (await form(opValue("add", "/tags"), '{"port":8080,"tags":["a"]}', { "v/port": "7", "v/tags/0": "a" })).text();
    expect(added).toContain('name="v/tags/1"');
    // The value typed beside the button rode along into the new form.
    expect(added).toMatch(/name="v\/port"[^>]*value="7"/);
    const removed = await (await form(opValue("remove", "/tags/0"), '{"port":8080,"tags":["a","b"]}', { "v/port": "8080", "v/tags/0": "a", "v/tags/1": "b" })).text();
    expect(removed).toMatch(/name="v\/tags\/0"[^>]*value="b"/);
    expect(removed).not.toContain('name="v/tags/1"');
    expect(await mainText("alice", "lamp")).toBe(SETTINGS);
  });
});
@@ -0,0 +1,157 @@
/**
 * The terminal's side of #7336: a reader of a forge repository proposes a
 * change from the workspace (a branch on their fork, a pull back), and a
 * commit that breaks a JSON file's schema is refused before it is written,
 * as the web form refuses it.
 */
import { afterAll, beforeAll, describe, expect, test } from "bun:test";
import { mkdtemp, rm } from "node:fs/promises";
import { tmpdir } from "node:os";
import { join } from "node:path";
import { commitToBranch, createRepo } from "../src/actions/repos.ts";
import { setRole } from "../src/actions/roles.ts";
import { createApp, type App as Forge } from "../src/app.ts";
import { getRepo } from "../src/core/repos.ts";
import { listPulls } from "../src/core/pulls.ts";
import type { User } from "../src/core/users.ts";
import { blobForRender } from "../src/git/read.ts";
import { createForgeApp } from "../src/tui/forge.ts";
import type { TuiIdentity } from "../src/tui/session.ts";
import { headlessTerminal } from "../src/tui/term/terminal.ts";
import { quietLogs } from "./helpers/globals.ts";
import { settleApp, settleUntil } from "./helpers/tui.ts";
import { seedAdmin } from "./helpers/admin.ts";
import { signUpProven } from "./helpers/verified.ts";
quietLogs();
const LIMITS = '{\n  "max": 5\n}\n';
describe("proposing and checking from the terminal", () => {
  let dataDir: string;
  let forge: Forge;
  let alice: User;
  let kim: User;
  const as = (user: User): TuiIdentity => ({
    sshUsername: user.username,
    remoteAddress: "127.0.0.1",
    fingerprint: "SHA256:test",
    user,
  });
  function boot(identity: TuiIdentity) {
    const terminal = headlessTerminal(120, 40);
    const { app } = createForgeApp(forge, identity, { terminal, exitHooks: false });
    app.start();
    const send = (key: string): void => {
      const ctrl = key.startsWith("ctrl+");
      app.dispatch({ type: "key", key: ctrl ? key.slice(5) : key, ctrl, alt: false, shift: false });
    };
    return {
      text: () => app.screen.toText(),
      async press(...keys: string[]) {
        for (const key of keys) send(key);
        await settleApp(app);
      },
      async type(text: string) {
        for (const ch of text) send(ch);
        await settleApp(app);
      },
      settle: () => settleApp(app),
      until: (what: string) => settleUntil(app, what),
      stop: () => app.stop(),
    };
  }
  type Harness = ReturnType<typeof boot>;
  async function openBeacon(h: Harness): Promise<void> {
    await h.settle();
    await h.press("/");
    await h.type("beacon");
    await h.press("enter");
    await h.press("enter");
    await h.until("alice/beacon");
  }
  async function openFile(h: Harness, query: string): Promise<void> {
    await h.press("t");
    await h.type(query);
    await h.press("enter");
  }
  const fileAt = async (owner: string, ref: string, path: string): Promise<string | undefined> => {
    const blob = await blobForRender(join(forge.reposRoot, owner, "beacon.git"), ref, path, 1 << 20);
    return blob.kind === "text" ? new TextDecoder().decode(blob.body) : undefined;
  };
  beforeAll(async () => {
    dataDir = await mkdtemp(join(tmpdir(), "forge-tui-propose-"));
    forge = createApp({ dataDir, port: 0 });
    const a = await seedAdmin(forge, { username: "alice", email: "[email protected]", password: "a-long-passphrase" });
    const k = await signUpProven(forge, { username: "kim", email: "[email protected]", password: "a-long-passphrase" });
    if (!a.ok || !k.ok) throw new Error("signup failed");
    alice = a.value;
    kim = k.value;
    if (!setRole(forge, alice, "kim", "member").ok) throw new Error("role failed");
    const made = await createRepo(forge, alice, { name: "beacon", visibility: "public" });
    if (!made.ok) throw new Error("repo failed");
    await commitToBranch(forge, alice, made.value, {
      message: "seed",
      files: [
        { path: "README.md", content: "# Beacon\n" },
        { path: "notes.txt", content: "a note\n" },
        { path: "limits.json", content: LIMITS },
        { path: "limits.schema.json", content: '{"properties":{"max":{"type":"integer","maximum":100}}}' },
      ],
    });
  });
  afterAll(async () => {
    forge.close();
    await rm(dataDir, { recursive: true, force: true });
  });
  test("a commit that breaks the file's schema is refused, and nothing lands", async () => {
    const h = boot(as(alice));
    try {
      await openBeacon(h);
      await openFile(h, "limitsjson");
      await h.press("e", "down", "end");
      await h.type("00");
      await h.press("esc", "c");
      await h.until("Commit limits.json");
      await h.press("ctrl+s");
      await h.until("breaks limits.schema.json");
      expect(h.text()).toContain("/max must be at most");
      expect(await fileAt("alice", "main", "limits.json")).toBe(LIMITS);
    } finally {
      h.stop();
    }
  });
  test("a reader proposes from the terminal: a branch on their fork and a pull back", async () => {
    const h = boot(as(kim));
    try {
      await openBeacon(h);
      await openFile(h, "notes");
      await h.press("e", "end");
      await h.type(" from kim");
      await h.press("esc", "c");
      await h.until("Propose a change");
      await h.press("ctrl+s");
      await h.until("opened pull #");
      const beacon = getRepo(forge.db, "alice", "beacon")!;
      const pulls = listPulls(forge.db, beacon.id, { state: "open" });
      expect(pulls).toHaveLength(1);
      const fork = getRepo(forge.db, "kim", "beacon")!;
      expect(pulls[0]!.headRepoId).toBe(fork.id);
      expect(await fileAt("kim", pulls[0]!.headBranch, "notes.txt")).toBe("a note from kim\n");
      // Nothing moved on the repository the reader cannot write.
      expect(await fileAt("alice", "main", "notes.txt")).toBe("a note\n");
    } finally {
      h.stop();
    }
  });
});
		@@ -436,6 +436,7 @@ This page is the front door. Everything else is a file of its own under
436	436	- [`docs/GIT.md`](docs/GIT.md) — cloning over HTTPS and SSH, and partial clones of big repositories.
437	437	- [`docs/features/csv-view.md`](docs/features/csv-view.md) — open a `.csv` or `.tsv` in the code view to read it as a table; `?all=1` draws more rows, `?view=source` shows the text. The terminal has its own table view for them (see the `.csv` paragraph above).
438	438	- [`docs/features/file-media.md`](docs/features/file-media.md) — a file in the browser: every file page has Raw and Download (any size), and `/:owner/:name/media/:ref/*path` serves images, audio, video and PDFs under their real type, sandboxed, with byte ranges.
	439	- [`docs/features/config-form.md`](docs/features/config-form.md) — a JSON file opens as a form: typed fields (from its schema when one is found), cards to add and reorder, and a save that commits for a writer or proposes a pull for anyone else. In the terminal, a reader edits in the workspace (`e`) and `c` proposes the change from their fork; any commit there that breaks a JSON file's schema is refused first.
439	440	- [`docs/ROLES.md`](docs/ROLES.md) — guest, member and admin, and what each may do.
440	441	- [`docs/MCP.md`](docs/MCP.md) — the forge as a connector; [`docs/STANDARDS.md`](docs/STANDARDS.md) is what it answers by default: `.well-known`, feeds, cards, the manifest.
441	442
		@@ -0,0 +1,11 @@
	1	# Config form
	2
	3	A JSON file edited as a form (`src/web/render/config-form.ts`, `src/web/pages/config.ts`, #7336). Styled in
	4	`style/content.ts`.
	5
	6	- `.config-form` — the card that holds the form, on the blob page (read-only) and on the editor page.
	7	- `.config-group` — a nested object or an array, as a `fieldset.field` with a thin rule down its left edge, so depth reads
	8	without boxes inside boxes.
	9	- `.config-card` — one item of an array of objects: a `.card` with its Up, Down and Remove buttons in a `.bar`.
	10	- `.config-chips` — an array of scalars: a wrapping row of small inputs, each with its Remove button.
	11	- `.config-diff` — the review step's change, one line per row, `data-op="add\|del\|same"` tinted with the diff tokens.
		@@ -7,9 +7,9 @@ specification.
7	7
8	8	\| component \| web class \| variants (`data-*`) \| states \| terminal equivalent \|
9	9	\| --------------------------------------------- \| ------------------------------------------------------------------------------------------------------ \| ---------------------------------------------------------------------------------------------------------------------------------------- \| -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- \| --------------------------------------------------------------------- \| ------ \| ------ \|
10		\| button `btn()` \| `.btn` \| `variant=primary\\|secondary\\|outline\\|ghost\\|danger\\|link`, `size=sm\\|lg` \| hover, active, `:focus-visible`, `[disabled]`, `[aria-busy]` \| a labelled key or a highlighted action cell \|
	10	\| button `btn()` \| `.btn` \| `variant=primary\\|secondary\\|outline\\|ghost\\|danger\\|link`, `size=sm\\|lg`, `formnovalidate` \| hover, active, `:focus-visible`, `[disabled]`, `[aria-busy]` \| a labelled key or a highlighted action cell \|
11	11	\| icon button `iconBtn()` \| `.btn.btn-icon` \| same \| `aria-label` required \| a single glyph with a status-bar hint \|
12		\| input / textarea / select `field()` \| `.input` \| `size=sm`, `[aria-invalid]` \| focus, `:user-invalid`, `[readonly]` \| a line editor with an inline error row \|
	12	\| input / textarea / select `field()` \| `.input` \| `size=sm`, `[aria-invalid]`, `type=select\\|checkbox\\|number` (`min`, `max`, `step`) \| focus, `:user-invalid`, `[readonly]` \| a line editor with an inline error row \|
13	13	\| form field `field()` \| `.field` (`label`, `.hint`, `.error`) \| `data-invalid` \| — \| label line, value line, hint line \|
14	14	\| checkbox \| `.check` \| — \| native, `accent-color` themed \| `[x]` / `[ ]` \|
15	15	\| badge `badge()` / `stateBadge()` \| `.badge` \| `variant=secondary\\|outline\\|success\\|danger\\|merged\\|attn`; `data-state=open\\|closed`, `data-pr=merged` \| — \| a bracketed word in the state color \|
		@@ -0,0 +1,77 @@
	1	# Config files as a form
	2
	3	A `.json` file in a repository opens as a form (#7336, part of #7329).
	4
	5	## Reading
	6
	7	The blob page's Rendered view draws the file's values as read-only
	8	fields. Source, Raw and Download are where they always are.
	9	A file that is not valid JSON says why, with the line and column, above
	10	its text. YAML, TOML and other config files keep their source view.
	11
	12	## Editing
	13
	14	Edit as form opens `/:owner/:name/config/:ref/*path`. You need to be
	15	signed in. A private repository's file is a 404 to anyone who cannot read it.
	16
	17	- Without a schema each value's type picks its control. A string is a text
	18	input, or a textarea when it has more than one line. A number is a number
	19	input and a boolean is a checkbox. `null` is shown as `null`. A nested
	20	object is a fieldset. An array of scalars is a row of chips, and an array
	21	of objects is a list of cards you can add, remove and move up or down.
	22	- With a schema the fields follow it. An `enum` becomes a select, and
	23	`description` becomes help text. `required`, `minimum`, `maximum` and
	24	`pattern` are set as the inputs' own attributes, so the browser checks
	25	them as you type. The server checks `required`, the bounds, `enum` and
	26	`type` again on save. It never runs a pattern the repository wrote.
	27	A glob in `.forge/schemas.json` is matched segment by segment in
	28	O(glob × path); no regular expression is built from it.
	29	Properties the schema names but the file does not have are offered as
	30	+ key buttons. Local `$ref`s (`#/definitions/…`, `#/$defs/…`) are
	31	followed.
	32	- Finding the schema. The first one found is used:
	33	1. `$schema` in the file, if it is a path. A path that starts with `/`
	34	is read from the repository root; any other path is read from the
	35	file's folder. A URL is ignored.
	36	2. A sibling `<name>.schema.json`.
	37	3. `.forge/schemas.json`, an object that maps globs to schema paths, for
	38	example `{ "config/*/.json": "schemas/config.json" }`.
	39
	40	## Saving
	41
	42	Review shows the change as a diff, under a commit message.
	43
	44	- A writer commits one commit to the branch.
	45	- Anyone else gets Propose change: one commit on a new branch and a
	46	pull request into the branch they were reading. That includes a reader,
	47	an agent, and a writer facing a protected default branch. A writer's
	48	branch goes in the repository itself. A reader's goes on their fork; the
	49	forge makes the fork if they have none, and the usual fork rules apply
	50	(`actions/propose_edit.ts`).
	51	- The file is written back with its own key order, indent (spaces or tabs),
	52	line endings and final newline. Numbers keep their spelling.
	53	- A save that changes nothing writes nothing.
	54	- If the file changed on the branch after you opened it, the save stops
	55	and asks you to review again.
	56
	57	All of this works without JavaScript, as plain form posts: each card button
	58	submits the form, and the form comes back with the change applied.
	59
	60	Files over 256 KB, or with more than 2,000 values, open in the source view
	61	and can be edited as text.
	62
	63	## In the terminal
	64
	65	The workspace is the terminal's editor. Open a repository, press `e` on a
	66	file, then `c`:
	67
	68	- A writer gets the commit dialog, as before.
	69	- A signed-in reader of a forge repository now gets Propose a change:
	70	`ctrl+s` puts the commit on a branch of their fork (made if needed) and
	71	opens a pull back. This is the same `proposeEdit` the web uses, with the
	72	same refusals in the same words. The status line says "proposes from your
	73	fork".
	74	- Before any commit or proposal, each JSON file in the change is checked
	75	against its schema (`schemaRefusal`, found the same three ways). A file
	76	that breaks it is refused in the dialog, naming the field and the schema,
	77	and nothing is written.
		@@ -0,0 +1,123 @@
	1	/**
	2	* Proposing a change to files: one commit on a new branch, and a pull that
	3	* asks for it. The shape every person who cannot (or should not) commit to
	4	* a branch gets, in one call.
	5	*
	6	* - A writer — an agent, or a person facing a protected branch — gets the
	7	* branch in the repository itself and a pull inside it.
	8	* - Anyone else who can read the repository gets it on their fork: the fork
	9	* they already have, or a new one (`forkRepo`, with its limits), and a
	10	* pull from that fork back to the branch they were reading.
	11	*
	12	* The commit lands on the fork's copy of `base`, so a fork far behind its
	13	* parent proposes against its own older snapshot; the pull's mergeability
	14	* says so, as it does for any fork's pull.
	15	*/
	16
	17	import type { App } from "../app.ts";
	18	import { canWrite, getForkOf, type Repo } from "../core/repos.ts";
	19	import type { Pull } from "../core/pulls.ts";
	20	import type { User } from "../core/users.ts";
	21	import { isSafeRef } from "../git/guard.ts";
	22	import { err, ok, type Result } from "../kernel/result.ts";
	23	import { requireParticipant } from "./access.ts";
	24	import { editFiles, type EditFile } from "./contents.ts";
	25	import { openPull } from "./pulls.ts";
	26	import { forkRepo } from "./repos.ts";
	27
	28	export interface ProposeEditInput {
	29	/** The branch the pull asks to change. */
	30	readonly base: string;
	31	readonly files: readonly EditFile[];
	32	readonly message: string;
	33	readonly title: string;
	34	readonly body?: string;
	35	/** The new branch's name; one is made up (`proposalBranch`) when absent. */
	36	readonly branch?: string;
	37	}
	38
	39	export interface Proposed {
	40	readonly pull: Pull;
	41	/** The repository the commit landed in: `repo` itself, or the actor's fork. */
	42	readonly head: Repo;
	43	readonly branch: string;
	44	}
	45
	46	/** A refusal, as the code a page turns into words. */
	47	export type ProposeEditError = { readonly step: "fork" \| "commit" \| "pull"; readonly reason: string };
	48
	49	/** `alice/edit-settings-lq3k2`: whose, what, and unique enough not to collide. */
	50	export function proposalBranch(username: string, path: string, now = Date.now()): string {
	51	const name = (path.split("/").pop() ?? "file")
	52	.replace(/\.[^.]*$/, "")
	53	.toLowerCase()
	54	.replace(/[^a-z0-9]+/g, "-")
	55	.replace(/^-+\|-+$/g, "")
	56	.slice(0, 40) \|\| "file";
	57	return `${username}/edit-${name}-${now.toString(36)}`;
	58	}
	59
	60	const reasonOf = (e: unknown): string =>
	61	typeof e === "string" ? e : typeof e === "object" && e !== null && "kind" in e ? String((e as { kind: unknown }).kind) : "refused";
	62
	63	export async function proposeEdit(
	64	app: App,
	65	actor: User \| undefined,
	66	repo: Repo,
	67	input: ProposeEditInput,
	68	): Promise<Result<Proposed, ProposeEditError>> {
	69	const user = requireParticipant(app, actor, repo);
	70	if (!user.ok) return err({ step: "fork", reason: user.error });
	71	if (!isSafeRef(input.base)) return err({ step: "commit", reason: "invalid_branch" });
	72
	73	let head = repo;
	74	if (!canWrite(app.db, repo, user.value)) {
	75	const mine = getForkOf(app.db, user.value.id, repo.id);
	76	if (mine !== undefined) head = mine;
	77	else {
	78	const forked = await forkRepo(app, user.value, repo);
	79	if (!forked.ok) return err({ step: "fork", reason: forked.error });
	80	head = forked.value;
	81	}
	82	}
	83
	84	const branch = input.branch?.trim() \|\| proposalBranch(user.value.username, input.files[0]?.path ?? "file");
		sentinelcrew 17d ago Non-blocking: a branch name the person picks in the terminal dialog that already exists on their fork ends as `branch_failed` ("It may already exist."). That is fine. A test of it would keep that wording honest.
	85	if (!isSafeRef(branch)) return err({ step: "commit", reason: "invalid_branch" });
	86	const written = await editFiles(app, user.value, head, {
	87	base: input.base,
	88	newBranch: branch,
	89	message: input.message,
	90	files: input.files,
	91	});
	92	if (!written.ok) return err({ step: "commit", reason: reasonOf(written.error) });
	93
	94	const pull = await openPull(app, user.value, repo, {
	95	title: input.title,
	96	body: input.body ?? "",
	97	baseBranch: input.base,
	98	headBranch: branch,
	99	...(head.id === repo.id ? {} : { headRepo: head }),
	100	});
	101	if (!pull.ok) return err({ step: "pull", reason: reasonOf(pull.error) });
	102	return ok({ pull: pull.value, head, branch });
	103	}
	104
	105	/** A refused proposal as the sentence the page and the terminal both show. */
	106	export function proposeEditText(error: ProposeEditError): string {
	107	const { step, reason } = error;
	108	if (step === "fork") {
	109	if (reason === "unverified")
	110	return "Confirm your email first: proposing a change makes a fork, and a fork needs a confirmed address.";
	111	if (reason === "not_member")
	112	return "Proposing a change makes a fork, and forks are for members of this forge. Ask its admin to make you one.";
	113	if (reason === "limit" \|\| reason === "repository_limit" \|\| reason === "storage_limit")
	114	return "You cannot make another fork right now, so this could not be proposed. Try again later.";
	115	if (reason === "not_found") return "That repository is not one you can read.";
	116	return "A fork to carry this change could not be made.";
	117	}
	118	if (step === "pull")
	119	return "The commit landed on a new branch, but the pull request could not be opened. Open it from the branch.";
	120	if (reason === "invalid_branch") return "That branch name is not one git will take.";
	121	if (reason === "branch_failed") return "That branch could not be created. It may already exist.";
	122	return "The change could not be committed, so nothing was proposed.";
	123	}
		@@ -222,6 +222,7 @@ import {
222	222	newFilePage,
223	223	previewSubmit,
224	224	} from "../web/pages/edit.ts";
	225	import { configPage, configSubmit } from "../web/pages/config.ts";
225	226	import { commitPage, commitsPage } from "../web/pages/commits.ts";
226	227	import {
227	228	issueCommentSubmit,
		@@ -1359,6 +1360,9 @@ export function buildRouter(): Router<Handler> {
1359	1360	// A mirror of a repository you cannot push to takes its edits as
1360	1361	// proposals: fork at the origin, commit there, open the pull upstream.
1361	1362	router.add("POST", "/:owner/:name/contribute", contributeSubmit);
	1363	// A JSON config file as a form: a writer commits, anyone else proposes.
	1364	router.add("GET", "/:owner/:name/config/:ref/*path", configPage);
	1365	router.add("POST", "/:owner/:name/config", configSubmit);
1362	1366
1363	1367	router.add("GET", "/:owner/:name/commits", commitsPage);
1364	1368	router.add("GET", "/:owner/:name/commit/:oid", commitPage);
		@@ -35,6 +35,8 @@
35	35	*/
36	36
37	37	import { editFiles } from "../../actions/contents.ts";
	38	import { proposeEdit, proposeEditText } from "../../actions/propose_edit.ts";
	39	import { schemaRefusal } from "../../web/render/json-schema.ts";
38	40	import { err, ok } from "../../kernel/result.ts";
39	41	import { createBranch } from "../../actions/branches.ts";
40	42	import { NAME_THE_BRANCH } from "../../actions/branch_words.ts";
		@@ -560,8 +562,15 @@ export function workspaceScreen(
560	562	/** Set when a change made here has to travel to another forge to land. */
561	563	const proposal = (): OriginTarget \| undefined =>
562	564	proposeTarget(src, canPushUpstream());
	565	/**
	566	* A forge repository you can read and not write: a change to it goes on
	567	* your fork, as a pull back here (`actions/propose_edit.ts`). A mirror
	568	* proposes through its origin instead (`proposal`).
	569	*/
	570	const forkable = (): boolean =>
	571	!writable() && repo !== undefined && repo.origin == null && f.user !== undefined && src.where.kind === "local";
563	572	/** Editing is allowed wherever the change has somewhere to go. */
564		const editable = (): boolean => writable() \|\| proposal() !== undefined;
	573	const editable = (): boolean => writable() \|\| proposal() !== undefined \|\| forkable();
565	574	const admin = (): boolean =>
566	575	repo !== undefined && canAdmin(f.db, repo, f.user);
567	576	const readPin = (): void => {
		@@ -842,9 +851,28 @@ export function workspaceScreen(
842	851
843	852	// ---- mutations ----
844	853
	854	/**
	855	* Why the change breaks a schema one of its JSON files names, or
	856	* undefined. The same check the web form makes before a save.
	857	*/
	858	const schemaCheck = async (
	859	files: readonly { path: string; content: Uint8Array \| null }[],
	860	): Promise<string \| undefined> => {
	861	const read = async (p: string): Promise<string \| undefined> => {
	862	const blob = await src.blob(ref, p);
	863	return blob.ok && blob.value.kind === "text" ? new TextDecoder().decode(blob.value.body) : undefined;
	864	};
	865	for (const file of files) {
	866	if (file.content === null) continue;
	867	const refused = await schemaRefusal(file.path, new TextDecoder().decode(file.content), read);
	868	if (refused !== undefined) return refused;
	869	}
	870	return undefined;
	871	};
	872
845	873	const commit = (): void => {
846	874	const target = proposal();
847		if (!writable() && target === undefined) {
	875	if (!writable() && target === undefined && !forkable()) {
848	876	readOnlyToast();
849	877	return;
850	878	}
		@@ -881,6 +909,10 @@ export function workspaceScreen(
881	909	proposeChange(target, files, subject, payload);
882	910	return;
883	911	}
	912	if (forkable() && repo !== undefined) {
	913	proposeHere(repo, files, subject, payload);
	914	return;
	915	}
884	916	if (repo === undefined) {
885	917	readOnlyToast();
886	918	return;
		@@ -896,6 +928,8 @@ export function workspaceScreen(
896	928	files,
897	929	defaultBranchName: suggestBranch(f, "edit", slug(first.path)),
898	930	commit: async (plan) => {
	931	const broken = await schemaCheck(payload(plan.paths));
	932	if (broken !== undefined) return err(broken);
899	933	const made = await editFiles(f.app, f.user, here, {
900	934	branch: ref,
901	935	base: ref,
		@@ -929,6 +963,68 @@ export function workspaceScreen(
929	963	);
930	964	};
931	965
	966	/**
	967	* The same dialog, for a forge repository you can only read: the commit
	968	* goes on a branch of your fork (made if you have none) and a pull asks
	969	* for it here — what the web's Propose change does.
	970	*/
	971	const proposeHere = (
	972	here: Repo,
	973	files: readonly CommitFile[],
	974	subject: string,
	975	payload: (paths: readonly string[]) => {
	976	path: string;
	977	content: Uint8Array \| null;
	978	}[],
	979	): void => {
	980	const first = files[0]!;
	981	const base = ref === "" ? here.defaultBranch : ref;
	982	const fullName = `${here.ownerName}/${here.name}`;
	983	ctx.push(
	984	commitScreen(f, ctx, screen, {
	985	repo: here,
	986	where: fullName,
	987	branch: ref,
	988	title: "Propose a change",
	989	subject,
	990	files,
	991	mode: "propose",
	992	upstream: { fullName, base },
	993	defaultBranchName: suggestBranch(f, "edit", slug(first.path)),
	994	commit: async (plan) => {
	995	const chosen = payload(plan.paths);
	996	const broken = await schemaCheck(chosen);
	997	if (broken !== undefined) return err(broken);
	998	const sent = await proposeEdit(f.app, f.user, here, {
	999	base,
	1000	files: chosen,
	1001	message: plan.message,
	1002	title: plan.pull?.title ?? subject,
	1003	...(plan.pull?.body === undefined ? {} : { body: plan.pull.body }),
	1004	...(plan.newBranch === undefined ? {} : { branch: plan.newBranch }),
	1005	});
	1006	if (!sent.ok) return err(proposeEditText(sent.error));
	1007	const pull = sent.value.pull;
	1008	return ok({
	1009	message: `opened pull #${pull.number} on ${fullName} from ${sent.value.head.ownerName}/${sent.value.head.name}`,
	1010	then: () => {
	1011	// The work lives on the fork and in the pull: the buffers go
	1012	// back to what this repository holds.
	1013	for (const t of tabs) {
	1014	t.creating = false;
	1015	t.editor = null;
	1016	t.mode = "view";
	1017	t.rebuild(ctx.theme.c);
	1018	}
	1019	pending.clear();
	1020	ctx.invalidate();
	1021	},
	1022	});
	1023	},
	1024	}),
	1025	);
	1026	};
	1027
932	1028	/**
933	1029	* The same dialog, aimed at somebody else's forge.
934	1030	*
		@@ -2325,7 +2421,9 @@ export function workspaceScreen(
2325	2421	? ""
2326	2422	: ` · ${tableProblem(t.table)}`
2327	2423	}`
2328		}${writable() \|\| target !== undefined ? "" : " · read only"}`;
	2424	}${
	2425	writable() \|\| target !== undefined ? "" : forkable() ? " · proposes from your fork" : " · read only"
	2426	}`;
2329	2427	if (tail === "") return;
2330	2428	const shown = truncate(tail, Math.max(0, r.w - 4));
2331	2429	s.text(
		@@ -0,0 +1,321 @@
	1	/**
	2	* Editing a JSON config file as a form (#7336).
	3	*
	4	* GET /:owner/:name/config/:ref/*path — the file's values as fields, typed
	5	* by its schema when one is found (`render/json-schema.ts`), else by
	6	* the values themselves.
	7	* POST /:owner/:name/config — one route, three steps:
	8	* `op` add, remove or reorder a card; the form comes back.
	9	* step=review the change as a diff, with a commit message.
	10	* step=save a writer commits to the branch; anyone else (a
	11	* reader, an agent, a writer facing a protected branch)
	12	* proposes it: one commit on a new branch and a pull
	13	* (`actions/propose_edit.ts`).
	14	*
	15	* The file is written back in its own key order and indent, and a save
	16	* that changes nothing writes nothing. Everything works as a plain form
	17	* POST; a browser with HTML validation checks a schema's bounds inline.
	18	* A file that is not valid JSON goes back to its source view, with the
	19	* error and its line.
	20	*/
	21
	22	import { editFiles } from "../../actions/contents.ts";
	23	import { proposeEdit, proposeEditText } from "../../actions/propose_edit.ts";
	24	import { canAdmin } from "../../core/repos.ts";
	25	import { isSafeRef, isSafeTreePath } from "../../git/guard.ts";
	26	import type { Ctx } from "../../http/context.ts";
	27	import { loadRepo, notFoundPage, pageHead, signInFirst } from "../chrome.ts";
	28	import { field as formValue, readForm, type Form } from "../form.ts";
	29	import { html, when, type Html } from "../html.ts";
	30	import { flashTo, page } from "../layout.ts";
	31	import { isFormJson } from "../render/config.ts";
	32	import { applyOp, configFields, countFields, MAX_FIELDS, readValues } from "../render/config-form.ts";
	33	import {
	34	detectStyle,
	35	lineDiff,
	36	parseJson,
	37	sameDoc,
	38	stringify,
	39	type Json,
	40	} from "../render/json-doc.ts";
	41	import { findSchema, validate, type FoundSchema } from "../render/json-schema.ts";
	42	import { localScope, type RepoScope } from "../scope.ts";
	43	import { btn, field, icon } from "../ui.ts";
	44	import { editErrorText } from "./edit.ts";
	45	import { refSetFrom } from "./refs.ts";
	46
	47	/** Bigger than this, the form is no help; the source editor is. */
	48	export const MAX_FORM_BYTES = 256 * 1024;
	49	/** A schema file larger than this is not read. */
	50	const MAX_SCHEMA_BYTES = 256 * 1024;
	51
	52	/** Names the file's text as it was opened, so a save sees whether it moved. */
	53	export const digestOf = (text: string): string => Bun.hash(text).toString(16);
	54
	55	const blobHref = (scope: RepoScope, ref: string, path: string, view = ""): string =>
	56	`${scope.base}/blob/${encodeURIComponent(ref)}/${path}${view}`;
	57
	58	/** Who this is to the file: commits straight on, or proposes. */
	59	async function commitsDirectly(ctx: Ctx, scope: RepoScope, ref: string): Promise<boolean> {
	60	const repo = scope.repo;
	61	const user = ctx.auth.user;
	62	if (repo === undefined \|\| user === undefined \|\| !scope.caps.write \|\| user.kind === "agent") return false;
		sentinelcrew 17d ago Nothing tests that an agent with write access proposes, or (line 65) that a non-admin writer on a protected default branch proposes on a branch in the repository itself. Add a test for each; deleting either condition today breaks no test.
	63	const refs = await refSetFrom(scope.source);
	64	if (!refs.branches.includes(ref)) return false;
	65	return !(ref === repo.defaultBranch && repo.protectDefault && !canAdmin(ctx.app.db, repo, user));
	66	}
	67
	68	/** The repository, the signed-in person, and a ref and path fit to edit; or the refusal. */
	69	function configContext(ctx: Ctx, ref: string, path: string): RepoScope \| Response {
	70	const repo = loadRepo(ctx);
	71	if (!repo) return notFoundPage(ctx);
	72	if (!ctx.auth.user) return signInFirst(ctx);
	73	if (!isSafeRef(ref) \|\| !isSafeTreePath(path) \|\| !isFormJson(path)) return notFoundPage(ctx);
	74	const scope = localScope(ctx, repo);
	75	// A mirror you cannot push to proposes through its origin: the source editor's card.
	76	if (scope.propose !== undefined)
	77	return flashTo(ctx, blobHref(scope, ref, path), {
	78	tone: "danger",
	79	message: "This file mirrors an origin. Propose a change to it from the editor.",
	80	});
	81	return scope;
	82	}
	83
	84	/** The file's text at `ref`, when it is text the form can hold. */
	85	async function readText(scope: RepoScope, ref: string, path: string, max: number): Promise<string \| undefined> {
	86	const blob = await scope.source.blob(ref, path);
	87	if (!blob.ok \|\| blob.value.kind !== "text" \|\| blob.value.size > max) return undefined;
	88	return new TextDecoder().decode(blob.value.body);
	89	}
	90
	91	const schemaFor = (scope: RepoScope, ref: string, path: string, doc: Json): Promise<FoundSchema \| undefined> =>
	92	findSchema(path, doc, (p) => (isSafeTreePath(p) ? readText(scope, ref, p, MAX_SCHEMA_BYTES) : Promise.resolve(undefined)));
	93
	94	interface FormState {
	95	readonly ref: string;
	96	readonly path: string;
	97	readonly base: string;
	98	readonly doc: Json;
	99	readonly found: FoundSchema \| undefined;
	100	readonly errors?: ReadonlyMap<string, string>;
	101	readonly typed?: ReadonlyMap<string, string>;
	102	readonly flash?: { tone: "danger" \| "success"; message: string };
	103	}
	104
	105	const hidden = (s: FormState, doc: Json): Html => html`<input type="hidden" name="ref" value="${s.ref}" />
	106	<input type="hidden" name="path" value="${s.path}" />
	107	<input type="hidden" name="base" value="${s.base}" />
	108	<input type="hidden" name="doc" value="${stringify(doc)}" />`;
	109
	110	function head(scope: RepoScope, s: FormState, proposing: boolean, step: string): Html {
	111	return pageHead(html`${icon(proposing ? "fork" : "pencil")}${s.path.split("/").pop() ?? s.path}`, {
	112	sub: html`${step} · <span class="mono">${s.path}</span> on <span class="mono">${s.ref}</span> in
	113	<span class="mono">${scope.fullName}</span>${
	114	s.found === undefined
	115	? html` · fields from the values`
	116	: html` · fields from <a href="${blobHref(scope, s.ref, s.found.from)}" class="mono">${s.found.from}</a>`
	117	}`,
	118	});
	119	}
	120
	121	async function formPage(ctx: Ctx, scope: RepoScope, s: FormState): Promise<Response> {
	122	const proposing = !(await commitsDirectly(ctx, scope, s.ref));
	123	// The first submit button in the form, so Enter in any field reviews
	124	// rather than pressing a card's Up or Remove.
	125	const review = btn(proposing ? "Review and propose" : "Review changes", { name: "step", value: "review", variant: "primary" });
	126	return page({
	127	ctx,
	128	...(s.flash === undefined ? {} : { flash: s.flash }),
	129	title: `${s.path} · ${scope.facts.name}`,
	130	crumbs: scope.crumbs,
	131	palette: scope.palette,
		sentinelcrew 17d ago outdated Remove this `raw()` submit button, which is aria-hidden and sr-only. Make Review the first submit button in the form, so Enter in a field submits it without a hidden control.
	132	body: html`${head(scope, s, proposing, "Editing settings")}
	133	<form method="post" action="${scope.base}/config" class="card config-form">
	134	<div class="bar mb">
	135	<span class="muted small">Enter in a field reviews the change.</span><span class="spacer"></span>
	136	${review}
	137	</div>
	138	${hidden(s, s.doc)}
	139	<input type="hidden" name="from" value="form" />
	140	${configFields(s.doc, {
	141	found: s.found,
	142	...(s.errors === undefined ? {} : { errors: s.errors }),
	143	...(s.typed === undefined ? {} : { typed: s.typed }),
	144	})}
	145	<div class="form-actions">
	146	${review}
	147	${btn("Source", { href: blobHref(scope, s.ref, s.path, "?view=source"), variant: "outline" })}
	148	${when(scope.caps.write, () =>
	149	btn("Edit as text", { href: `${scope.base}/edit/${encodeURIComponent(s.ref)}/${s.path}`, variant: "ghost" }),
	150	)}
	151	</div>
	152	</form>`,
	153	});
	154	}
	155
	156	async function reviewPage(
	157	ctx: Ctx,
	158	scope: RepoScope,
	159	s: FormState,
	160	diff: { before: string; after: string },
	161	o: { message?: string; description?: string; error?: string } = {},
	162	): Promise<Response> {
	163	const proposing = !(await commitsDirectly(ctx, scope, s.ref));
	164	const lines = lineDiff(diff.before, diff.after);
	165	return page({
	166	ctx,
	167	...(s.flash === undefined ? {} : { flash: s.flash }),
	168	title: `Review ${s.path} · ${scope.facts.name}`,
	169	crumbs: scope.crumbs,
	170	palette: scope.palette,
	171	body: html`${head(scope, s, proposing, "Review")}
	172	<pre class="card mono config-diff" aria-label="The change">${lines.map(
	173	(l) => html`<span data-op="${l.op === " " ? "same" : l.op === "+" ? "add" : "del"}">${l.op} ${l.text}</span>\n`,
	174	)}</pre>
	175	<form method="post" action="${scope.base}/config" class="card">
	176	${hidden(s, s.doc)}
	177	${field({
	178	name: "message",
	179	label: "Commit message",
	180	value: o.message ?? `Update ${s.path}`,
	181	required: true,
	182	...(o.error === undefined ? {} : { error: o.error }),
	183	})}
	184	${field({ name: "description", label: "Description", type: "textarea", rows: 3, value: o.description ?? "" })}
	185	<p class="muted small">${
	186	proposing
	187	? scope.caps.write
	188	? html`This goes on a new branch, with a pull request into <span class="mono">${s.ref}</span>.`
		sentinelcrew 17d ago outdated Same here: use `btn()` with `formnovalidate`, not a `raw()` string.
	189	: html`You cannot push here, so this goes on a branch of your fork, with a pull request into <span class="mono">${s.ref}</span>.`
	190	: html`One commit on <span class="mono">${s.ref}</span>.`
	191	}</p>
	192	<div class="form-actions">
	193	${btn(proposing ? "Propose change" : `Commit to ${s.ref}`, { name: "step", value: "save", variant: "primary", icon: proposing ? "fork" : "check" })}
	194	${btn("Back to the form", { name: "step", value: "edit", variant: "outline", formnovalidate: true })}
	195	</div>
	196	</form>`,
	197	});
	198	}
	199
	200	// GET /:owner/:name/config/:ref/*path
	201	export async function configPage(ctx: Ctx): Promise<Response> {
	202	const ref = ctx.params.ref ?? "";
	203	const path = ctx.params.path ?? "";
	204	const scope = configContext(ctx, ref, path);
	205	if (scope instanceof Response) return scope;
	206	const blob = await scope.source.blob(ref, path);
	207	if (!blob.ok) return notFoundPage(ctx);
	208	const tooBig = (message: string): Response =>
	209	flashTo(ctx, blobHref(scope, ref, path, "?view=source"), { tone: "danger", message });
	210	if (blob.value.kind !== "text" \|\| blob.value.size > MAX_FORM_BYTES)
	211	return tooBig("This file is too large to edit as a form. Edit it as text, or with git.");
	212	const text = new TextDecoder().decode(blob.value.body);
	213	const parsed = parseJson(text);
	214	if (!parsed.ok) {
	215	const e = parsed.error;
	216	return tooBig(`Not valid JSON: ${e.message} at line ${e.line}, column ${e.column}. Fix it in the source first.`);
	217	}
	218	if (countFields(parsed.value) > MAX_FIELDS)
	219	return tooBig(`This file has more than ${MAX_FIELDS.toLocaleString()} values, too many for a form. Edit it as text.`);
	220	return formPage(ctx, scope, {
	221	ref,
	222	path,
	223	base: digestOf(text),
	224	doc: parsed.value,
	225	found: await schemaFor(scope, ref, path, parsed.value),
	226	});
	227	}
	228
	229	/** The document the form carried, with what was typed into it. */
	230	function docFrom(form: Form): { doc: Json; errors: Map<string, string>; typed: Map<string, string> } \| undefined {
	231	const parsed = parseJson(formValue(form, "doc"));
	232	if (!parsed.ok \|\| countFields(parsed.value) > MAX_FIELDS) return undefined;
	233	if (formValue(form, "from") !== "form") return { doc: parsed.value, errors: new Map(), typed: new Map() };
	234	return readValues(parsed.value, (name) => {
	235	const v = form.get(name);
	236	return typeof v === "string" ? v : undefined;
	237	});
	238	}
	239
	240	// POST /:owner/:name/config
	241	export async function configSubmit(ctx: Ctx): Promise<Response> {
	242	// Who may write is settled before the body is read: a private repository
	243	// answers a stranger 404, as every page about it does.
	244	if (!loadRepo(ctx)) return notFoundPage(ctx);
	245	if (!ctx.auth.user) return signInFirst(ctx);
	246	const form = await readForm(ctx, "rw");
	247	if (form instanceof Response) return form;
	248	const ref = formValue(form, "ref");
	249	const path = formValue(form, "path");
	250	const scope = configContext(ctx, ref, path);
	251	if (scope instanceof Response) return scope;
	252	const repo = scope.repo;
	253	const user = ctx.auth.user;
	254	if (repo === undefined \|\| user === undefined) return notFoundPage(ctx);
	255
	256	const read = docFrom(form);
	257	if (read === undefined) return flashTo(ctx, blobHref(scope, ref, path), { tone: "danger", message: "That form could not be read. Open the file again." });
	258	const current = await readText(scope, ref, path, MAX_FORM_BYTES);
	259	if (current === undefined) return notFoundPage(ctx);
	260	const original = parseJson(current);
	261	const found = await schemaFor(scope, ref, path, read.doc);
	262	let state: FormState = { ref, path, base: formValue(form, "base"), doc: read.doc, found };
	263
	264	const op = formValue(form, "op");
	265	if (op !== "") return formPage(ctx, scope, { ...state, doc: applyOp(read.doc, op, found) });
	266
	267	const step = formValue(form, "step");
	268	if (step === "edit") return formPage(ctx, scope, state);
	269
	270	const errors = new Map([...validate(read.doc, found), ...read.errors]);
	271	if (errors.size > 0)
	272	return formPage(ctx, scope, {
	273	...state,
	274	errors,
	275	typed: read.typed,
	276	flash: { tone: "danger", message: errors.size === 1 ? "One field needs a fix." : `${errors.size} fields need a fix.` },
	277	});
	278
	279	if (state.base !== digestOf(current)) {
	280	// Someone else saved first. Their file is now the base; the form keeps
	281	// this person's values, and a second review shows them over the new file.
	282	return formPage(ctx, scope, {
	283	...state,
	284	base: digestOf(current),
	285	flash: { tone: "danger", message: `${path} changed on ${ref} since you opened it. Check your values, then review again.` },
	286	});
	287	}
	288	if (original.ok && sameDoc(original.value, read.doc))
	289	return formPage(ctx, scope, { ...state, flash: { tone: "success", message: "Nothing changed, so there is nothing to save." } });
	290
	291	const after = stringify(read.doc, detectStyle(current));
	292	if (step !== "save") return reviewPage(ctx, scope, state, { before: current, after });
	293
	294	const subject = formValue(form, "message").trim();
	295	const description = formValue(form, "description").trim();
	296	if (subject === "")
	297	return reviewPage(ctx, scope, state, { before: current, after }, { description, error: "A commit needs a message." });
	298	const message = description === "" ? subject : `${subject}\n\n${description}`;
	299	const files = [{ path, content: after }];
	300
	301	if (await commitsDirectly(ctx, scope, ref)) {
	302	const written = await editFiles(ctx.app, user, repo, { branch: ref, base: ref, message, files });
	303	if (!written.ok) {
	304	state = { ...state, flash: { tone: "danger", message: editErrorText(written.error) } };
	305	return reviewPage(ctx, scope, state, { before: current, after }, { message: subject, description });
	306	}
	307	return flashTo(ctx, blobHref(scope, ref, path), { tone: "success", message: `Committed to ${ref}.` });
	308	}
	309
	310	const proposed = await proposeEdit(ctx.app, user, repo, { base: ref, files, message, title: subject, body: description });
	311	if (!proposed.ok) {
	312	const words = proposeEditText(proposed.error);
	313	state = { ...state, flash: { tone: "danger", message: words } };
	314	return reviewPage(ctx, scope, state, { before: current, after }, { message: subject, description });
	315	}
	316	const pull = proposed.value.pull;
	317	return flashTo(ctx, `${scope.base}/pulls/${pull.number}`, {
	318	tone: "success",
	319	message: `Proposed on ${proposed.value.head.ownerName}/${proposed.value.head.name}:${proposed.value.branch}, as this pull request.`,
	320	});
	321	}
		@@ -0,0 +1,316 @@
	1	/**
	2	* A JSON document as form fields, and a submitted form back as a document.
	3	*
	4	* Every field is named for the JSON pointer of its value: `v/servers/0/port`
	5	* carries text, `j/mode` carries a JSON value (an enum's select), and a
	6	* boolean is a checkbox whose absence means false. The document's shape
	7	* travels beside them in a hidden `doc`, so a plain form POST — no script —
	8	* can add, remove and reorder cards: each of those is a submit button named
	9	* `op` (`opValue`), applied by `applyOp` before the form is drawn again.
	10	*
	11	* Without a schema a field's control comes from its value; with one, from
	12	* the schema too: an enum is a select, `description` is the help text, and
	13	* `required`, `minimum`, `maximum` and `pattern` are the input's own
	14	* attributes, so a browser checks them inline before the form is sent.
	15	*/
	16
	17	import { html, raw, when, type Html } from "../html.ts";
	18	import { btn, field } from "../ui.ts";
	19	import {
	20	blankLike,
	21	fromPlain,
	22	pointer,
	23	splitPointer,
	24	updateAt,
	25	type Json,
	26	} from "./json-doc.ts";
	27	import { isJsonNumber, schemaAt, type FoundSchema, type Schema } from "./json-schema.ts";
	28
	29	/** More values than this and the form is no help: the source editor is. */
	30	export const MAX_FIELDS = 2_000;
	31
	32	/** How many values (leaves) a document has, for `MAX_FIELDS`. */
	33	export function countFields(doc: Json): number {
	34	if (doc.t === "array") return doc.items.reduce((n, v) => n + countFields(v), 1);
	35	if (doc.t === "object") return doc.entries.reduce((n, [, v]) => n + countFields(v), 1);
	36	return 1;
	37	}
	38
	39	export interface FieldsOptions {
	40	readonly found?: FoundSchema \| undefined;
	41	/** Messages by pointer, each drawn under its field. */
	42	readonly errors?: ReadonlyMap<string, string>;
	43	/** What was typed into a field that could not hold it (a bad number). */
	44	readonly typed?: ReadonlyMap<string, string>;
	45	/** Draw the values only: no inputs that submit, no buttons. */
	46	readonly readonly?: boolean;
	47	}
	48
	49	export type Op = "add" \| "remove" \| "up" \| "down" \| "key";
	50
	51	/** A structural button's value: which change, at which pointer. */
	52	export const opValue = (op: Op, at: string, key?: string): string =>
	53	JSON.stringify(key === undefined ? [op, at] : [op, at, key]);
	54
	55	const isScalar = (v: Json): boolean => v.t !== "array" && v.t !== "object";
	56
	57	const typeList = (s: Schema \| undefined): readonly string[] =>
	58	s?.type === undefined ? [] : typeof s.type === "string" ? [s.type] : s.type;
	59
	60	/** What a new value under schema `s` starts as, shaped like `like` when the schema is silent. */
	61	function blankFor(s: Schema \| undefined, like: Json \| undefined): Json {
	62	if (s?.default !== undefined) return fromPlain(s.default);
	63	if (Array.isArray(s?.enum) && s.enum.length > 0) return fromPlain(s.enum[0]);
	64	const t = typeList(s)[0];
	65	if (t === "string") return { t: "string", v: "" };
	66	if (t === "number" \|\| t === "integer") return { t: "number", v: "0" };
	67	if (t === "boolean") return { t: "boolean", v: false };
	68	if (t === "array") return { t: "array", items: [] };
	69	if (t === "object") {
	70	const props = s?.properties ?? {};
	71	const keys = Array.isArray(s?.required) ? s.required.filter((k) => typeof k === "string") : [];
	72	return { t: "object", entries: keys.map((k) => [k, blankFor(props[k], undefined)] as const) };
	73	}
	74	return blankLike(like);
	75	}
	76
	77	const parentOf = (p: string): { parent: string; index: number } \| undefined => {
	78	const cut = p.lastIndexOf("/");
	79	const tail = p.slice(cut + 1);
	80	return cut < 0 \|\| !/^(0\|[1-9]\d*)$/.test(tail) ? undefined : { parent: p.slice(0, cut), index: Number(tail) };
	81	};
	82
	83	/** One structural change to the document; anything unrecognised changes nothing. */
	84	export function applyOp(doc: Json, raw: string, found?: FoundSchema): Json {
	85	let parsed: unknown;
	86	try {
	87	parsed = JSON.parse(raw);
	88	} catch {
	89	return doc;
	90	}
	91	if (!Array.isArray(parsed) \|\| typeof parsed[0] !== "string" \|\| typeof parsed[1] !== "string") return doc;
	92	const [op, at, key] = parsed as [string, string, unknown];
	93	if (splitPointer(at) === undefined) return doc;
	94	if (op === "add")
	95	return updateAt(doc, at, (arr) =>
	96	arr.t !== "array"
	97	? arr
	98	: { t: "array", items: [...arr.items, blankFor(schemaAt(found, pointer(at, arr.items.length)), arr.items.at(-1))] },
	99	);
	100	if (op === "key" && typeof key === "string" && key !== "")
	101	return updateAt(doc, at, (obj) =>
	102	obj.t !== "object" \|\| obj.entries.some(([k]) => k === key)
	103	? obj
	104	: { t: "object", entries: [...obj.entries, [key, blankFor(schemaAt(found, pointer(at, key)), undefined)] as const] },
	105	);
	106	const place = parentOf(at);
	107	if (place === undefined) return doc;
	108	const { parent, index } = place;
	109	return updateAt(doc, parent, (arr) => {
	110	if (arr.t !== "array" \|\| index >= arr.items.length) return arr;
	111	const items = [...arr.items];
	112	if (op === "remove") items.splice(index, 1);
	113	else if (op === "up" \|\| op === "down") {
	114	const to = op === "up" ? index - 1 : index + 1;
	115	if (to < 0 \|\| to >= items.length) return arr;
	116	[items[index], items[to]] = [items[to]!, items[index]!];
	117	} else return arr;
	118	return { t: "array", items };
	119	});
	120	}
	121
	122	/**
	123	* The document with the form's values written into it. A number that is not
	124	* one keeps the old value and comes back in `typed` with an error, so the
	125	* form can be drawn again with the person's text still in it.
	126	*/
	127	export function readValues(
	128	doc: Json,
	129	get: (name: string) => string \| undefined,
	130	): { doc: Json; errors: Map<string, string>; typed: Map<string, string> } {
	131	const errors = new Map<string, string>();
	132	const typed = new Map<string, string>();
	133	const walk = (v: Json, p: string): Json => {
	134	if (v.t === "object") return { t: "object", entries: v.entries.map(([k, x]) => [k, walk(x, pointer(p, k))] as const) };
	135	if (v.t === "array") return { t: "array", items: v.items.map((x, i) => walk(x, pointer(p, i))) };
	136	const chosen = get(`j${p}`);
	137	if (chosen !== undefined) {
	138	try {
	139	return fromPlain(JSON.parse(chosen));
	140	} catch {
	141	return v;
	142	}
	143	}
	144	const text = get(`v${p}`);
	145	if (v.t === "boolean") return { t: "boolean", v: text === "true" };
	146	if (text === undefined \|\| v.t === "null") return v;
	147	if (v.t === "string") return { t: "string", v: text.replace(/\r\n/g, "\n") };
	148	const n = text.trim();
	149	if (isJsonNumber(n)) return { t: "number", v: n };
	150	errors.set(p, "Must be a number.");
	151	typed.set(p, text);
	152	return v;
	153	};
	154	return { doc: walk(doc, ""), errors, typed };
	155	}
	156
	157	// ---- drawing ----
	158
	159	/** The last segment of a pointer, as a field's label. */
	160	const labelOf = (p: string): string => splitPointer(p)?.at(-1) ?? "";
	161
	162	let fieldSerial = 0;
	163
	164	const description = (s: Schema \| undefined): string \| undefined =>
	165	typeof s?.description === "string" && s.description !== "" ? s.description : undefined;
	166
	167	/**
	168	* One scalar value as `field()`: its label, control, help and error. The
	169	* control follows the schema when it says (an enum is a select), else the
	170	* value (a boolean is a checkbox, a number a number input).
	171	*/
	172	function scalarField(
	173	v: Json,
	174	p: string,
	175	s: Schema \| undefined,
	176	o: FieldsOptions,
	177	f: { label: string; required: boolean; labelHidden?: boolean; after?: Html \| null },
	178	): Html {
	179	const off = o.readonly === true;
	180	const help = description(s);
	181	const error = o.errors?.get(p);
	182	const shared = {
	183	id: `cf-${++fieldSerial}`,
	184	label: f.required && !off ? `${f.label} (required)` : f.label,
	185	...(help === undefined ? {} : { hint: help }),
	186	...(error === undefined ? {} : { error }),
	187	...(f.labelHidden ? { labelHidden: true } : {}),
	188	...(f.after ? { after: f.after } : {}),
	189	};
	190	if (Array.isArray(s?.enum) && s.enum.length > 0) {
	191	const current = JSON.stringify(v.t === "number" ? Number(v.v) : v.t === "string" \|\| v.t === "boolean" ? v.v : null);
	192	const choices = s.enum.map((e) => ({ value: JSON.stringify(e), label: typeof e === "string" ? e : JSON.stringify(e) }));
	193	const options = [
	194	...(choices.some((c) => c.value === current) ? [] : [{ value: current, label: current }]),
	195	...choices,
	196	].map((c) => ({ ...c, selected: c.value === current }));
	197	return field({ ...shared, name: `j${p}`, type: "select", options, ...(off ? { disabled: true } : {}) });
	198	}
	199	if (v.t === "boolean")
	200	return field({ ...shared, name: `v${p}`, type: "checkbox", value: "true", checked: v.v, ...(off ? { disabled: true } : {}) });
	201	if (v.t === "null") return field({ ...shared, name: `v${p}`, value: "null", readonly: true, mono: true });
	202	if (v.t === "number")
	203	return field({
	204	...shared,
	205	name: `v${p}`,
	206	type: off ? "text" : "number",
	207	value: o.typed?.get(p) ?? v.v,
	208	mono: true,
	209	step: typeList(s).includes("integer") ? "1" : "any",
	210	...(typeof s?.minimum === "number" ? { min: s.minimum } : {}),
	211	...(typeof s?.maximum === "number" ? { max: s.maximum } : {}),
	212	...(off ? { readonly: true } : { required: true }),
	213	});
		sentinelcrew 17d ago outdated Design: this is a hand-rolled `.btn`. Use `btn()` from `ui.ts`, adding a `formnovalidate` option to it if needed, so buttons keep one source.
	214	const text = v.t === "string" ? v.v : "";
	215	return field({
	216	...shared,
	217	name: `v${p}`,
	218	value: text,
	219	...(text.includes("\n") ? { type: "textarea", rows: Math.min(12, text.split("\n").length + 1) } : {}),
	220	...(typeof s?.pattern === "string" ? { pattern: s.pattern } : {}),
	221	...(off ? { readonly: true } : f.required ? { required: true } : {}),
	222	});
	223	}
	224
	225	function errorLine(p: string, id: string, o: FieldsOptions): Html \| null {
	226	const message = o.errors?.get(p);
	227	return message === undefined ? null : html`<span class="error" id="${id}-err">${message}</span>`;
	228	}
	229
	230	function hint(s: Schema \| undefined, id: string): Html \| null {
	231	return typeof s?.description === "string" && s.description !== ""
	232	? html`<span class="hint" id="${id}-hint">${s.description}</span>`
	233	: null;
	234	}
	235
	236	/** A structural button: it skips the browser's checks, since removing a card must not wait for a field in it. */
	237	const opBtn = (label: string, op: Op, at: string, plus?: "plus" \| "trash", key?: string): Html =>
	238	btn(label, {
	239	name: "op",
	240	value: opValue(op, at, key),
	241	size: "sm",
	242	variant: op === "remove" ? "ghost" : "outline",
	243	formnovalidate: true,
	244	...(plus === undefined ? {} : { icon: plus }),
	245	});
		sentinelcrew 17d ago outdated Design: `field()` owns `.field` / label / `.hint` / `.error` / `data-invalid`. Draw scalars through it, extending it for checkbox, select and number bounds, and do not re-create the markup here.
	246
	247	function node(v: Json, p: string, label: string, parentSchema: Schema \| undefined, o: FieldsOptions): Html {
	248	const s = schemaAt(o.found, p);
	249	const id = `cf-${++fieldSerial}`;
	250	const title = typeof s?.title === "string" && s.title !== "" ? s.title : label;
	251	const required = Array.isArray(parentSchema?.required) && parentSchema.required.includes(label);
	252	const errored = o.errors?.has(p) === true;
	253	if (v.t === "object") {
	254	const body = objectBody(v, p, s, o);
	255	if (p === "") return body;
	256	return html`<fieldset class="field config-group" ${errored ? raw("data-invalid") : null}>
	257	<legend>${title}</legend>${hint(s, id)}${errorLine(p, id, o)}${body}
	258	</fieldset>`;
	259	}
	260	if (v.t === "array") {
	261	const cards = v.items.length > 0 ? !v.items.every(isScalar) : ["object", "array"].includes(typeList(s?.items)[0] ?? "");
	262	return html`<fieldset class="field config-group" ${errored ? raw("data-invalid") : null}>
	263	<legend>${title} <span class="muted small num">${v.items.length}</span></legend>
	264	${hint(s, id)}${errorLine(p, id, o)}
	265	${cards ? cardList(v, p, title, o) : chipList(v, p, s, o)}
	266	${when(o.readonly !== true, () => html`<div class="form-actions">${opBtn(cards ? `Add ${title}` : "Add", "add", p, "plus")}</div>`)}
	267	</fieldset>`;
	268	}
	269	return scalarField(v, p, s, o, { label: title, required });
	270	}
	271
	272	function objectBody(v: Extract<Json, { t: "object" }>, p: string, s: Schema \| undefined, o: FieldsOptions): Html {
	273	const present = new Set(v.entries.map(([k]) => k));
	274	const missing = Object.keys(s?.properties ?? {}).filter((k) => !present.has(k));
	275	return html`${v.entries.map(([k, x]) => node(x, pointer(p, k), k, s, o))}
	276	${when(
	277	o.readonly !== true && missing.length > 0,
	278	() => html`<div class="form-actions">${missing.map((k) => opBtn(k, "key", p, "plus", k))}</div>`,
	279	)}`;
	280	}
	281
	282	function chipList(v: Extract<Json, { t: "array" }>, p: string, s: Schema \| undefined, o: FieldsOptions): Html {
	283	if (v.items.length === 0) return html`<p class="muted small">Empty.</p>`;
	284	return html`<ul class="config-chips">
	285	${v.items.map((x, i) => {
	286	const at = pointer(p, i);
	287	return html`<li>${scalarField(x, at, s?.items, o, {
	288	label: `${labelOf(p)} ${i + 1}`,
	289	required: false,
	290	labelHidden: true,
	291	after: o.readonly === true ? null : opBtn("Remove", "remove", at),
	292	})}</li>`;
	293	})}
	294	</ul>`;
	295	}
	296
	297	function cardList(v: Extract<Json, { t: "array" }>, p: string, title: string, o: FieldsOptions): Html {
	298	return html`${v.items.map((x, i) => {
	299	const at = pointer(p, i);
	300	const last = v.items.length - 1;
	301	return html`<div class="card config-card">
	302	<div class="bar">
	303	<strong>${title} ${i + 1}</strong><span class="spacer"></span>
	304	${when(o.readonly !== true, () => html`${i > 0 ? opBtn("Up", "up", at) : null}${i < last ? opBtn("Down", "down", at) : null}${opBtn("Remove", "remove", at, "trash")}`)}
	305	</div>
	306	${x.t === "object" ? objectBody(x, at, schemaAt(o.found, at), o) : node(x, at, `${title} ${i + 1}`, undefined, o)}
	307	</div>`;
	308	})}`;
	309	}
	310
	311	/** Every field of `doc`, drawn as `o` says. */
	312	export function configFields(doc: Json, o: FieldsOptions = {}): Html {
	313	fieldSerial = 0;
	314	if (doc.t !== "object" && doc.t !== "array") return node(doc, "", "value", undefined, o);
	315	return node(doc, "", "", undefined, o);
	316	}
		@@ -0,0 +1,62 @@
	1	/**
	2	* A JSON config file on the blob page: its values as a form, read-only, with
	3	* "Edit as form" one click away (`pages/config.ts` is the editor, and draws
	4	* the schema the file names). A file that is not valid JSON says why, at
	5	* which line, above its text; Source keeps its highlighted view.
	6	*/
	7
	8	import { html, type Html } from "../html.ts";
	9	import { btn } from "../ui.ts";
	10	import { configFields, countFields, MAX_FIELDS } from "./config-form.ts";
	11	import { parseJson } from "./json-doc.ts";
	12	import type { Rendered, RenderInput } from "./renderers.ts";
	13
	14	/** Only JSON draws as a form; YAML, TOML and the rest keep their source. */
	15	export const isFormJson = (path: string): boolean => /\.json$/i.test(path);
	16
	17	/**
	18	* `/:owner/:name/media/:ref/path` → `/:owner/:name/config/:ref/path`: the
	19	* ref is encoded whole, so the last `/media/` before it is the route's. A
	20	* mirror's pages (`/origins/…`) edit through the source editor instead.
	21	*/
	22	function editHref(input: RenderInput): string \| undefined {
	23	const head = input.media.slice(0, input.media.length - input.path.length - 1);
	24	const cut = head.lastIndexOf("/media/");
	25	if (cut < 0 \|\| head.startsWith("/origins/")) return undefined;
	26	return `${head.slice(0, cut)}/config/${head.slice(cut + "/media/".length)}/${input.path}`;
	27	}
	28
	29	function brokenJson(text: string, line: number, column: number, message: string): Html {
	30	const lines = text.split("\n");
	31	return html`<div class="card" role="alert">
	32	<p><strong>Not valid JSON:</strong> ${message} at line ${String(line)}, column ${String(column)}.</p>
	33	<p class="muted small">The form needs valid JSON. Source shows the file highlighted.</p>
	34	</div>
	35	<pre class="card mono">${lines.map((l, i) => (i + 1 === line ? html`<mark>${l}</mark>\n` : `${l}\n`))}</pre>`;
	36	}
	37
	38	export function config(input: RenderInput): Rendered {
	39	const text = new TextDecoder().decode(input.body);
	40	const lines = text === "" ? 0 : text.replace(/\n$/, "").split("\n").length;
	41	const parsed = parseJson(text);
	42	if (!parsed.ok) {
	43	const e = parsed.error;
	44	return { lines, content: brokenJson(text, e.line, e.column, e.message) };
	45	}
	46	if (countFields(parsed.value) > MAX_FIELDS)
	47	return {
	48	lines,
	49	content: html`<div class="card"><p class="muted">This file has more than ${MAX_FIELDS.toLocaleString()} values, too many for a form. Source shows it whole.</p></div>`,
	50	};
	51	const edit = editHref(input);
	52	return {
	53	lines,
	54	content: html`<div class="card config-form">
	55	<div class="bar mb">
	56	<span class="muted small">Settings in this file</span><span class="spacer"></span>
	57	${edit === undefined ? null : btn("Edit as form", { href: edit, size: "sm", variant: "outline", icon: "pencil" })}
	58	</div>
	59	${configFields(parsed.value, { readonly: true })}
	60	</div>`,
	61	};
	62	}