Settings menu redesign

crueber commented

2026-09-05 05:27:25 +00:00

Owner

Change that pill menu at the top in to a left sidebar menu with two clear sections. The main listing of all the standard settings, and then the danger zone. Which should be put in its own menu section.

Make sure you look at the outcome of making those menus smaller, when you add the left sidebar. Some of the current forms are going to become very tight and should probably be reworked as part of this ticket.

![image](/attachments/ecfc1697-9a0a-4878-944e-2818839c66a8) Change that pill menu at the top in to a left sidebar menu with two clear sections. The main listing of all the standard settings, and then the danger zone. Which should be put in its own menu section. Make sure you look at the outcome of making those menus smaller, when you add the left sidebar. Some of the current forms are going to become very tight and should probably be reworked as part of this ticket.

image.png

410 KiB

crueber commented

2026-09-05 05:28:50 +00:00

Author

Owner

Move the WAL from the main repo menu in to the settings left sidebar menu too, while you're at it.

crueber referenced this issue from a commit

2026-09-05 08:04:28 +00:00

Fix #123: settings left sidebar (+ WAL move)

crueber referenced this issue from a pull request that will close it,

2026-09-05 08:04:33 +00:00

Fix #123: settings left sidebar #130

crueber commented

2026-09-05 08:04:41 +00:00

Author

Owner

Fix is up for review: #130 (branch fix/issue-123). Left sidebar with standard listing + Danger Zone section, WAL moved in from the repo tab bar (/wal route kept), per-tab form rework for the narrower column, responsive stack below lg, aria-current nav, both themes. Browser-verified all 8 entries + danger zone with zero console errors; node suite 294/294.

Fix is up for review: https://git.packden.us/crueber/walhub/pulls/130 (branch fix/issue-123). Left sidebar with standard listing + Danger Zone section, WAL moved in from the repo tab bar (/wal route kept), per-tab form rework for the narrower column, responsive stack below lg, aria-current nav, both themes. Browser-verified all 8 entries + danger zone with zero console errors; node suite 294/294.

crueber commented

2026-09-05 08:07:47 +00:00

Author

Owner

PR #130 review (fix/issue-123, commit a201012) — verified in scratch worktree /tmp/pr130 (since removed), main worktree untouched (read-only).

BEFORE (shot-ecfc16…): top pill menu (Scheduled/Policy/Config/Access/Tokens/Webhooks), Danger Zone pinned under every tab, WAL as repo-level tab. The PR resolves all three as specified.

Sidebar structure — PASS

web/src/pages/Settings.jsx:806-837: two sections (Settings listing + Danger Zone), nav[aria-label=Settings sections] + section h3s + native buttons, aria-current=page only on active (764, single-signal so max one). web/src/ui.css: side-nav-* with dark+light pairs, danger active state keeps red tone (not emerald). web/src/lib/settingsNav.js: pure/DOM-free, WAL in SETTINGS_GROUP, danger last and separate.
AGENTS.md law 1: no package.json change, no new imports — clean. Law 8: no new routes/components seams — Wal reused inline.

WAL relocation — PASS

