Skip to content

webui: human-readable labels + section titles/descriptors in Settings (closes #436)#451

Merged
lonix merged 1 commit into
mainfrom
claude/settings-labels-and-category-meta
May 19, 2026
Merged

webui: human-readable labels + section titles/descriptors in Settings (closes #436)#451
lonix merged 1 commit into
mainfrom
claude/settings-labels-and-category-meta

Conversation

@lonix
Copy link
Copy Markdown
Owner

@lonix lonix commented May 19, 2026

Closes #436. Keystone for the remaining v1.0 UX work: #439 (channel/role/category dropdown selectors) and #444 (cron picker) will both add a type discriminator next to label in SettingMetadata and piggyback on the same plumbing this PR introduces.

What changed

Schema (src/services/config-schema.ts)

  • SettingMetadata gains a required label field. Every entry in settingsMetadata now carries a human-readable label (e.g. "Voice Tracking enabled") alongside the existing description and category.
  • New CategoryMetadata interface and categoryMetadata map: one entry per category slug used by settingsMetadata, with a human title and short description.

While writing labels I also tightened the descriptions for voicechannels.lobby.name and voicechannels.lobby.offlinename to clarify they're cosmetic display strings the bot sets on managed channels, not lookups — flagged during the #441 audit.

Renderer (src/web/admin-views.ts)

  • SettingRow interface gains label.
  • renderSettingsPage:
    • Section header is now <h2>{title}</h2> from categoryMetadata, with a muted <p>{description}</p> under it (e.g. <h2>Voice Channels</h2> instead of <h2>voicechannels</h2>).
    • Row's first column shows <strong>{label}</strong> as the primary text and the raw dotted key as a muted <code> reference beneath. The standalone "Key" column is gone — the dotted key still appears on every row but de-emphasised.
    • All other columns (Edit, Type, Default, Description) unchanged.

Route plumbing (src/web/read-only-routes.ts)

  • The settings page route now reads label from settingsMetadata when building SettingRows, falling back to the raw key for orphan DB rows that have no schema metadata.

Tests

  • Two new coverage tests in __tests__/services/config-schema.test.ts:
    • settingsMetadata has a non-empty label/description/category for every defaultConfig key, and has no stale entries.
    • categoryMetadata covers every category referenced by settingsMetadata.
  • Two new render tests in __tests__/web/admin-views.test.ts cover the label-as-primary / key-as-muted-reference layout and the category-title + category-description rendering.

Verification

  • npm test — 739 passed, 1 skipped, 0 failed (4 new tests).
  • npx tsc --noEmit — clean.
  • npm run lint — 0 errors.
  • npm run format:check — clean.
  • Manual: /admin/settings shows human labels as the primary text and the dotted key as a small muted reference underneath. Each section card has a human title and one-line description.

Test plan

  • Schema metadata coverage tests.
  • Renderer label + section-title tests.
  • Visual check of /admin/settings rendering across all categories.

Generated by Claude Code

Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR adds human-readable labels for individual settings and titles/descriptions for setting categories on the WebUI Settings page, addressing #436 and laying the metadata groundwork for #439 (typed selectors) and #444 (cron picker).

Changes:

  • Adds required label to SettingMetadata and a new categoryMetadata map with title/description per category slug in config-schema.ts.
  • Updates renderSettingsPage to show the human label as primary text with the dotted key as a muted <code> reference, and renders category title + description in section headers.
  • Threads label through SettingRow in read-only-routes.ts (falling back to the raw key for orphan DB rows) and adds coverage tests for both schema completeness and rendering.

Reviewed changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated no comments.

Show a summary per file
File Description
src/services/config-schema.ts Adds label to every settings entry and introduces CategoryMetadata + categoryMetadata map; tightens lobby description wording.
src/web/admin-views.ts Renders human label as primary + muted dotted key, and category title/description in section header.
src/web/read-only-routes.ts Populates label on SettingRows, with raw-key fallback for orphans.
tests/services/config-schema.test.ts Asserts label/description/category coverage and no stale entries; verifies categoryMetadata covers all used categories.
tests/web/admin-views.test.ts Adds renderer tests for label-as-primary layout and category title/description.

…closes #436)

The Settings page presented each row by its raw dotted key
(voicetracking.enabled, voicechannels.lobby.offlinename) and each
section by its bare slug (<h2>voicechannels</h2>). Fine for developers,
hostile to the "clueless admin" the v1.0 admin panel is being shaped
around.

Schema (src/services/config-schema.ts):

- SettingMetadata gains a required `label` field. Every entry in
  settingsMetadata now carries a human-readable label alongside its
  description and category.
- New CategoryMetadata interface and categoryMetadata map: one entry
  per category slug used by settingsMetadata, with a human title and
  short description.

Renderer (src/web/admin-views.ts):

- SettingRow interface gains `label`.
- renderSettingsPage:
  - Section header now <h2>{title}</h2> from categoryMetadata, with a
    muted <p>{description}</p> under it.
  - Row's first column shows <strong>{label}</strong> as the primary
    text and the raw dotted key as a muted <code> reference beneath.
    The standalone "Key" column is gone — the dotted key still appears
    on every row but de-emphasised.
  - All other columns (Edit, Type, Default, Description) unchanged.

Route plumbing (src/web/read-only-routes.ts):

- The settings page route now reads `label` from settingsMetadata when
  building SettingRows, falling back to the raw key for orphan DB rows
  that have no schema metadata.

Tests:

- Two new coverage tests in __tests__/services/config-schema.test.ts:
  - settingsMetadata has a non-empty label/description/category for
    every defaultConfig key, and has no stale entries.
  - categoryMetadata covers every category referenced by
    settingsMetadata.
- Two new render tests in __tests__/web/admin-views.test.ts cover the
  label-as-primary / key-as-muted-reference layout and the
  category-title + category-description rendering.

This is the keystone for the rest of the v1.0 UX work: #439 (channel/
role/category selectors) will add a `type` discriminator next to
`label` in SettingMetadata, and #444 (cron picker) will piggyback on
the same `type` mechanism.
@lonix lonix force-pushed the claude/settings-labels-and-category-meta branch from 585a521 to 29d943b Compare May 19, 2026 13:40
@lonix lonix requested a review from Copilot May 19, 2026 13:47
@lonix lonix merged commit 82dddf3 into main May 19, 2026
10 checks passed
@lonix lonix deleted the claude/settings-labels-and-category-meta branch May 19, 2026 13:48
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Copilot reviewed 5 out of 5 changed files in this pull request and generated no new comments.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

WebUI: human-readable labels and section titles/descriptors in Settings

3 participants