`)
+ got = partial(t, "page_head", Head{Title: "T", ID: "h", OOB: true})
+ mustContain(t, got, `
`)
+}
diff --git a/internal/web/view/fixtures_test.go b/internal/web/view/fixtures_test.go
index a9c6151..1cf1f51 100644
--- a/internal/web/view/fixtures_test.go
+++ b/internal/web/view/fixtures_test.go
@@ -1,5 +1,10 @@
package view
+import (
+ "strconv"
+ "time"
+)
+
// pageFixtures is the data each redesigned page is rendered with by the guard
// tests (guard_panel_test.go): one entry per page that has left
// legacy_pages.txt, keyed by the page's engine name. The guards render the page
@@ -18,4 +23,91 @@ var pageFixtures = map[string]func() any{
"components": func() any { return KitPage() },
"login": func() any { return NewLogin("mail.example.org", "") },
"setup": func() any { return NewSetup("0123456789abcdef", "") },
+ "overview": func() any { return overviewFixture() },
+ "health": func() any { return healthFixture(false) },
+ "account": func() any { return accountFixture() },
+ "settings": func() any { return settingsFixture() },
+}
+
+// admin is the signed-in global administrator every fixture is rendered for.
+func admin() Meta { return Meta{User: "admin", IsGlobal: true} }
+
+// overviewFixture is the mockup's Overview: one certificate warning among six
+// checks, three outbound domains and two inbound.
+func overviewFixture() *Overview {
+ cards := []HealthCard{
+ {Name: "Machine", Value: "CPU 12%", Sub: "RAM 41%", Icon: "ti-cpu", Href: "/server/health#machine"},
+ {Name: "Processes", Value: "5 of 5 running", Sub: "all programs", Icon: "ti-server-cog", Href: "/server/health#processes"},
+ {Name: "TLS certificate", Value: "Expires in 12 days", Sub: "mail.example.org", Icon: "ti-certificate", Href: "/server/health#certificate", Level: LevelWarn},
+ {Name: "Queue", Value: "Empty", Sub: "outbound", Icon: "ti-stack-2", Href: "/outbound/queue"},
+ {Name: "Milter sockets", Value: "2 of 2 answering", Sub: "OpenDKIM, send-log", Icon: "ti-plug-connected", Href: "/server/health#sockets"},
+ {Name: "Reverse DNS", Value: "Forward = reverse", Sub: "mail.example.org", Icon: "ti-arrows-exchange", Href: "/server/health#hostname"},
+ }
+ o := NewOverview(admin(), "mail.example.org", cards, time.Date(2026, 10, 9, 14, 2, 31, 0, time.UTC), 30, true)
+ dns := func(dkim, spf, dmarc string) []Tag {
+ return []Tag{{Status: dkim, Label: "DKIM"}, {Status: spf, Label: "SPF"}, {Status: dmarc, Label: "DMARC"}}
+ }
+ o.OutboundRows = []OverviewDomain{
+ {Name: "example.org", Href: "/outbound/domains/1", DNS: dns("ok", "error", "ok"), Apps: 2, Messages: FormatMessages(1284)},
+ {Name: "shop.example.org", Href: "/outbound/domains/2", DNS: dns("ok", "ok", "ok"), Apps: 1, Messages: FormatMessages(18920)},
+ {Name: "notify.acme.io", Href: "/outbound/domains/3", DNS: dns("ok", "ok", "warn"), Apps: 3, Messages: FormatMessages(402)},
+ }
+ o.InboundRows = []OverviewInbound{
+ {Name: "lists.example.org", Href: "/inbound/domains/1", MX: Tag{Status: "ok", Label: "MX"}, Upstream: "mx.internal:25"},
+ {Name: "acme.io", Href: "/inbound/domains/2", MX: Tag{Status: "ok", Label: "MX"}, Upstream: "10.0.4.12:2525"},
+ }
+ return o
+}
+
+// healthFixture is the mockup's Health: a healthy machine and five processes,
+// a certificate close to expiry, the two milter sockets and a good reverse
+// record. refresh renders it as the polled fragment.
+func healthFixture(refresh bool) *Health {
+ h := NewHealth(admin(), "")
+ h.Refresh = refresh
+ h.Machine.End = Verdict("ok")
+ h.MachineRows = []MachineRow{
+ {Resource: "CPU", Gauge: &Gauge{Percent: 12, Text: "12%", Level: LevelOK}, Detail: []string{"2 cores · 2 threads"}},
+ {Resource: "Memory", Gauge: &Gauge{Percent: 41, Text: "41%", Level: LevelOK}, Detail: []string{"812.0 MiB used of 1.9 GiB"}},
+ {Resource: "Network", Usage: "↓ 18.0 KiB/s · ↑ 44.0 KiB/s", Detail: []string{"eth0: 2.1 GiB in, 6.4 GiB out"}},
+ }
+ h.Processes.End = Verdict("ok")
+ for i, name := range []string{"postfix", "opendkim", "journal-milter", "panel", "dmarc-ingest"} {
+ h.ProcessRows = append(h.ProcessRows, ProcessRow{Name: name, State: Tag{Status: "ok", Label: "running"},
+ Detail: "pid " + strconv.Itoa(41-i) + ", uptime 18 days"})
+ }
+ h.Certificate.End = Verdict("warn")
+ h.CertFacts = []Fact{
+ {Label: "Expires", Value: Plain("2026-10-21 09:14 UTC"), Mono: true},
+ {Label: "Names", Value: Plain("mail.example.org"), Mono: true},
+ }
+ h.CertDetail, h.CertProblem = "Expires in 12 day(s). Check that renewal on the host still works.", true
+ h.Sockets.End = Verdict("ok")
+ h.SocketRows = []SocketRow{
+ {Name: "OpenDKIM", Path: "inet:127.0.0.1:8891", State: Tag{Status: "ok"}},
+ {Name: "send-log", Path: "unix:/run/selfpost/journal.sock", State: Tag{Status: "ok"}},
+ }
+ h.Hostname.End = Verdict("ok")
+ h.HostFacts = []Fact{
+ {Label: "Hostname", Value: Plain("mail.example.org"), Mono: true},
+ {Label: "Lookup", Value: Rich("→ 203.0.113.25", Br(), "← mail.example.org"), Mono: true},
+ }
+ return h
+}
+
+// accountFixture is the mockup's Account: the global administrator, their
+// e-mail as the DMARC default, and the authorization record that default needs.
+func accountFixture() *Account {
+ m := admin()
+ a := NewAccount(m, "global", true, "mix@example.org")
+ a.Username, a.Email = "admin", "mix@example.org"
+ a.DMARCSelected = DMARCChoiceAccount
+ a.WithDomainUse(2, 3)
+ return a.WithAuthorization("*._report._dmarc.example.org", "v=DMARC1;", "ok", "", nil)
+}
+
+// settingsFixture is the mockup's Settings: thirty days of log, a limit of 600
+// messages an hour.
+func settingsFixture() *Settings {
+ return NewSettings(admin(), "30", FormatRate(600, 3600))
}
diff --git a/internal/web/view/health.go b/internal/web/view/health.go
new file mode 100644
index 0000000..37c7a2a
--- /dev/null
+++ b/internal/web/view/health.go
@@ -0,0 +1,118 @@
+package view
+
+// The data of Server › Health (templates/health.html, mockup health.html):
+// every check behind the cards of Overview, as tables, and the home of the two
+// server actions, Re-check DNS and Reload configuration.
+//
+// Two rows of the page are polled (templates/health_body.html): the handler
+// builds the same Health for the page and for its fragment, and the fragment
+// carries Refresh so that its second row is swapped in out of band.
+
+// Health is the data of the Health page.
+type Health struct {
+ Meta
+ Head Head
+ Flash *Flash
+ // Refresh is set on the polled fragment only. The fragment answers with two
+ // sibling rows; the first replaces the element that polls, and the second
+ // is marked to be swapped into place by its id.
+ Refresh bool
+
+ Machine Box
+ MachineRows []MachineRow
+
+ Processes Box
+ ProcessRows []ProcessRow
+ ProcessError bool
+
+ Certificate Box
+ CertFacts []Fact
+ CertDetail string
+ CertProblem bool
+
+ Sockets Box
+ SocketRows []SocketRow
+ Hostname Box
+ HostFacts []Fact
+ Configuration Box
+ Reload Action
+}
+
+// MachineRow is one line of the Machine table. A row that is a level (CPU,
+// memory) carries a Gauge; one that is a rate (network) carries Usage text; a
+// reading that could not be taken carries neither and shows a dash. Detail is
+// the supporting text, one line each.
+type MachineRow struct {
+ Resource string
+ Gauge *Gauge
+ Usage string
+ Detail []string
+}
+
+// Gauge is a reading shown as a bar and its figure: Percent fills the bar, Text
+// is the figure printed beside it, and Level (ok, warn or fail) colours it.
+type Gauge struct {
+ Percent int
+ Text string
+ Level string
+}
+
+// Bar is the Bulma class that colours the gauge's progress bar.
+func (g Gauge) Bar() string {
+ switch g.Level {
+ case LevelFail:
+ return "is-danger"
+ case LevelWarn:
+ return "is-warning"
+ }
+ return "is-success"
+}
+
+// ProcessRow is one supervised program: its name, its state as a tag and what
+// supervisord said about it.
+type ProcessRow struct {
+ Name string
+ State Tag
+ Detail string
+}
+
+// SocketRow is one milter socket. Note qualifies the name ("inbound spam
+// filter"); Detail is shown only when the socket is not fine, since "Listening"
+// says nothing the tag does not.
+type SocketRow struct {
+ Name string
+ Note string
+ Path string
+ State Tag
+ Detail string
+}
+
+// NewHealth builds the page around its content. The handler fills the tables;
+// the boxes, the head and the reload action are the page's own.
+func NewHealth(m Meta, flash string) *Health {
+ m.Title, m.Section, m.Page = "Health", "server", "health"
+ h := &Health{
+ Meta: m,
+ Head: Head{
+ Kicker: "Server",
+ Title: "Health",
+ Lead: Plain("Everything behind the cards on Overview. Refreshes automatically."),
+ Actions: []Action{{Label: "Re-check DNS", Icon: "ti-refresh", Post: "/server/health/recheck"}},
+ },
+ Machine: Box{No: "01", Title: "Machine", ID: "machine"},
+ Processes: Box{No: "02", Title: "Processes", ID: "processes"},
+ Certificate: Box{No: "03", Title: "TLS certificate", ID: "certificate"},
+ Sockets: Box{No: "04", Title: "Milter sockets", ID: "sockets"},
+ Hostname: Box{No: "05", Title: "Hostname and reverse DNS", ID: "hostname"},
+ Configuration: Box{No: "06", Title: "Configuration", ID: "configuration",
+ End: Plain("Safe to run at any time")},
+ Reload: Action{Label: "Reload configuration", Icon: "ti-reload", Post: "/server/health/reload"},
+ }
+ if flash != "" {
+ h.Flash = &Flash{Text: Plain(flash)}
+ }
+ return h
+}
+
+// Verdict puts a check's status in the end slot of its box, as the mockup does.
+func Verdict(status string) Text { return Text{TagOf(status, "")} }
diff --git a/internal/web/view/legacy_pages.txt b/internal/web/view/legacy_pages.txt
index 88cf13c..05a73c0 100644
--- a/internal/web/view/legacy_pages.txt
+++ b/internal/web/view/legacy_pages.txt
@@ -24,8 +24,6 @@ inbound
inbound_delete
inbound_domain
mail_queue
-settings
-status
system_log
user_delete
user_form
diff --git a/internal/web/view/overview.go b/internal/web/view/overview.go
new file mode 100644
index 0000000..c90d5ee
--- /dev/null
+++ b/internal/web/view/overview.go
@@ -0,0 +1,152 @@
+package view
+
+// The data of Overview (templates/overview.html, mockup overview.html): the
+// answer to "is mail flowing?" in a postmark and six cards, and under them the
+// two kinds of domain at a glance. Everything behind the cards is on Health
+// (health.go).
+
+import (
+ "fmt"
+ "strconv"
+ "strings"
+ "time"
+)
+
+// Overview is the data of the Overview page. Cards are the checks of Health
+// reduced to a verdict each; the head's postmark and sentence are derived from
+// them by NewOverview, so the stamp and the cards cannot disagree.
+//
+// The inbound box is drawn only when the inbound relay is on (InboundOn):
+// without it the outbound box takes the whole width and nothing on the page
+// points at /inbound/domains.
+type Overview struct {
+ Meta
+ Head Head
+ Cards []HealthCard
+
+ Health Box
+
+ Outbound Box
+ Days int
+ OutboundRows []OverviewDomain
+ OutboundEmpty EmptyState
+
+ InboundOn bool
+ Inbound Box
+ InboundRows []OverviewInbound
+ InboundEmpty EmptyState
+}
+
+// OverviewDomain is one row of the Outbound domains table: the domain, the
+// verdict of each DNS check as a tag (DKIM, SPF, DMARC), how many applications
+// it has and how much mail it sent in the window (see FormatMessages).
+type OverviewDomain struct {
+ Name string
+ Href string
+ DNS []Tag
+ Apps int
+ Messages string
+}
+
+// OverviewInbound is one row of the Inbound domains table: the domain, its MX
+// check as a tag and the upstream it forwards to.
+type OverviewInbound struct {
+ Name string
+ Href string
+ MX Tag
+ Upstream string
+}
+
+// NewOverview builds the page. host is the server's name (the kicker) and may
+// be empty; updated is when the checks were read; days is the length of the
+// send window of the last column.
+func NewOverview(m Meta, host string, cards []HealthCard, updated time.Time, days int, inboundOn bool) *Overview {
+ m.Title, m.Section, m.Page = "Overview", "overview", ""
+ o := &Overview{
+ Meta: m,
+ Cards: cards,
+ Days: days,
+ Head: overviewHead(host, cards, updated),
+ Health: Box{No: "01", Title: "Server health", ID: "health", Poll: "/overview/fragment",
+ End: Rich(Link("/server/health", "All details")),
+ Help: &HelpLink{Href: "/help#checks", Title: "What these checks mean"}},
+ Outbound: Box{No: "02", Title: "Outbound domains", End: Rich(Link("/outbound/domains", "Manage"))},
+ OutboundEmpty: EmptyState{Icon: "ti-world-upload",
+ Text: Plain("No outbound domains yet. Add the first one under Outbound.")},
+ InboundOn: inboundOn,
+ Inbound: Box{No: "03", Title: "Inbound domains", End: Rich(Link("/inbound/domains", "Manage"))},
+ InboundEmpty: EmptyState{Icon: "ti-world-download",
+ Text: Plain("No inbound domains yet. Mail is not accepted for any.")},
+ }
+ return o
+}
+
+// HeadOOB is the head as the polled fragment carries it: the same head, marked
+// to be swapped into the page by its id. The page itself never has the mark.
+func (o *Overview) HeadOOB() Head {
+ h := o.Head
+ h.OOB = true
+ return h
+}
+
+// overviewHead is the stamp and the sentence under it. The stamp takes the
+// worst card, counts the cards that are not fine, and the lead names them with
+// their detail so the operator sees what to open without scanning the grid. A
+// card that could not be read is a warning, never a pass (cardLevel).
+func overviewHead(host string, cards []HealthCard, updated time.Time) Head {
+ level, bad := LevelOK, []HealthCard{}
+ for _, c := range cards {
+ if c.Level == "" {
+ continue
+ }
+ bad = append(bad, c)
+ if c.Level == LevelFail || level == LevelOK {
+ level = c.Level
+ }
+ }
+
+ title, word, count := "Everything is running normally.", "OK", len(cards)
+ switch level {
+ case LevelWarn:
+ title, word, count = "Running, with warnings.", "WARN", len(bad)
+ case LevelFail:
+ title, word, count = "A component needs attention.", "FAIL", len(bad)
+ }
+
+ h := Head{
+ Postmark: &Postmark{Top: "SELFPOST", Word: word, Bottom: fmt.Sprintf("%d OF %d CHECKS", count, len(cards)), Level: level},
+ Kicker: host,
+ Title: title,
+ ID: "overview-head",
+ Note: []string{"Updated " + updated.UTC().Format("15:04:05") + " UTC"},
+ }
+ if len(bad) > 0 {
+ lead := Text{{Text: "Needs attention: "}}
+ for i, c := range bad {
+ if i > 0 {
+ lead = append(lead, Inline{Text: ", "})
+ }
+ lead = append(lead, Link(c.Href, c.Name), Inline{Text: " (" + c.Value + ")"})
+ }
+ h.Lead = append(lead, Inline{Text: "."})
+ }
+ return h
+}
+
+// FormatCount writes a whole number with its thousands separated by a no-break
+// space: "1 284".
+func FormatCount(n int64) string {
+ digits := strconv.FormatInt(n, 10)
+ var b strings.Builder
+ for i, r := range digits {
+ if i > 0 && (len(digits)-i)%3 == 0 && digits[i-1] != '-' {
+ b.WriteString("\u00a0")
+ }
+ b.WriteRune(r)
+ }
+ return b.String()
+}
+
+// FormatMessages writes a message count as the Overview table shows it:
+// "1 284 msg".
+func FormatMessages(n int64) string { return FormatCount(n) + "\u00a0msg" }
diff --git a/internal/web/view/pages_test.go b/internal/web/view/pages_test.go
new file mode 100644
index 0000000..9219d18
--- /dev/null
+++ b/internal/web/view/pages_test.go
@@ -0,0 +1,436 @@
+package view
+
+import (
+ "net/http"
+ "net/http/httptest"
+ "regexp"
+ "strings"
+ "testing"
+ "time"
+)
+
+// renderSignedIn renders a page of the kit through the engine, as a handler
+// would, with the inbound relay and DMARC switched on.
+func renderSignedIn(t *testing.T, page string, data any) string {
+ t.Helper()
+ engine := newGuardEngine(t)
+ rec := httptest.NewRecorder()
+ engine.Render(rec, http.StatusOK, page, data)
+ if rec.Code != http.StatusOK {
+ t.Fatalf("render %s: status %d: %s", page, rec.Code, rec.Body.String())
+ }
+ return rec.Body.String()
+}
+
+func renderFragment(t *testing.T, name string, data any) string {
+ t.Helper()
+ engine := newGuardEngine(t)
+ rec := httptest.NewRecorder()
+ engine.RenderFragment(rec, http.StatusOK, name, data)
+ if rec.Code != http.StatusOK {
+ t.Fatalf("render fragment %s: status %d: %s", name, rec.Code, rec.Body.String())
+ }
+ return rec.Body.String()
+}
+
+func pageHas(t *testing.T, page, out string, wants ...string) {
+ t.Helper()
+ for _, want := range wants {
+ if !strings.Contains(out, want) {
+ t.Errorf("%s is missing %q", page, want)
+ }
+ }
+}
+
+func pageLacks(t *testing.T, page, out string, gones ...string) {
+ t.Helper()
+ for _, gone := range gones {
+ if strings.Contains(out, gone) {
+ t.Errorf("%s carries %q", page, gone)
+ }
+ }
+}
+
+// ---- Overview
+
+// The stamp, the sentence and the cards say the same thing: the worst card
+// colours the stamp, the number counts the cards that are not fine, and the
+// lead names them with their detail and a way to the table behind each.
+func TestOverviewHeadFollowsTheCards(t *testing.T) {
+ out := renderSignedIn(t, "overview", overviewFixture())
+ pageHas(t, "Overview", out,
+ `
Running, with warnings.
`,
+ `class="sp-postmark sp-warn"`, `
WARN`, `1 OF 6 CHECKS`,
+ `Needs attention:
TLS certificate (Expires in 12 days).`,
+ `Updated 14:02:31 UTC`, `
mail.example.org
`,
+ `class="sp-warn"`, // the certificate card
+ `href="/server/health"`, `>All details`,
+ )
+
+ cards := overviewFixture().Cards
+ for i := range cards {
+ cards[i].Level = ""
+ }
+ ok := NewOverview(admin(), "mail.example.org", cards, time.Now(), 30, true)
+ if p := ok.Head.Postmark; p.Level != LevelOK || p.Word != "OK" || p.Bottom != "6 OF 6 CHECKS" {
+ t.Errorf("a healthy panel is stamped %+v", *p)
+ }
+ if ok.Head.Lead != nil {
+ t.Errorf("a healthy panel names something that needs attention: %v", ok.Head.Lead)
+ }
+
+ cards[1].Level, cards[2].Level = LevelWarn, LevelFail
+ bad := NewOverview(admin(), "", cards, time.Now(), 30, true)
+ if p := bad.Head.Postmark; p.Level != LevelFail || p.Word != "FAIL" || p.Bottom != "2 OF 6 CHECKS" {
+ t.Errorf("a failing card does not make the stamp FAIL: %+v", *p)
+ }
+ if bad.Head.Kicker != "" {
+ t.Errorf("kicker %q without a host name", bad.Head.Kicker)
+ }
+}
+
+func TestOverviewListsBothKindsOfDomain(t *testing.T) {
+ out := renderSignedIn(t, "overview", overviewFixture())
+ pageHas(t, "Overview", out,
+ `
Outbound domains
`, `
Inbound domains
`,
+ `
30 days | `, "1 284 msg", "18 920 msg",
+ `
example.org`,
+ `
SPF`, `
DMARC`,
+ `
acme.io`, `10.0.4.12:2525`,
+ `href="/outbound/domains">Manage`, `href="/inbound/domains">Manage`,
+ )
+}
+
+// With the inbound relay off the page neither draws nor links the inbound box.
+func TestOverviewWithoutInboundHasNoInboundBox(t *testing.T) {
+ o := NewOverview(admin(), "mail.example.org", overviewFixture().Cards, time.Now(), 30, false)
+ out := renderSignedIn(t, "overview", o)
+ pageHas(t, "Overview", out, `
Outbound domains
`)
+ pageLacks(t, "Overview", out, `Inbound domains`, `
MX | `)
+ if got := strings.Count(out, `>Manage`); got != 1 {
+ t.Errorf("%d Manage links, want the outbound one only", got)
+ }
+ if strings.Contains(out, `class="column is-7"`) {
+ t.Error("the outbound box is squeezed into a column with nothing beside it")
+ }
+}
+
+func TestOverviewEmptyTablesSayWhatIsAbsent(t *testing.T) {
+ o := NewOverview(admin(), "mail.example.org", overviewFixture().Cards, time.Now(), 30, true)
+ out := renderSignedIn(t, "overview", o)
+ pageHas(t, "Overview", out, `No outbound domains yet.`, `No inbound domains yet.`)
+ pageLacks(t, "Overview", out, `
alert(1)`
+ o.InboundRows[0].Upstream = `">
`
+ out := renderSignedIn(t, "overview", o)
+ pageLacks(t, "Overview", out, ``, `a"onfocus="x`, `x">`
+ out := renderSignedIn(t, "account", a)
+ pageLacks(t, "Account", out, `