web/src/pages/Repo.jsx:170: WAL tab entry removed (comment cites #123). web/src/index.jsx:80 (unchanged): /wal route kept → old links still render Wal. Wal.jsx:288 reads useRepo() itself, so inline (Settings.jsx:846) works with zero prop plumbing. web/src/lib/tabs.js:34 wal→settings: /wal highlights Settings, no dead tab, no blank bar. Doc row matches.

Hash deep-links / stale-hash / back-forward — PASS

Settings.jsx:778-800: bare /settings → scheduled default; #id → entry; unknown/empty hash → null → default fallback (never blank). select() uses replaceState (no scroll jump, no loop); hashchange listener follows back/forward and is removed in onCleanup (law 7: no leaked listener). Minor: initialTab double-wraps resolveSettingsTab(settingsTabIdFromHash()) — redundant but correct, not worth churn.

Narrow-width — PASS (by reasoning, no browser per task brief)

flex-col below lg, sidebar stacks above content; section uls overflow-x-auto internally (810,824); content min-w-0 flex-1 (839). Wide multi-col tables wrapped: strategy (74), dry-run (243), tokens (468), webhooks (706). kv tables (100,126) intentionally unwrapped — they wrap text by default (ui.css:84 nowrap applies only inside overflow wrappers), and the w-64→w-40+break-words th fix (131) covers the narrow column. No fixed-width overflow left (danger input max-w-full, token/config inputs flex-1).

Forms / danger flow — PASS, no lost functionality

Policy (debounce/dry-run/save/discard/copy), config (validate/publish/clear/history+diff), tokens (mint/list/revoke), webhooks (add/toggle/delete), access addRow (grid rework only), DangerConfirm typed-match + DELETE→204→owners-nav — all logic untouched, diff is classes/markup/comments only. DangerZone now renders as tab content (847) instead of pinned below every tab — matches the issue.

Tests + build

node --test web/test/unit/*.test.js in scratch worktree: 294/294 pass (incl. new settings-nav.test.js + updated repo-tabs.test.js /wal→settings). Note: scratch worktree initially showed 2 failures (data-guard, reaction-cache) from missing web/node_modules there (untracked dir, not shared by worktrees) — env gap only; symlinked main-worktree node_modules read-only and all green. No fix pushed for that.
vite build: clean (116 modules, 1.53s).
Doc entries (docs/go/12_web_ui.md route table, §2.9, FIXED #123 entry) all match the shipped code; law 12 satisfied in-commit.

No fixes needed — nothing pushed to origin/fix/issue-123.

MERGE RECOMMENDATION: ready to merge.

PR #130 review (fix/issue-123, commit a201012) — verified in scratch worktree /tmp/pr130 (since removed), main worktree untouched (read-only). BEFORE (shot-ecfc16…): top pill menu (Scheduled/Policy/Config/Access/Tokens/Webhooks), Danger Zone pinned under every tab, WAL as repo-level tab. The PR resolves all three as specified. Sidebar structure — PASS - web/src/pages/Settings.jsx:806-837: two sections (Settings listing + Danger Zone), nav[aria-label=Settings sections] + section h3s + native buttons, aria-current=page only on active (764, single-signal so max one). web/src/ui.css: side-nav-* with dark+light pairs, danger active state keeps red tone (not emerald). web/src/lib/settingsNav.js: pure/DOM-free, WAL in SETTINGS_GROUP, danger last and separate. - AGENTS.md law 1: no package.json change, no new imports — clean. Law 8: no new routes/components seams — Wal reused inline. WAL relocation — PASS - web/src/pages/Repo.jsx:170: WAL tab entry removed (comment cites #123). web/src/index.jsx:80 (unchanged): /wal route kept → old links still render Wal. Wal.jsx:288 reads useRepo() itself, so inline <Wal/> (Settings.jsx:846) works with zero prop plumbing. web/src/lib/tabs.js:34 wal→settings: /wal highlights Settings, no dead tab, no blank bar. Doc row matches. Hash deep-links / stale-hash / back-forward — PASS - Settings.jsx:778-800: bare /settings → scheduled default; #id → entry; unknown/empty hash → null → default fallback (never blank). select() uses replaceState (no scroll jump, no loop); hashchange listener follows back/forward and is removed in onCleanup (law 7: no leaked listener). Minor: initialTab double-wraps resolveSettingsTab(settingsTabIdFromHash()) — redundant but correct, not worth churn. Narrow-width — PASS (by reasoning, no browser per task brief) - flex-col below lg, sidebar stacks above content; section uls overflow-x-auto internally (810,824); content min-w-0 flex-1 (839). Wide multi-col tables wrapped: strategy (74), dry-run (243), tokens (468), webhooks (706). kv tables (100,126) intentionally unwrapped — they wrap text by default (ui.css:84 nowrap applies only inside overflow wrappers), and the w-64→w-40+break-words th fix (131) covers the narrow column. No fixed-width overflow left (danger input max-w-full, token/config inputs flex-1). Forms / danger flow — PASS, no lost functionality - Policy (debounce/dry-run/save/discard/copy), config (validate/publish/clear/history+diff), tokens (mint/list/revoke), webhooks (add/toggle/delete), access addRow (grid rework only), DangerConfirm typed-match + DELETE→204→owners-nav — all logic untouched, diff is classes/markup/comments only. DangerZone now renders as tab content (847) instead of pinned below every tab — matches the issue. Tests + build - node --test web/test/unit/*.test.js in scratch worktree: 294/294 pass (incl. new settings-nav.test.js + updated repo-tabs.test.js /wal→settings). Note: scratch worktree initially showed 2 failures (data-guard, reaction-cache) from missing web/node_modules there (untracked dir, not shared by worktrees) — env gap only; symlinked main-worktree node_modules read-only and all green. No fix pushed for that. - vite build: clean (116 modules, 1.53s). - Doc entries (docs/go/12_web_ui.md route table, §2.9, FIXED #123 entry) all match the shipped code; law 12 satisfied in-commit. No fixes needed — nothing pushed to origin/fix/issue-123. MERGE RECOMMENDATION: ready to merge.

crueber closed this issue

2026-09-05 08:08:03 +00:00

crueber referenced this issue from a commit

2026-09-05 08:08:03 +00:00

Merge pull request 'Fix #123: settings left sidebar' (#130) from fix/issue-123 into main

crueber commented

2026-09-05 08:08:04 +00:00

Author

Owner

Fixed by PR #130 (review clean; 294/294 node tests), merged. Closing.

crueber added the

git storage