Keep what was typed when a target or webhook edit is refused (closes #381)

A refused save on the target edit page now shows the edit form again,
with the reason above it and every value submitted, instead of a bare
text page; the status codes are unchanged. The webhook edit page keeps
the submitted name, description and retention the same way, while the
page still reports the stored retention.

Target edits are validated by setTargetFromForm, which newTarget now
uses too, so the add and edit forms accept and refuse the same things.
An empty max_retries keeps the target's own count.

The browser test also saves both edit pages with refused values. Its
seeding and its table of target types move into helpers, leaving the
test function a plain list of check calls.

Model: opus-5-5

.gitea/workflows/check.yml

@@ -28,10 +28,10 @@ jobs:
 
       - name: Fingerprint the build context
         # Writes the hash of the commit being checked into the context, which
-        # invalidates the `COPY . .` layer of both check stages: a commit
+        # invalidates the `COPY . .` layer of every check stage: a commit
-        # that was never linted, format-checked, tested and built cannot
+        # that was never linted, format-checked, stylesheet-checked, tested
-        # report success from cache.
+        # and built cannot report success from cache.
         run: git rev-parse HEAD > .ci-fingerprint
 
-      - name: Build Docker image (runs make fmt-check, golangci-lint, make test, make build)
+      - name: Build Docker image (runs make fmt-check, golangci-lint, the stylesheet check, make test, make build)
         run: script/cibuild

Dockerfile

@@ -29,14 +29,51 @@ RUN script/assets
 RUN --network=none golangci-lint config verify --config .golangci.yml
 RUN --network=none golangci-lint run --config .golangci.yml --build-tags browser ./...
 
+# Stylesheet stages. static/css/tailwind.css is generated, by this pinned
+# tailwindcss, from static/css/input.css and the files its @source lines
+# name. `make css` (script/css) writes it out from the css-output stage.
+# The css-check stage fails when the committed file differs from what is
+# generated; `make check` runs it, and so does the build stage below.
+#
+# tailwindcss v4.2.1 standalone CLI, released 2026-02-23: one binary per
+# architecture, each pinned by its sha256 from the release's sha256sums.txt.
+# debian:bookworm-slim, 2026-10-02: the binary needs glibc.
+FROM debian:bookworm-slim@sha256:3783cc01769c7b2b1b83a5c5ad96c815348e28ed7da68e2e3687004faa906251 AS tailwind-amd64
+ADD --checksum=sha256:39e8d4e24b3c83b0a6e69e100a972fbc75d5fef8dce47b3ddac3cf92dea81fe3 --chmod=755 \
+    https://github.com/tailwindlabs/tailwindcss/releases/download/v4.2.1/tailwindcss-linux-x64 /usr/local/bin/tailwindcss
+
+FROM debian:bookworm-slim@sha256:3783cc01769c7b2b1b83a5c5ad96c815348e28ed7da68e2e3687004faa906251 AS tailwind-arm64
+ADD --checksum=sha256:d87e6486bb3f70b04ef1dcaacc4ee6548a5a15fbf521b31bc24d2c774f68a951 --chmod=755 \
+    https://github.com/tailwindlabs/tailwindcss/releases/download/v4.2.1/tailwindcss-linux-arm64 /usr/local/bin/tailwindcss
+
+# TARGETARCH, set by docker, is the architecture being built for.
+FROM tailwind-${TARGETARCH} AS css
+WORKDIR /src
+COPY . .
+RUN tailwindcss -i static/css/input.css -o /out/tailwind.css --minify
+
+FROM scratch AS css-output
+COPY --from=css /out/tailwind.css /
+
+# Both files are split after each "}", one rule per line, so that when they
+# differ the diff shows the rules that differ.
+FROM css AS css-check
+RUN sed 's/}/}\n/g' static/css/tailwind.css > /tmp/committed.css \
+    && sed 's/}/}\n/g' /out/tailwind.css > /tmp/generated.css \
+    && diff -U0 /tmp/committed.css /tmp/generated.css || { \
+        echo "static/css/tailwind.css is not what make css generates; run make css" >&2; \
+        exit 1; \
+    }
+
 # Build stage
 # golang:1.26.1-bookworm (Debian-based), 2026-03-17
 # Using Debian-based image because gorm.io/driver/sqlite pulls in
 # mattn/go-sqlite3 (CGO), which does not compile on Alpine musl.
 FROM golang:1.26.1-bookworm@sha256:4465644228bc2857a954b092167e12aa59c006a3492282a6c820bf4755fd64a4 AS builder
 
-# Depend on lint stage passing
+# Depend on the lint and stylesheet check stages passing
 COPY --from=lint /src/go.sum /dev/null
+COPY --from=css-check /out/tailwind.css /dev/null
 
 # jq is a runtime dependency of script/ci-mark-superseded, which the test
 # suite executes. git is what script/version derives the version with.

Makefile

@@ -1,4 +1,4 @@
-.PHONY: bootstrap setup assets test test-browser lint fmt fmt-check check build run dev deps docker clean hooks css version
+.PHONY: bootstrap setup assets test test-browser lint fmt fmt-check check build run dev deps docker clean hooks css css-check version
 
 # Default target
 .DEFAULT_GOAL := check
@@ -74,4 +74,7 @@ hooks:
 	@script/install-precommit
 
 css:
-	tailwindcss -i static/css/input.css -o static/css/tailwind.css --minify
+	@script/css
+
+css-check:
+	@script/css-check

README.md

@@ -19,12 +19,14 @@ before deploying one.
 ### Prerequisites
 
 - Go 1.26.1+ (the version in `go.mod`)
-- Docker (for `make lint` and so for `make check`, for the browser test in
+- Docker (for `make lint` and `make css`, and so for `make check`, for the
-  `make test-browser`, for the CI gate, and for containerized deployment)
+  browser test in `make test-browser`, for the CI gate, and for
+  containerized deployment)
 
 golangci-lint is not a prerequisite and must not be installed on the
 host: `script/bootstrap` does not install it, and `make lint` runs the
-digest-pinned linter image via `Dockerfile.lint`.
+digest-pinned linter image via `Dockerfile.lint`. The same holds for
+tailwindcss (see [Stylesheet](#stylesheet)).
 
 ### Quick Start
 
@@ -36,7 +38,7 @@ cd webhooker
 # Install the Go toolchain if missing, and the Go dependencies
 make bootstrap
 
-# Run all checks (test, lint, format check)
+# Run all checks (test, lint, format check, stylesheet check)
 make check
 
 # Run the server from the clone. DATA_DIR defaults to
@@ -59,7 +61,7 @@ make fmt-check  # Fail if gofmt would change anything (writes nothing)
 make lint       # Run golangci-lint in Docker (Dockerfile.lint)
 make test       # Run tests with race detection
 make test-browser # Run the browser test in Docker (Dockerfile.browser)
-make check      # test + lint + fmt-check (CI gate)
+make check      # test + lint + fmt-check + css-check (CI gate)
 make build      # Build binary to bin/webhooker (version-stamped)
 make version    # Print the version this checkout would stamp
 make run        # build, then run ./bin/webhooker
@@ -67,7 +69,8 @@ make dev        # go run ./cmd/webhooker
 make deps       # go mod download + go mod tidy
 make docker     # Build Docker image
 make hooks      # Install git pre-commit hook that runs script/precommit
-make css        # Regenerate static/css/tailwind.css (needs tailwindcss)
+make css        # Regenerate static/css/tailwind.css (tailwindcss in Docker)
+make css-check  # Fail if static/css/tailwind.css is stale (writes nothing)
 make clean      # Remove bin/
 ```
 
@@ -1292,11 +1295,11 @@ What that means for an operator:
 This repository adheres to the
 [Scripts to Rule Them All](https://github.com/github/scripts-to-rule-them-all)
 standard: normalized scripts in `script/` are the entrypoints for the
-development workflow. Eleven of the Makefile's eighteen targets are thin
+development workflow. Thirteen of the Makefile's nineteen targets are thin
-shims that call them; `build`, `run`, `dev`, `deps`, `clean`, `css` and
+shims that call them; `build`, `run`, `dev`, `deps`, `clean` and `version`
-`version` are inline commands with no script behind them, though `build`,
+are inline commands with no script behind them, though `build`, `run` and
-`run` and `dev` first run `script/assets`, and `build` and `version` both
+`dev` first run `script/assets`, and `build` and `version` both take their
-take their value from `script/version`.
+value from `script/version`.
 
 `script/test`, `make build` and `make dev` each run `script/assets`
 first, which writes the ignored `static/js/alpine.min.js` (see
@@ -1318,7 +1321,11 @@ We provide:
 - `script/lint` — run golangci-lint in Docker (see Linting below)
 - `script/fmt` — format all code (writes)
 - `script/fmt-check` — check formatting (read-only)
-- `script/check` — run test, lint, and fmt-check
+- `script/css` — regenerate `static/css/tailwind.css` in Docker (writes;
+  see [Stylesheet](#stylesheet))
+- `script/css-check` — fail if `static/css/tailwind.css` differs from what
+  `script/css` would generate (read-only)
+- `script/check` — run test, lint, fmt-check, and css-check
 - `script/version` — output the version to stamp into the binary (see
   [Version stamping](#version-stamping))
 - `script/docker` — build the Docker image tagged via
@@ -1390,6 +1397,23 @@ the `dist.integrity` hash listed at
 `3p/` with it as `alpinejs-csp-<version>.tgz`, update its file name in
 `script/assets`, and run `make check` and `make test-browser`.
 
+## Stylesheet
+
+`static/css/tailwind.css` is generated by Tailwind and committed. To change the
+styles, edit the templates, `static/js/app.js`,
+`internal/handlers/recent_events.go` or `static/css/input.css`, run `make css`,
+and commit the regenerated file with the change. Tailwind takes classes only
+from the files that `input.css` names in its `@source` lines; a class written in
+any other file is not generated until that file is named there too. `make check`
+and the image build fail when the committed file differs from what `make css`
+generates. `static/css/style.css` is hand-written and is not generated.
+
+`make css` runs the Tailwind standalone CLI in Docker, at the version and sha256
+pinned in the Dockerfile's stylesheet stages; it is never installed on the host.
+To move to a new version, change the version in both download URLs and both
+sha256 sums, taken from the release's `sha256sums.txt`, then run `make css` and
+commit the result.
+
 ## Rationale
 
 Webhook integrations between services are inherently fragile. The
@@ -1582,6 +1606,13 @@ more entrypoints (receiver URLs) and one or more targets (delivery
 destinations) into a logical unit. A user creates a webhook to set up
 event routing.
 
+The new webhook form can also give the webhook its first targets: an
+optional HTTP target URL creates an `http` target named `HTTP`, and the
+archive checkbox creates a `database` target named `Archive` whose
+`expiry` is the pruning chosen beside it (never, 1h, 12h, 24h, 30d, 90d
+or 365d). Both are validated as on the add target form, and the webhook
+and its targets are created together or not at all.
+
 | Field            | Type    | Description |
 | ---------------- | ------- | ----------- |
 | `id`             | UUID    | Primary key |
@@ -3142,10 +3173,10 @@ webhooker/
 │   └── js/alpine.min.js       # Alpine.js CSP build, extracted from 3p/ by make assets, not committed
 ├── templates/                 # Go HTML templates (base, login, sources, etc.)
 ├── script/                    # Scripts to Rule Them All entrypoints
-├── Dockerfile                 # Three stages: lint, test+build, Alpine runtime
+├── Dockerfile                 # Stages: lint, stylesheet, test+build, Alpine runtime
 ├── Dockerfile.lint            # Lint-only image built by script/lint
 ├── Dockerfile.browser         # Browser test image built by script/test-browser
-├── Makefile                   # 11 of 18 targets shim script/; 7 are inline
+├── Makefile                   # 13 of 19 targets shim script/; 6 are inline
 ├── go.mod / go.sum
 └── .golangci.yml              # Linter configuration
 ```
@@ -3459,18 +3490,26 @@ Three properties are load-bearing:
 
 ### Docker
 
-The Dockerfile uses a three-stage build. Each stage is pinned by
+The Dockerfile uses a multi-stage build. Each stage is pinned by
-digest, and the two check stages are separate images so the linter's
+digest, and the lint and builder stages are separate images so the
-version is fixed independently of the compiler's:
+linter's version is fixed independently of the compiler's:
 
 1. **Lint stage** (`golangci/golangci-lint:v2.12.2`, Debian-based) —
    installs `make`, downloads dependencies, copies the source, and runs
    `make fmt-check`, then `script/assets` to extract Alpine.js from
    `3p/`, then `golangci-lint config verify` and `golangci-lint run`,
    both with `--network=none`.
-2. **Builder stage** (`golang:1.26.1-bookworm`) — depends on the lint
+2. **Stylesheet stages** (`debian:bookworm-slim`, with the Tailwind
-   stage passing (it copies a file from it), runs `make test` and
+   standalone CLI pinned by version and sha256, one binary per
-   `make build` (both extract Alpine.js from `3p/` first), and finally
+   architecture) — generate `static/css/tailwind.css` from
+   `static/css/input.css` and the files its `@source` lines name.
+   `css-check` fails when the committed file differs from the generated
+   one, and `make css` writes the generated file out from `css-output`
+   (see [Stylesheet](#stylesheet)).
+3. **Builder stage** (`golang:1.26.1-bookworm`) — depends on the lint
+   and `css-check` stages passing (it copies a file from each), runs
+   `make test` and `make build` (both extract Alpine.js from `3p/`
+   first), and finally
    rebuilds the binary with `CGO_ENABLED=1` and static linking so it
    runs on musl. Both builds go through `make build`, the relink adding
    its `-extldflags` via `GO_LDFLAGS`, so neither can drop the `-X` that
@@ -3478,7 +3517,7 @@ version is fixed independently of the compiler's:
    given, otherwise derived from the `.git` in the context, and the
    stage fails if a context with `.git` would stamp `unknown` (see
    [Version stamping](#version-stamping)).
-3. **Runtime stage** (`alpine:3.21`) — copies the static binary and
+4. **Runtime stage** (`alpine:3.21`) — copies the static binary and
    `deploy/docker-entrypoint.sh`, creates the `/var/lib/webhooker`
    directory for all SQLite databases, exposes port 8080, and includes
    a health check against `/.well-known/healthcheck`. It sets no
@@ -3490,18 +3529,18 @@ The lint stage invokes `golangci-lint` directly rather than `make lint`:
 it is already the pinned linter image, and `make lint` builds
 `Dockerfile.lint`, which would need a docker daemon inside this build.
 
-Both check stages use Debian rather than Alpine because
+The lint and builder stages use Debian rather than Alpine because
 `gorm.io/driver/sqlite` pulls in `mattn/go-sqlite3`, which needs CGO
 and does not compile against musl. Only the final binary is statically
 linked, which is what lets it run on the Alpine runtime image.
 
 `script/cibuild` — `docker build .` — is the CI gate: the checks run
 inside the image, so a build that succeeds is a repo that is formatted,
-linted, tested and compiled. `script/lint` also uses Docker
+linted, tested and compiled, with a current stylesheet. `script/lint`
-(`Dockerfile.lint`, see Linting above), so `make lint` and `make check`
+also uses Docker (`Dockerfile.lint`, see Linting above), so `make lint`
-run the same pinned linter version the gate does; of the steps
+and `make check` run the same pinned linter version the gate does; of
-`make check` runs, only `script/test` and `script/fmt-check` run on the
+the steps `make check` runs, only `script/test` and `script/fmt-check`
-host.
+run on the host.
 
 #### CI gate honesty
 
@@ -3511,9 +3550,10 @@ check meaningless. The `check` workflow therefore writes
 `.ci-fingerprint` into the build context before building. Its value is
 the hash of the commit being checked, so every commit, docs-only ones
 and a squash merge whose tree matches an already-built branch included,
-gets a new fingerprint, invalidates the `COPY . .` layer of both check
+gets a new fingerprint, invalidates the `COPY . .` layer of every check
-stages, and really runs `make fmt-check`, `golangci-lint`, `make test`,
+stage, and really runs `make fmt-check`, `golangci-lint`, the stylesheet
-and `make build`. A run that reports success ran them.
+check, `make test`, and `make build`. A run that reports success ran
+them.
 
 The module download layer sits above `COPY . .` and stays cached.
 

internal/delivery/target_config_view.go

@@ -97,7 +97,7 @@ func targetConfigFields(
 ) []ConfigField {
 	switch t.Type {
 	case database.TargetTypeSlack:
-		return slackConfigFields(t.Config)
+		return slackConfigFields(t)
 	case database.TargetTypeHTTP:
 		return httpConfigFields(t)
 	case database.TargetTypeDatabase:
@@ -119,10 +119,11 @@ func unavailableConfigFields() []ConfigField {
 	}}
 }
 
-// slackConfigFields describes a Slack target. Only the masked
+// slackConfigFields describes a Slack target: its masked
-// webhook URL is shown; the full URL is the credential.
+// webhook URL and its retry count. Only the masked URL is
-func slackConfigFields(configJSON string) []ConfigField {
+// shown; the full URL is the credential.
-	cfg, err := parseSlackConfig(configJSON)
+func slackConfigFields(t *database.Target) []ConfigField {
+	cfg, err := parseSlackConfig(t.Config)
 	if err != nil {
 		return unavailableConfigFields()
 	}
@@ -130,7 +131,7 @@ func slackConfigFields(configJSON string) []ConfigField {
 	return []ConfigField{{
 		Label: "Webhook URL",
 		Value: cfg.MaskedWebhookURL(),
-	}}
+	}, maxRetriesField(t)}
 }
 
 // httpConfigFields describes an HTTP target: its destination
@@ -170,21 +171,7 @@ func httpConfigFields(t *database.Target) []ConfigField {
 		})
 	}
 
-	return append(fields, retryFields(t)...)
+	fields = append(fields, maxRetriesField(t))
-}
-
-// retryFields describes a target's retry settings, which live
-// on the target row rather than in its configuration blob.
-func retryFields(t *database.Target) []ConfigField {
-	retries := strconv.Itoa(t.MaxRetries)
-	if t.MaxRetries == 0 {
-		retries += " (fire-and-forget)"
-	}
-
-	fields := []ConfigField{{
-		Label: "Max Retries",
-		Value: retries,
-	}}
 
 	if t.MaxQueueSize > 0 {
 		fields = append(fields, ConfigField{
@@ -196,6 +183,20 @@ func retryFields(t *database.Target) []ConfigField {
 	return fields
 }
 
+// maxRetriesField describes a target's retry count, which lives
+// on the target row rather than in its configuration blob.
+func maxRetriesField(t *database.Target) ConfigField {
+	retries := strconv.Itoa(t.MaxRetries)
+	if t.MaxRetries == 0 {
+		retries += " (fire-and-forget)"
+	}
+
+	return ConfigField{
+		Label: "Max Retries",
+		Value: retries,
+	}
+}
+
 // databaseConfigFields describes an archive target. Its
 // configuration is optional, and an absent or empty expiry
 // means the archive is kept forever. An expiry that is set

internal/delivery/target_config_view_test.go

@@ -32,6 +32,7 @@ const (
 	viewMaskedOrigin  = viewExampleOrigin + "/..."
 	viewUnavailable   = "(unavailable)"
 	viewExpiryNever   = "never"
+	viewMaxRetries    = "Max Retries"
 )
 
 func TestMaskedWebhookURL(t *testing.T) {
@@ -157,9 +158,7 @@ func TestNewTargetViews_DeletedTarget(t *testing.T) {
 		t, slackTargetName+" (deleted)", view.DisplayName(),
 	)
 	assert.Equal(
-		t,
+		t, viewFor(t, slackTarget()).Config, view.Config,
-		map[string]string{"Webhook URL": slackMaskedURL},
-		fieldMap(view.Config),
 	)
 }
 
@@ -189,7 +188,32 @@ func TestNewTargetViews_Slack(t *testing.T) {
 
 	assert.Equal(
 		t,
-		map[string]string{"Webhook URL": slackMaskedURL},
+		map[string]string{
+			"Webhook URL":  slackMaskedURL,
+			viewMaxRetries: "0 (fire-and-forget)",
+		},
+		fieldMap(view.Config),
+	)
+}
+
+// TestNewTargetViews_SlackRetries proves a Slack target shows
+// its retry count the same way an HTTP target does, and no
+// queue size even when one is stored: delivery never reads it.
+func TestNewTargetViews_SlackRetries(t *testing.T) {
+	t.Parallel()
+
+	target := slackTarget()
+	target.MaxRetries = 2
+	target.MaxQueueSize = 100
+
+	view := viewFor(t, target)
+
+	assert.Equal(
+		t,
+		map[string]string{
+			"Webhook URL":  slackMaskedURL,
+			viewMaxRetries: "2",
+		},
 		fieldMap(view.Config),
 	)
 }
@@ -214,7 +238,7 @@ func TestNewTargetViews_HTTP(t *testing.T) {
 			"Destination URL": viewMaskedOrigin,
 			"Timeout":         "30s",
 			"Headers":         "1 configured",
-			"Max Retries":     "5",
+			viewMaxRetries:    "5",
 			"Max Queue Size":  "100",
 		},
 		fields,
@@ -238,7 +262,7 @@ func TestNewTargetViews_HTTPFireAndForget(t *testing.T) {
 		t,
 		map[string]string{
 			"Destination URL": viewMaskedOrigin,
-			"Max Retries":     "0 (fire-and-forget)",
+			viewMaxRetries:    "0 (fire-and-forget)",
 		},
 		fieldMap(view.Config),
 	)

internal/handlers/source_create_targets_test.go

@@ -0,0 +1,207 @@
+package handlers_test
+
+import (
+	"errors"
+	"html"
+	"net/http"
+	"net/http/httptest"
+	"net/url"
+	"testing"
+
+	"github.com/stretchr/testify/assert"
+	"github.com/stretchr/testify/require"
+	"gorm.io/gorm"
+	"sneak.berlin/go/webhooker/internal/database"
+)
+
+// submitCreateForm posts the new webhook form and returns the
+// recorder.
+func submitCreateForm(
+	env *sourceTestEnv, form url.Values,
+) *httptest.ResponseRecorder {
+	req := formRequest("/hooks/new", env.cookies, form, nil)
+	w := httptest.NewRecorder()
+
+	env.handlers.HandleSourceCreateSubmit().ServeHTTP(w, req)
+
+	return w
+}
+
+// assertNothingCreated checks that the main database holds no webhook,
+// entrypoint or target.
+func assertNothingCreated(t *testing.T, db *database.Database) {
+	t.Helper()
+
+	for _, model := range []any{
+		&database.Webhook{}, &database.Entrypoint{}, &database.Target{},
+	} {
+		var count int64
+
+		require.NoError(t, db.DB().Model(model).Count(&count).Error)
+		assert.Zerof(t, count, "%T rows were created", model)
+	}
+}
+
+// TestHandleSourceCreateSubmit_CreatesRequestedTargets submits the new
+// webhook form with the HTTP target URL filled in or empty, and with
+// the archive checkbox off or on with each pruning choice. The webhook
+// gets an HTTP target only for a URL and a database target only for a
+// checked archive. The pruning choice is always submitted, as the
+// browser submits it while it is hidden, and is ignored when archive
+// is off.
+func TestHandleSourceCreateSubmit_CreatesRequestedTargets(t *testing.T) {
+	t.Parallel()
+
+	env := setupSourceTest(t)
+
+	// Each value the archive pruning choice submits, after an empty
+	// one that stands for the archive checkbox left off.
+	expiries := []string{
+		"", "never", "1h", "12h", "24h", "720h", "2160h", "8760h",
+	}
+
+	for _, httpURL := range []string{"", editOriginalURL} {
+		for _, expiry := range expiries {
+			name := "url=" + httpURL + " archive=" + expiry
+
+			t.Run(name, func(t *testing.T) {
+				t.Parallel()
+
+				form := url.Values{}
+				form.Set("name", name)
+				form.Set("http_url", httpURL)
+				form.Set("archive_expiry", "720h")
+
+				if expiry != "" {
+					form.Set("archive", "on")
+					form.Set("archive_expiry", expiry)
+				}
+
+				w := submitCreateForm(env, form)
+				require.Equal(t, http.StatusSeeOther, w.Code, w.Body.String())
+
+				var webhook database.Webhook
+
+				require.NoError(t, env.db.DB().
+					Where("name = ?", name).First(&webhook).Error)
+
+				byType := map[database.TargetType]database.Target{}
+				for _, target := range targetsForWebhook(t, env.db, webhook.ID) {
+					byType[target.Type] = target
+				}
+
+				wantCount := 0
+
+				if httpURL != "" {
+					wantCount++
+
+					assert.Equal(t, "HTTP", byType[database.TargetTypeHTTP].Name)
+					assert.JSONEq(t, `{"url":"`+httpURL+`"}`,
+						byType[database.TargetTypeHTTP].Config)
+				}
+
+				if expiry != "" {
+					wantCount++
+
+					assert.Equal(t, "Archive",
+						byType[database.TargetTypeDatabase].Name)
+					assert.JSONEq(t, `{"expiry":"`+expiry+`"}`,
+						byType[database.TargetTypeDatabase].Config)
+				}
+
+				assert.Len(t, byType, wantCount)
+			})
+		}
+	}
+}
+
+// TestHandleSourceCreateSubmit_RefusedFormKeepsEveryValue refuses the
+// new webhook form for an invalid HTTP target URL and for an invalid
+// retention, each with archive on. Nothing is created, and the form
+// comes back with the reason and every value entered: name,
+// description, retention, URL, the checked archive box and the pruning
+// choice.
+func TestHandleSourceCreateSubmit_RefusedFormKeepsEveryValue(
+	t *testing.T,
+) {
+	t.Parallel()
+
+	const badURL = "Invalid target URL"
+
+	cases := []struct {
+		name      string
+		retention string
+		httpURL   string
+		reason    string
+	}{
+		{"blocked url", "7", editBlockedURL, badURL},
+		{"unsupported scheme", "7", "ftp://93.184.216.34/hook", badURL},
+		{"bad retention", "-5", editOriginalURL, "Retention must be"},
+	}
+
+	for _, tc := range cases {
+		t.Run(tc.name, func(t *testing.T) {
+			t.Parallel()
+
+			env := setupSourceTest(t)
+
+			form := url.Values{}
+			form.Set("name", "kept name")
+			form.Set("description", "kept description")
+			form.Set("retention_days", tc.retention)
+			form.Set("http_url", tc.httpURL)
+			form.Set("archive", "on")
+			form.Set("archive_expiry", "2160h")
+
+			w := submitCreateForm(env, form)
+			require.Equal(t, http.StatusBadRequest, w.Code)
+
+			page := w.Body.String()
+			assert.Contains(t, page, tc.reason)
+			assert.Contains(t, page, `value="kept name"`)
+			assert.Contains(t, page, `>kept description</textarea>`)
+			assert.Contains(t, page, `value="`+tc.retention+`"`)
+			assert.Contains(t, page,
+				`value="`+html.EscapeString(tc.httpURL)+`"`)
+			assert.Contains(t, page, `name="archive" value="on" checked`)
+			assert.Contains(t, page, `x-data="collapsible" data-open`)
+			assert.Contains(t, page, `<option value="2160h" selected>`)
+
+			assertNothingCreated(t, env.db)
+		})
+	}
+}
+
+// errInjectedTargetCreate is the failure a test makes the insert of a
+// target report.
+var errInjectedTargetCreate = errors.New("injected target create failure")
+
+// TestHandleSourceCreateSubmit_FailedTargetInsertCreatesNothing makes
+// inserting a target fail after the webhook and its entrypoint were
+// inserted, and checks that neither is left behind.
+func TestHandleSourceCreateSubmit_FailedTargetInsertCreatesNothing(
+	t *testing.T,
+) {
+	t.Parallel()
+
+	env := setupSourceTest(t)
+
+	require.NoError(t, env.db.DB().Callback().Create().
+		Before("gorm:create").
+		Register("test:fail_target_create", func(tx *gorm.DB) {
+			if tx.Statement.Table == "targets" {
+				_ = tx.AddError(errInjectedTargetCreate)
+			}
+		}),
+	)
+
+	form := url.Values{}
+	form.Set("name", "rolled back")
+	form.Set("archive", "on")
+	form.Set("archive_expiry", "never")
+
+	w := submitCreateForm(env, form)
+	require.Equal(t, http.StatusInternalServerError, w.Code)
+
+	assertNothingCreated(t, env.db)
+}

internal/handlers/source_management.go

@@ -276,27 +276,41 @@ func (h *Handlers) HandleSourceCreate() http.HandlerFunc {
 	return func(w http.ResponseWriter, r *http.Request) {
 		h.renderTemplate(
 			w, r, "sources_new.html",
-			newSourceFormData("", "", ""),
+			newSourceFormData("", sourceFormInput{
+				RetentionDays: strconv.Itoa(
+					database.DefaultRetentionDays,
+				),
+			}),
 		)
 	}
 }
 
+// sourceFormInput carries the raw values of the new webhook form. A
+// refused submission is shown again from it, so every value entered
+// comes back, retention included.
+type sourceFormInput struct {
+	Name          string
+	Description   string
+	RetentionDays string
+	// HTTPURL, when not empty, asks for an HTTP target with this
+	// destination.
+	HTTPURL string
+	// Archive asks for a database (archive) target, whose rows expire
+	// after ArchiveExpiry.
+	Archive       bool
+	ArchiveExpiry string
+}
+
 // newSourceFormData builds the template data for the webhook creation
-// form.
+// form. It carries the retention default, which the form's help text
-//
+// names, from database.DefaultRetentionDays rather than a hardcoded
-// It carries the retention default so the pre-filled value comes from
+// copy of the same policy.
-// database.DefaultRetentionDays rather than being a third hardcoded
-// copy of the same policy, and it carries the submitted name and
-// description so that re-rendering the form after a validation failure
-// gives the user their input back instead of a blank form. The edit
-// form already behaves that way; create now matches it.
 func newSourceFormData(
-	errMsg, name, description string,
+	errMsg string, in sourceFormInput,
 ) map[string]any {
 	return map[string]any{
 		tmplKeyError:           errMsg,
-		"Name":                 name,
+		"Form":                 in,
-		"Description":          description,
 		"DefaultRetentionDays": database.DefaultRetentionDays,
 	}
 }
@@ -323,57 +337,112 @@ func (h *Handlers) HandleSourceCreateSubmit() http.HandlerFunc {
 			return
 		}
 
-		name := r.PostFormValue("name")
+		in := sourceFormInput{
-		description := r.PostFormValue("description")
+			Name:          r.PostFormValue("name"),
-		retentionStr := r.PostFormValue("retention_days")
+			Description:   r.PostFormValue("description"),
+			RetentionDays: r.PostFormValue("retention_days"),
+			HTTPURL:       r.PostFormValue("http_url"),
+			Archive:       r.PostFormValue("archive") != "",
+			ArchiveExpiry: r.PostFormValue("archive_expiry"),
+		}
 
-		if name == "" {
+		refuse := func(errMsg string) {
 			h.renderTemplateStatus(
 				w, r, "sources_new.html",
-				newSourceFormData(
+				newSourceFormData(errMsg, in),
-					"Name is required", name, description,
-				),
 				http.StatusBadRequest,
 			)
+		}
+
+		if in.Name == "" {
+			refuse("Name is required")
 
 			return
 		}
 
 		retentionDays, errMsg := parseRetentionDays(
-			retentionStr, database.DefaultRetentionDays,
+			in.RetentionDays, database.DefaultRetentionDays,
 		)
 		if errMsg != "" {
-			h.renderTemplateStatus(
+			refuse(errMsg)
-				w, r, "sources_new.html",
-				newSourceFormData(errMsg, name, description),
-				http.StatusBadRequest,
-			)
 
 			return
 		}
 
-		h.createWebhookWithEntrypoint(
+		targets, errMsg, err := h.newWebhookTargets(r.Context(), in)
-			w, r, userID, name, description, retentionDays,
+		if err != nil {
-		)
+			h.serverError(w, r, "failed to encode target config", err)
+
+			return
+		}
+
+		if errMsg != "" {
+			refuse(errMsg)
+
+			return
+		}
+
+		h.createWebhookWithEntrypoint(w, r, &database.Webhook{
+			UserID:        userID,
+			Name:          in.Name,
+			Description:   in.Description,
+			RetentionDays: retentionDays,
+		}, targets)
 	}
 }
 
-// createWebhookWithEntrypoint creates a webhook and its default
+// newWebhookTargets validates the targets the new webhook form asks
-// entrypoint in a transaction.
+// for and returns the rows to create with the webhook, or the message
+// the form shows for the first one it refuses. A filled-in HTTP URL
+// asks for an HTTP target named "HTTP", and the archive checkbox for a
+// database target named "Archive". Each goes through newTarget, as on
+// the webhook page's add target form. The rows have no WebhookID yet:
+// the webhook has no ID until it is created.
+func (h *Handlers) newWebhookTargets(
+	ctx context.Context,
+	in sourceFormInput,
+) ([]*database.Target, string, error) {
+	var requested []targetFormInput
+
+	if in.HTTPURL != "" {
+		requested = append(requested, targetFormInput{
+			Name: "HTTP",
+			Type: database.TargetTypeHTTP,
+			URL:  in.HTTPURL,
+		})
+	}
+
+	if in.Archive {
+		requested = append(requested, targetFormInput{
+			Name:   "Archive",
+			Type:   database.TargetTypeDatabase,
+			Expiry: in.ArchiveExpiry,
+		})
+	}
+
+	targets := make([]*database.Target, 0, len(requested))
+
+	for _, form := range requested {
+		target, errMsg, err := h.newTarget(ctx, "", form)
+		if err != nil || errMsg != "" {
+			return nil, errMsg, err
+		}
+
+		targets = append(targets, target)
+	}
+
+	return targets, "", nil
+}
+
+// createWebhookWithEntrypoint creates a webhook, its default
+// entrypoint and the given targets in a transaction.
 func (h *Handlers) createWebhookWithEntrypoint(
 	w http.ResponseWriter,
 	r *http.Request,
-	userID, name, description string,
+	webhook *database.Webhook,
-	retentionDays int,
+	targets []*database.Target,
 ) {
-	webhook := &database.Webhook{
+	err := h.commitWebhook(webhook, targets)
-		UserID:        userID,
-		Name:          name,
-		Description:   description,
-		RetentionDays: retentionDays,
-	}
-
-	err := h.commitWebhook(webhook)
 	if err != nil {
 		h.serverError(w, r, "failed to create webhook", err)
 
@@ -390,7 +459,7 @@ func (h *Handlers) createWebhookWithEntrypoint(
 
 	h.log.Info("webhook created",
 		"webhook_id", webhook.ID,
-		"name", name, "user_id", userID,
+		"name", webhook.Name, "user_id", webhook.UserID,
 	)
 
 	http.Redirect(
@@ -399,10 +468,12 @@ func (h *Handlers) createWebhookWithEntrypoint(
 	)
 }
 
-// commitWebhook creates a webhook and default entrypoint in
+// commitWebhook creates a webhook, its default entrypoint and the
-// a transaction. Returns an error on failure (rolls back).
+// given targets in a transaction. Returns an error on failure (rolls
+// back).
 func (h *Handlers) commitWebhook(
 	webhook *database.Webhook,
+	targets []*database.Target,
 ) error {
 	tx := h.db.DB().Begin()
 	if tx.Error != nil {
@@ -430,6 +501,17 @@ func (h *Handlers) commitWebhook(
 		return err
 	}
 
+	for _, target := range targets {
+		target.WebhookID = webhook.ID
+
+		err = tx.Create(target).Error
+		if err != nil {
+			tx.Rollback()
+
+			return err
+		}
+	}
+
 	return tx.Commit().Error
 }
 

internal/handlers/ui_copy_test.go

@@ -196,8 +196,6 @@ func TestCreateFormRetentionCopyMatchesBehaviour(t *testing.T) {
 	t.Cleanup(app.RequireStop)
 
 	body := renderPage(t, h, sess, "sources_new.html", map[string]any{
-		"Name":                 "",
-		"Description":          "",
 		"DefaultRetentionDays": database.DefaultRetentionDays,
 		dataKeyError:           "",
 	})

internal/server/alpine_browser_test.go

@@ -59,6 +59,44 @@ func TestAlpineRunsUnderTheSecurityPolicy(t *testing.T) {
 	t.Cleanup(srv.Close)
 
 	userID, _ := env.seedUser(t, "browser", "browser-password")
+	webhook, event, target := seedBrowserWebhook(t, env, userID)
+
+	require.NoError(t, chromedp.Run(
+		ctx, setCookies(srv.URL, env.authCookies(t, userID, "browser")),
+	))
+
+	page := srv.URL + "/hook/" + webhook.ID
+
+	// The checks share one browser tab, so they run one at a time, in
+	// this order. A new check is one more line here.
+	checkAddEntrypoint(ctx, t, page)
+	checkAddEachTargetType(ctx, t, page)
+	checkRefusedTarget(ctx, t, page)
+	checkTargetDeliveries(ctx, t, page, target.Name,
+		"0 in total, 0 in the last 24 hours",
+		"1 in total, 1 in the last 24 hours")
+	checkRefusedEdits(ctx, t, page, target.ID)
+	checkCopy(ctx, t, page)
+	checkEntrypointEdit(ctx, t, page, page+"/events")
+	checkRecentEvents(ctx, t, page)
+	checkEventLog(ctx, t, page+"/events", event.ID, target.Name)
+	checkArchiveChoice(ctx, t, srv.URL+"/hooks/new", page)
+	checkNewWebhookTargets(ctx, t, env, srv.URL+"/hooks/new")
+	checkRefusedNewWebhook(ctx, t, srv.URL+"/hooks/new")
+	checkMobileMenu(ctx, t, page)
+
+	assert.Empty(t, problems(), "the browser reported problems")
+}
+
+// seedBrowserWebhook seeds the webhook the browser test loads, owned by
+// userID: an entrypoint, two events, and a target whose delivery of the
+// newer event failed once with a 502. It returns the webhook, the newer
+// event and the target.
+func seedBrowserWebhook(
+	t *testing.T, env *testEnv, userID string,
+) (*database.Webhook, *database.Event, *database.Target) {
+	t.Helper()
+
 	webhook := env.seedWebhook(t, userID)
 	require.NoError(t, env.db.DB().Omit(clause.Associations).Create(
 		&database.Entrypoint{
@@ -82,54 +120,7 @@ func TestAlpineRunsUnderTheSecurityPolicy(t *testing.T) {
 		},
 	).Error)
 
-	require.NoError(t, chromedp.Run(
+	return webhook, event, target
-		ctx, setCookies(srv.URL, env.authCookies(t, userID, "browser")),
-	))
-
-	page := srv.URL + "/hook/" + webhook.ID
-
-	checkAddEntrypoint(ctx, t, page)
-
-	// Each target type, with the fields its add target form submits, in
-	// page order. Only http and slack have a url field.
-	targetTypes := []struct {
-		name   string
-		fields string
-		values map[string]string
-	}{
-		{
-			"http", "csrf_token name type url headers timeout max_retries",
-			map[string]string{"url": publicTargetURL},
-		},
-		{
-			"slack", "csrf_token name type url max_retries",
-			map[string]string{"url": publicTargetURL},
-		},
-		{
-			"database", "csrf_token name type expiry",
-			map[string]string{"expiry": "720h"},
-		},
-		{"log", "csrf_token name type", nil},
-	}
-
-	for _, tt := range targetTypes {
-		checkAddTarget(
-			ctx, t, page, tt.name, strings.Fields(tt.fields), tt.values,
-		)
-	}
-
-	checkRefusedTarget(ctx, t, page)
-	checkTargetDeliveries(ctx, t, page, target.Name,
-		"0 in total, 0 in the last 24 hours",
-		"1 in total, 1 in the last 24 hours")
-	checkRefusedEdits(ctx, t, page, target.ID)
-	checkCopy(ctx, t, page)
-	checkEntrypointEdit(ctx, t, page, page+"/events")
-	checkRecentEvents(ctx, t, page)
-	checkEventLog(ctx, t, page+"/events", event.ID, target.Name)
-	checkMobileMenu(ctx, t, page)
-
-	assert.Empty(t, problems(), "the browser reported problems")
 }
 
 // startBrowser starts a headless browser for one test. It returns the
@@ -308,6 +299,40 @@ const (
 		document.querySelector('form[action$="/targets"]')).keys()]`
 )
 
+// checkAddEachTargetType runs checkAddTarget on a webhook page for each
+// target type, in page order.
+func checkAddEachTargetType(ctx context.Context, t *testing.T, url string) {
+	t.Helper()
+
+	// Each target type, with the fields its add target form submits, in
+	// page order. Only http and slack have a url field.
+	targetTypes := []struct {
+		name   string
+		fields string
+		values map[string]string
+	}{
+		{
+			"http", "csrf_token name type url headers timeout max_retries",
+			map[string]string{"url": publicTargetURL},
+		},
+		{
+			"slack", "csrf_token name type url max_retries",
+			map[string]string{"url": publicTargetURL},
+		},
+		{
+			"database", "csrf_token name type expiry",
+			map[string]string{"expiry": "720h"},
+		},
+		{"log", "csrf_token name type", nil},
+	}
+
+	for _, tt := range targetTypes {
+		checkAddTarget(
+			ctx, t, url, tt.name, strings.Fields(tt.fields), tt.values,
+		)
+	}
+}
+
 // checkAddTarget loads a webhook page and walks the add target form for
 // one target type. The form shows nothing until Add is clicked; Add
 // shows only the type choice; Cancel there closes it; Next shows the
@@ -727,6 +752,199 @@ func checkEventLog(
 		"clicking the event again does not collapse it")
 }
 
+// The parts of the new webhook page the checks below find and click.
+const (
+	archiveBox    = `//input[@name="archive"]`
+	archiveIsOn   = `document.querySelector('input[name="archive"]').checked`
+	pruningChoice = `//select[@name="archive_expiry"]`
+	createButton  = `//button[text()="Create Webhook"]`
+)
+
+// checkArchiveChoice loads the new webhook page and checks that the
+// archive pruning choice stays hidden until the archive box is checked
+// and hides again when it is unchecked; and that after checking it,
+// opening the page at elsewhere and going back, the page again shows
+// the box unchecked and the choice hidden.
+func checkArchiveChoice(
+	ctx context.Context, t *testing.T, url, elsewhere string,
+) {
+	t.Helper()
+
+	require.NoError(t, chromedp.Run(ctx, loadPage(url)))
+
+	assert.True(t, hidden(ctx, pruningChoice),
+		"the pruning choice shows before archive is checked")
+
+	click(ctx, t, archiveBox)
+	assert.True(t, shown(ctx, pruningChoice),
+		"checking archive does not show the pruning choice")
+
+	click(ctx, t, archiveBox)
+	assert.True(t, hidden(ctx, pruningChoice),
+		"unchecking archive does not hide the pruning choice")
+
+	var (
+		loaded  string
+		checked bool
+	)
+
+	click(ctx, t, archiveBox)
+	require.NoError(t, chromedp.Run(
+		ctx,
+		loadPage(elsewhere),
+		chromedp.NavigateBack(),
+		chromedp.WaitNotPresent("[x-cloak]", chromedp.ByQuery),
+		chromedp.Evaluate(
+			`performance.getEntriesByType("navigation")[0].type`, &loaded,
+		),
+		chromedp.Evaluate(archiveIsOn, &checked),
+	))
+	require.Equal(
+		t, "back_forward", loaded,
+		"going back, the browser did not load the page again",
+	)
+
+	assert.False(t, checked, "going back leaves archive checked")
+	assert.True(t, hidden(ctx, pruningChoice),
+		"going back shows the pruning choice")
+}
+
+// checkNewWebhookTargets submits the new webhook page with the HTTP
+// target URL filled in or empty, and with archive left off or checked
+// with each pruning choice, and checks that each webhook is created
+// with exactly the targets asked for.
+func checkNewWebhookTargets(
+	ctx context.Context, t *testing.T, env *testEnv, url string,
+) {
+	t.Helper()
+
+	// Each value the pruning choice submits, after an empty one that
+	// stands for archive left off.
+	expiries := []string{
+		"", "never", "1h", "12h", "24h", "720h", "2160h", "8760h",
+	}
+
+	for _, httpURL := range []string{"", publicTargetURL} {
+		for _, expiry := range expiries {
+			name := "url=" + httpURL + " archive=" + expiry
+			want := map[database.TargetType]string{}
+
+			require.NoError(t, chromedp.Run(
+				ctx,
+				loadPage(url),
+				chromedp.SetValue("#name", name, chromedp.ByQuery),
+			))
+
+			if httpURL != "" {
+				require.NoError(t, chromedp.Run(ctx, chromedp.SetValue(
+					"#http_url", httpURL, chromedp.ByQuery,
+				)))
+
+				want[database.TargetTypeHTTP] = `{"url":"` + httpURL + `"}`
+			}
+
+			if expiry != "" {
+				// The choice showing moves Create down, so it is
+				// waited for before Create is clicked.
+				click(ctx, t, archiveBox)
+				require.Truef(t, shown(ctx, pruningChoice),
+					"%s: checking archive does not show the pruning choice",
+					name)
+				require.NoError(t, chromedp.Run(ctx, chromedp.SetValue(
+					pruningChoice, expiry, chromedp.BySearch,
+				)))
+
+				want[database.TargetTypeDatabase] = `{"expiry":"` + expiry + `"}`
+			}
+
+			click(ctx, t, createButton)
+			require.Truef(t, shown(ctx, `//h1[text()="`+name+`"]`),
+				"%s: the new webhook's page does not open", name)
+
+			assert.Equalf(t, want, targetConfigs(t, env, name),
+				"%s: the webhook does not have the targets asked for", name)
+		}
+	}
+}
+
+// targetConfigs reads the targets of the webhook named name, and
+// returns each one's stored configuration by its type.
+func targetConfigs(
+	t *testing.T, env *testEnv, name string,
+) map[database.TargetType]string {
+	t.Helper()
+
+	var (
+		webhook database.Webhook
+		targets []database.Target
+	)
+
+	require.NoError(t, env.db.DB().
+		Where("name = ?", name).First(&webhook).Error)
+	require.NoError(t, env.db.DB().
+		Where("webhook_id = ?", webhook.ID).Find(&targets).Error)
+
+	configs := map[database.TargetType]string{}
+	for _, target := range targets {
+		configs[target.Type] = target.Config
+	}
+
+	return configs
+}
+
+// checkRefusedNewWebhook submits the new webhook page with archive
+// checked and an HTTP target URL the server refuses, a loopback
+// destination, and checks that the page comes back with the reason and
+// every value entered, archive still checked and its pruning choice
+// showing.
+func checkRefusedNewWebhook(ctx context.Context, t *testing.T, url string) {
+	t.Helper()
+
+	const refusedURL = "http://127.0.0.1/hook"
+
+	require.NoError(t, chromedp.Run(
+		ctx,
+		loadPage(url),
+		chromedp.SetValue("#name", "refused", chromedp.ByQuery),
+		chromedp.SetValue("#description", "kept", chromedp.ByQuery),
+		chromedp.SetValue("#retention_days", "7", chromedp.ByQuery),
+		chromedp.SetValue("#http_url", refusedURL, chromedp.ByQuery),
+	))
+	click(ctx, t, archiveBox)
+	require.True(t, shown(ctx, pruningChoice),
+		"checking archive does not show the pruning choice")
+	require.NoError(t, chromedp.Run(ctx, chromedp.SetValue(
+		pruningChoice, "2160h", chromedp.BySearch,
+	)))
+	click(ctx, t, createButton)
+
+	assert.True(t, shown(ctx, `//div[@class="alert-error"]`),
+		"a refused webhook does not show the reason")
+
+	var (
+		name, description, retention, typed, expiry string
+		checked                                     bool
+	)
+
+	require.NoError(t, chromedp.Run(
+		ctx,
+		chromedp.Value("#name", &name, chromedp.ByQuery),
+		chromedp.Value("#description", &description, chromedp.ByQuery),
+		chromedp.Value("#retention_days", &retention, chromedp.ByQuery),
+		chromedp.Value("#http_url", &typed, chromedp.ByQuery),
+		chromedp.Value("#archive_expiry", &expiry, chromedp.ByQuery),
+		chromedp.Evaluate(archiveIsOn, &checked),
+	))
+
+	assert.Equal(t, "refused", name, "the name entered is lost")
+	assert.Equal(t, "kept", description, "the description entered is lost")
+	assert.Equal(t, "7", retention, "the retention entered is lost")
+	assert.Equal(t, refusedURL, typed, "the url entered is lost")
+	assert.True(t, checked, "archive is no longer checked")
+	assert.True(t, shown(ctx, pruningChoice), "the pruning choice is hidden")
+	assert.Equal(t, "2160h", expiry, "the pruning chosen is lost")
+}
+
 // checkMobileMenu loads a page in a phone-sized window and checks that
 // the menu button opens and closes the mobile menu.
 func checkMobileMenu(ctx context.Context, t *testing.T, url string) {

script/bootstrap

@@ -60,9 +60,9 @@ main() {
     if missing go; then pkg_install go golang go go; fi
 
     # Not installed here: docker is platform-specific and out of scope for a
-    # package-manager bootstrap, but script/lint needs it.
+    # package-manager bootstrap, but script/lint and script/css need it.
     if missing docker; then
-        echo "bootstrap: docker not found; script/lint requires it" >&2
+        echo "bootstrap: docker not found; script/lint and script/css require it" >&2
     fi
 
     go mod download

script/check

@@ -1,8 +1,8 @@
 #!/bin/sh
-# script/check: run all checks (test, lint, fmt-check). Our own
+# script/check: run all checks (test, lint, fmt-check, css-check). Our own
 # extension to scripts-to-rule-them-all.
 # Writes only the ignored static/js/alpine.min.js, through script/test.
-# Generic: usually needs no adaptation.
+# Generic, apart from css-check.
 set -eu
 
 SCRIPT_DIR="$(cd "$(dirname "$0")" && pwd -P)"
@@ -11,6 +11,7 @@ main() {
     "$SCRIPT_DIR/test"
     "$SCRIPT_DIR/lint"
     "$SCRIPT_DIR/fmt-check"
+    "$SCRIPT_DIR/css-check"
 }
 
 main "$@"

script/css

@@ -0,0 +1,15 @@
+#!/bin/sh
+# script/css: regenerate static/css/tailwind.css (writes). tailwindcss is
+# never installed locally: it runs in docker, at the version and sha256
+# pinned in the Dockerfile's stylesheet stages, which also say what the
+# stylesheet is generated from.
+set -eu
+
+ROOT="$(cd "$(dirname "$0")/.." && pwd -P)"
+
+main() {
+    cd "$ROOT"
+    docker build --target css-output --output type=local,dest=static/css .
+}
+
+main "$@"

script/css-check

@@ -0,0 +1,14 @@
+#!/bin/sh
+# script/css-check: fail when static/css/tailwind.css differs from what
+# script/css would generate (read-only). The comparison is the Dockerfile's
+# css-check stage, which the image build runs too.
+set -eu
+
+ROOT="$(cd "$(dirname "$0")/.." && pwd -P)"
+
+main() {
+    cd "$ROOT"
+    docker build --target css-check --output type=cacheonly .
+}
+
+main "$@"

static/css/input.css

@@ -1,7 +1,10 @@
-@import "tailwindcss";
+/* Classes are taken only from the files named below. A class written in
-
+   any other file is not generated: name that file here too. */
-/* Source the templates */
+@import "tailwindcss" source(none);
 @source "../../templates/**/*.html";
+@source "../js/app.js";
+/* targetStatus picks a target's status colour class */
+@source "../../internal/handlers/recent_events.go";
 
 /* Material Design inspired theme customization */
 @theme {
@@ -53,10 +56,6 @@
     @apply inline-flex items-center justify-center px-4 py-2 rounded-md font-medium text-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed bg-error-500 text-white hover:bg-error-700 active:bg-red-800 focus:ring-red-500 shadow-elevation-1 hover:shadow-elevation-2;
   }
 
-  .btn-text {
-    @apply inline-flex items-center justify-center px-4 py-2 rounded-md font-medium text-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed text-primary-600 hover:bg-primary-50 active:bg-primary-100;
-  }
-
   /* Cards */
   .card {
     @apply bg-white rounded-lg shadow-elevation-1 overflow-hidden;

static/js/app.js

@@ -71,8 +71,9 @@ document.addEventListener("alpine:init", function () {
 
     // Something a click shows and hides: the mobile menu, an add form,
     // an entrypoint's edit form, an event in the event log or in the
-    // recent events, a delivery's attempts. It starts hidden, or shown
+    // recent events, a delivery's attempts, the new webhook page's
-    // when its element has the data-open attribute.
+    // archive pruning choice. It starts hidden, or shown when its
+    // element has the data-open attribute.
     window.Alpine.data("collapsible", function () {
         return {
             open: false,

templates/sources_new.html

@@ -18,20 +18,50 @@
             <input type="hidden" name="csrf_token" value="{{.CSRFToken}}">
             <div class="form-group">
                 <label for="name" class="label">Name</label>
-                <input type="text" id="name" name="name" value="{{.Name}}" required autofocus placeholder="My Webhook" class="input">
+                <input type="text" id="name" name="name" value="{{.Form.Name}}" required autofocus placeholder="My Webhook" class="input">
             </div>
 
             <div class="form-group">
                 <label for="description" class="label">Description</label>
-                <textarea id="description" name="description" rows="3" placeholder="Optional description" class="input">{{.Description}}</textarea>
+                <textarea id="description" name="description" rows="3" placeholder="Optional description" class="input">{{.Form.Description}}</textarea>
             </div>
 
             <div class="form-group">
                 <label for="retention_days" class="label">Retention (days)</label>
-                <input type="number" id="retention_days" name="retention_days" value="{{.DefaultRetentionDays}}" min="0" class="input">
+                <input type="number" id="retention_days" name="retention_days" value="{{.Form.RetentionDays}}" min="0" class="input">
                 <p class="text-xs text-gray-500 mt-1">A periodic cleanup permanently deletes events older than this, along with their delivery records. Enter 0 to retain events forever; leave blank to use the default of {{.DefaultRetentionDays}} days.</p>
             </div>
 
+            <div class="form-group">
+                <label for="http_url" class="label">HTTP target URL</label>
+                <input type="url" id="http_url" name="http_url" value="{{.Form.HTTPURL}}" placeholder="https://example.com/webhook" class="input">
+                <p class="text-xs text-gray-500 mt-1">Optional. When filled in, the webhook is created with an HTTP target that delivers each event to this URL.</p>
+            </div>
+
+            <!-- The checkbox shows the pruning choice while checked. With
+                 autocomplete="off", going back to the page does not
+                 check the box again with the choice hidden. -->
+            <div class="form-group" x-data="collapsible"{{if .Form.Archive}} data-open{{end}}>
+                <label class="flex items-center gap-2 text-sm font-medium text-gray-700">
+                    <input type="checkbox" name="archive" value="on"{{if .Form.Archive}} checked{{end}} autocomplete="off" @change="toggle" class="h-4 w-4">
+                    Archive
+                </label>
+                <p class="text-xs text-gray-500 mt-1">When checked, the webhook is created with a database target that keeps a copy of every event.</p>
+                <div x-show="open" x-cloak class="mt-3">
+                    <label for="archive_expiry" class="label">Archive pruning</label>
+                    <select id="archive_expiry" name="archive_expiry" class="input">
+                        <option value="never"{{if eq .Form.ArchiveExpiry "never"}} selected{{end}}>never</option>
+                        <option value="1h"{{if eq .Form.ArchiveExpiry "1h"}} selected{{end}}>1h</option>
+                        <option value="12h"{{if eq .Form.ArchiveExpiry "12h"}} selected{{end}}>12h</option>
+                        <option value="24h"{{if eq .Form.ArchiveExpiry "24h"}} selected{{end}}>24h</option>
+                        <option value="720h"{{if eq .Form.ArchiveExpiry "720h"}} selected{{end}}>30d</option>
+                        <option value="2160h"{{if eq .Form.ArchiveExpiry "2160h"}} selected{{end}}>90d</option>
+                        <option value="8760h"{{if eq .Form.ArchiveExpiry "8760h"}} selected{{end}}>365d</option>
+                    </select>
+                    <p class="text-xs text-gray-500 mt-1">Archived events older than this are deleted from the archive; never keeps them all.</p>
+                </div>
+            </div>
+
             <div class="flex gap-3">
                 <button type="submit" class="btn-primary">Create Webhook</button>
                 <a href="/hooks" class="btn-secondary">Cancel</a>