From c028ee81fb5dec2e57f5f39985bc34870c8ab05d Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Tue, 19 May 2026 13:56:42 +0000
Subject: [PATCH 1/2] webui: dropdown selectors for channel/category/role
 config keys (closes #439)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Settings page now renders Discord-ID config keys as <select> dropdowns
populated from the live guild cache instead of free-text inputs.
Pasting a stale ID is no longer possible from the UI.

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

- New SettingType discriminator on SettingMetadata:
    "boolean" | "number" | "string" | "cron"
    | "channel" | "category" | "role"
    | "channel_list" | "role_list"
- Every entry in settingsMetadata annotated with its type. Channels and
  categories go to "channel" / "category"; the one CSV-of-channel-ids
  field (voicetracking.excluded_channels) goes to "channel_list"; the
  CSV-of-role-ids field (quotes.delete_roles) goes to "role_list"; cron
  strings (voicetracking.announcements.schedule,
  voicetracking.cleanup.schedule, leaderboard_roles.update_cron) go to
  "cron" — they render as text inputs for now; #444 will replace with a
  friendly schedule picker.

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

- SettingsProps gains textChannels / categoryChannels / roles fields
  feeding the picker dropdowns.
- renderSettingInput now switches on the extended type:
  - channel / category / role → <select name="value"> with a "(none)"
    row and the current ID pre-selected.
  - channel_list / role_list → <select name="value" multiple> with the
    stored CSV split into per-option `selected` flags.
  - cron / string / unknown → text input (existing fallback).
- New buildOptionsHtml helper handles the selected-marker logic for both
  single- and multi-select shapes.

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

- fetchChannelData now also collects ChannelType.GuildCategory channels
  (for the voicechannels.category picker) alongside the existing
  text/announcement channels.
- The /admin/settings handler reads metadata.type as the authoritative
  type for known keys (orphan DB rows fall back to describeType()), and
  passes the three option lists into renderSettingsPage.

Write path (src/web/write-routes.ts):

- coerceConfigValue now collapses array `value` payloads into a CSV
  string. <select multiple> posts repeated value params which Express
  parses as an array; the backend storage format for *_list keys is
  comma-separated, so we join on the way in. Empty strings are dropped
  so a stray empty option in the payload doesn't produce a malformed
  CSV.

Tests:

- 6 new render tests in __tests__/web/admin-views.test.ts: channel,
  category, role, channel_list, role_list, and cron-as-text fallback.
- 3 new coerceConfigValue tests in __tests__/web/write-routes.test.ts:
  array → CSV join, empty-string drop, and the empty-array → "" case.
- 1 new schema coverage test: type field present and consistent with
  the runtime defaultConfig value shape (boolean keys → boolean value,
  etc.).

This completes the dropdown half of the v1.0 admin-panel UX work.
The remaining schedule-picker UX lands with #444.
---
 __tests__/services/config-schema.test.ts |  31 +++-
 __tests__/web/admin-views.test.ts        | 181 +++++++++++++++++++++++
 __tests__/web/write-routes.test.ts       |  27 ++++
 src/services/config-schema.ts            |  79 ++++++++++
 src/web/admin-views.ts                   |  81 +++++++++-
 src/web/read-only-routes.ts              |  40 ++++-
 src/web/write-routes.ts                  |  10 ++
 7 files changed, 439 insertions(+), 10 deletions(-)

diff --git a/__tests__/services/config-schema.test.ts b/__tests__/services/config-schema.test.ts
index 615374a..d89f42c 100644
--- a/__tests__/services/config-schema.test.ts
+++ b/__tests__/services/config-schema.test.ts
@@ -69,16 +69,18 @@ describe('Config Schema', () => {
   });
 
   describe('settingsMetadata', () => {
-    it('has a non-empty label, description, and category for every key in defaultConfig', () => {
+    it('has a non-empty label, description, category, and type for every key in defaultConfig', () => {
       const missingLabel: string[] = [];
       const missingDescription: string[] = [];
       const missingCategory: string[] = [];
+      const missingType: string[] = [];
       for (const key of Object.keys(defaultConfig)) {
         const meta = settingsMetadata[key as keyof typeof settingsMetadata];
         if (!meta) {
           missingLabel.push(key);
           missingDescription.push(key);
           missingCategory.push(key);
+          missingType.push(key);
           continue;
         }
         if (!meta.label || meta.label.trim() === '') missingLabel.push(key);
@@ -86,10 +88,37 @@ describe('Config Schema', () => {
           missingDescription.push(key);
         if (!meta.category || meta.category.trim() === '')
           missingCategory.push(key);
+        if (!meta.type || (meta.type as string).trim() === '')
+          missingType.push(key);
       }
       expect(missingLabel).toEqual([]);
       expect(missingDescription).toEqual([]);
       expect(missingCategory).toEqual([]);
+      expect(missingType).toEqual([]);
+    });
+
+    it('declares a `type` consistent with the runtime defaultConfig value shape', () => {
+      // The schema-declared type must not contradict the runtime shape:
+      // a `boolean`-typed key has a boolean default, a `number`-typed key
+      // has a numeric default, and every other kind ("string", "cron",
+      // "channel"/"category"/"role" and their list variants) stores a
+      // string. Catches accidental drift between the declared metadata and
+      // the underlying default value.
+      const mismatches: string[] = [];
+      for (const [key, defaultValue] of Object.entries(defaultConfig)) {
+        const meta = settingsMetadata[key as keyof typeof settingsMetadata];
+        if (!meta) continue;
+        const dv = typeof defaultValue;
+        if (meta.type === 'boolean' && dv !== 'boolean') mismatches.push(key);
+        else if (meta.type === 'number' && dv !== 'number') mismatches.push(key);
+        else if (
+          meta.type !== 'boolean' &&
+          meta.type !== 'number' &&
+          dv !== 'string'
+        )
+          mismatches.push(key);
+      }
+      expect(mismatches).toEqual([]);
     });
 
     it('does not have stale entries for keys that no longer exist in defaultConfig', () => {
diff --git a/__tests__/web/admin-views.test.ts b/__tests__/web/admin-views.test.ts
index cdad718..c6d8d29 100644
--- a/__tests__/web/admin-views.test.ts
+++ b/__tests__/web/admin-views.test.ts
@@ -260,6 +260,187 @@ describe("renderSettingsPage", () => {
       /type="checkbox" name="value" value="true" checked/,
     );
   });
+
+  it("renders a channel-type setting as a single-select dropdown populated from textChannels", () => {
+    const html = renderSettingsPage({
+      ...COMMON,
+      textChannels: [
+        { id: "111", name: "general" },
+        { id: "222", name: "voice-stats" },
+      ],
+      categoryChannels: [],
+      roles: [],
+      groups: [
+        {
+          category: "voicetracking",
+          rows: [
+            {
+              key: "voicetracking.announcements.channel_id",
+              label: "Announcement channel",
+              current: "222",
+              defaultValue: "",
+              type: "channel",
+              description: "",
+              category: "voicetracking",
+            },
+          ],
+        },
+      ],
+    });
+    expect(html).toContain('<select name="value">');
+    expect(html).toContain('<option value="111">#general</option>');
+    expect(html).toContain('<option value="222" selected>#voice-stats</option>');
+  });
+
+  it("renders a category-type setting from categoryChannels", () => {
+    const html = renderSettingsPage({
+      ...COMMON,
+      textChannels: [],
+      categoryChannels: [{ id: "cat-1", name: "Voice Channels" }],
+      roles: [],
+      groups: [
+        {
+          category: "voicechannels",
+          rows: [
+            {
+              key: "voicechannels.category.name",
+              label: "Managed category",
+              current: "cat-1",
+              defaultValue: "",
+              type: "category",
+              description: "",
+              category: "voicechannels",
+            },
+          ],
+        },
+      ],
+    });
+    expect(html).toContain(
+      '<option value="cat-1" selected>#Voice Channels</option>',
+    );
+  });
+
+  it("renders a role-type setting from roles with the @ prefix", () => {
+    const html = renderSettingsPage({
+      ...COMMON,
+      textChannels: [],
+      categoryChannels: [],
+      roles: [
+        { id: "r1", name: "Admin" },
+        { id: "r2", name: "Member" },
+      ],
+      groups: [
+        {
+          category: "amikool",
+          rows: [
+            {
+              key: "amikool.role_id",
+              label: "Kool role",
+              current: "r1",
+              defaultValue: "",
+              type: "role",
+              description: "",
+              category: "amikool",
+            },
+          ],
+        },
+      ],
+    });
+    expect(html).toContain('<option value="r1" selected>@Admin</option>');
+    expect(html).toContain('<option value="r2">@Member</option>');
+  });
+
+  it("renders a channel_list-type setting as a multi-select with CSV pre-selection", () => {
+    const html = renderSettingsPage({
+      ...COMMON,
+      textChannels: [
+        { id: "111", name: "general" },
+        { id: "222", name: "afk" },
+        { id: "333", name: "other" },
+      ],
+      categoryChannels: [],
+      roles: [],
+      groups: [
+        {
+          category: "voicetracking",
+          rows: [
+            {
+              key: "voicetracking.excluded_channels",
+              label: "Excluded channels",
+              current: "111,333",
+              defaultValue: "",
+              type: "channel_list",
+              description: "",
+              category: "voicetracking",
+            },
+          ],
+        },
+      ],
+    });
+    expect(html).toMatch(/<select name="value" multiple/);
+    expect(html).toContain('<option value="111" selected>#general</option>');
+    expect(html).toContain('<option value="222">#afk</option>');
+    expect(html).toContain('<option value="333" selected>#other</option>');
+  });
+
+  it("renders a role_list-type setting as a multi-select with CSV pre-selection", () => {
+    const html = renderSettingsPage({
+      ...COMMON,
+      textChannels: [],
+      categoryChannels: [],
+      roles: [
+        { id: "r1", name: "Admin" },
+        { id: "r2", name: "Mod" },
+      ],
+      groups: [
+        {
+          category: "quotes",
+          rows: [
+            {
+              key: "quotes.delete_roles",
+              label: "Roles allowed to delete quotes",
+              current: "r2",
+              defaultValue: "",
+              type: "role_list",
+              description: "",
+              category: "quotes",
+            },
+          ],
+        },
+      ],
+    });
+    expect(html).toMatch(/<select name="value" multiple/);
+    expect(html).toContain('<option value="r1">@Admin</option>');
+    expect(html).toContain('<option value="r2" selected>@Mod</option>');
+  });
+
+  it("falls back to a text input for cron-type settings (placeholder until #444)", () => {
+    const html = renderSettingsPage({
+      ...COMMON,
+      textChannels: [],
+      categoryChannels: [],
+      roles: [],
+      groups: [
+        {
+          category: "voicetracking",
+          rows: [
+            {
+              key: "voicetracking.announcements.schedule",
+              label: "Schedule",
+              current: "0 16 * * 5",
+              defaultValue: "0 16 * * 5",
+              type: "cron",
+              description: "",
+              category: "voicetracking",
+            },
+          ],
+        },
+      ],
+    });
+    expect(html).toMatch(
+      /<input type="text" name="value" value="0 16 \* \* 5"/,
+    );
+  });
 });
 
 describe("renderPermissionsPage", () => {
diff --git a/__tests__/web/write-routes.test.ts b/__tests__/web/write-routes.test.ts
index 0f9a265..da6b283 100644
--- a/__tests__/web/write-routes.test.ts
+++ b/__tests__/web/write-routes.test.ts
@@ -97,4 +97,31 @@ describe("coerceConfigValue", () => {
       coerceConfigValue("voicechannels.lobby.name", null),
     ).toEqual({ ok: true, value: "" });
   });
+
+  it("joins array input into a comma-separated string for *_list keys", () => {
+    // The Settings page renders channel_list / role_list as <select
+    // multiple>, which posts repeated `value=…` params and lands here as
+    // an array. Backend storage is CSV so we collapse on the way in.
+    expect(
+      coerceConfigValue("voicetracking.excluded_channels", ["111", "222"]),
+    ).toEqual({ ok: true, value: "111,222" });
+    expect(
+      coerceConfigValue("quotes.delete_roles", ["roleA", "roleB", "roleC"]),
+    ).toEqual({ ok: true, value: "roleA,roleB,roleC" });
+  });
+
+  it("drops empty strings from array input for *_list keys", () => {
+    // Browsers sometimes send a stray empty option in select-multiple
+    // payloads; ignore them rather than producing a CSV with a leading
+    // or interior empty token.
+    expect(
+      coerceConfigValue("voicetracking.excluded_channels", ["", "111", ""]),
+    ).toEqual({ ok: true, value: "111" });
+  });
+
+  it("yields an empty string when nothing is selected in a multi-select", () => {
+    expect(
+      coerceConfigValue("voicetracking.excluded_channels", []),
+    ).toEqual({ ok: true, value: "" });
+  });
 });
diff --git a/src/services/config-schema.ts b/src/services/config-schema.ts
index f017dd0..89cf41b 100644
--- a/src/services/config-schema.ts
+++ b/src/services/config-schema.ts
@@ -188,11 +188,31 @@ export const defaultConfig: ConfigSchema = {
  * `label` is the human-readable name displayed as the primary text for the
  * setting (e.g. "Voice Tracking enabled"). The raw dotted key is shown
  * de-emphasised next to it for technical reference.
+ *
+ * `type` drives input rendering on the Settings page. `boolean` / `number`
+ * / `string` cover the bulk of keys with the obvious HTML controls. The
+ * Discord-specific kinds (`channel`, `category`, `role`, `channel_list`,
+ * `role_list`) render as `<select>` dropdowns populated from the live guild
+ * cache so operators pick from real entities instead of typing IDs by
+ * hand. `cron` currently renders as a text input — issue #444 will replace
+ * it with a friendly schedule picker.
  */
+export type SettingType =
+  | "boolean"
+  | "number"
+  | "string"
+  | "cron"
+  | "channel"
+  | "category"
+  | "role"
+  | "channel_list"
+  | "role_list";
+
 export interface SettingMetadata {
   label: string;
   description: string;
   category: string;
+  type: SettingType;
 }
 
 /**
@@ -281,57 +301,67 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "Voice Channel Management enabled",
     description: "Enable voice channel management.",
     category: "voicechannels",
+    type: "boolean",
   },
   "voicechannels.category.name": {
     label: "Managed category name",
     description:
       "Name of the Discord category that contains managed voice channels.",
     category: "voicechannels",
+    type: "string",
   },
   "voicechannels.lobby.name": {
     label: "Lobby channel display name",
     description:
       "Display name of the lobby channel users join to spawn a personal channel. Cosmetic; the bot sets this on the managed channel rather than looking it up by name.",
     category: "voicechannels",
+    type: "string",
   },
   "voicechannels.lobby.offlinename": {
     label: "Lobby display name (bot offline)",
     description:
       "Display name shown on the lobby channel while the bot is offline. Cosmetic.",
     category: "voicechannels",
+    type: "string",
   },
   "voicechannels.channel.prefix": {
     label: "Per-user channel name prefix",
     description: "Prefix prepended to dynamically created voice channel names.",
     category: "voicechannels",
+    type: "string",
   },
   "voicechannels.channel.suffix": {
     label: "Per-user channel name suffix",
     description: "Suffix appended to dynamically created voice channel names.",
     category: "voicechannels",
+    type: "string",
   },
   "voicechannels.controlpanel.enabled": {
     label: "In-channel control panel enabled",
     description:
       "Show the in-channel control panel (rename / privacy / live / transfer).",
     category: "voicechannels",
+    type: "boolean",
   },
   "voicechannels.ownership.grace_period_seconds": {
     label: "Ownership transfer grace period (seconds)",
     description:
       "Seconds to wait before transferring ownership when the channel owner leaves.",
     category: "voicechannels",
+    type: "number",
   },
   "voicechannels.presets.enabled": {
     label: "Per-user channel presets enabled",
     description:
       "Enable per-user channel presets (saved channel name + privacy).",
     category: "voicechannels",
+    type: "boolean",
   },
   "voicechannels.presets.max_per_user": {
     label: "Max presets per user",
     description: "Maximum number of presets a user can save.",
     category: "voicechannels",
+    type: "number",
   },
 
   // Voice Activity Tracking
@@ -339,43 +369,51 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "Voice Tracking enabled",
     description: "Enable voice activity tracking and the /voicestats command.",
     category: "voicetracking",
+    type: "boolean",
   },
   "voicetracking.stats.top.enabled": {
     label: "/voicestats top subcommand enabled",
     description: "Enable the /voicestats top leaderboard subcommand.",
     category: "voicetracking",
+    type: "boolean",
   },
   "voicetracking.stats.user.enabled": {
     label: "/voicestats user subcommand enabled",
     description: "Enable the /voicestats user personal-stats subcommand.",
     category: "voicetracking",
+    type: "boolean",
   },
   "voicetracking.seen.enabled": {
     label: "/seen command enabled",
     description: "Enable last-seen tracking and the /seen command.",
     category: "voicetracking",
+    type: "boolean",
   },
   "voicetracking.excluded_channels": {
     label: "Excluded channel IDs",
     description:
       "Comma-separated channel IDs to exclude from voice activity tracking.",
     category: "voicetracking",
+    type: "channel_list",
   },
   "voicetracking.announcements.enabled": {
     label: "Scheduled voice-stats announcements enabled",
     description: "Enable scheduled voice-stats announcements.",
     category: "voicetracking",
+    type: "boolean",
   },
   "voicetracking.announcements.schedule": {
     label: "Announcement schedule (cron)",
     description: "Cron schedule for the recurring voice-stats announcement.",
     category: "voicetracking",
+    type: "cron",
   },
   "voicetracking.announcements.channel_id": {
     label: "Announcement channel",
     description:
       "Discord channel ID where voice-stats announcements are posted.",
     category: "voicetracking",
+    type: "channel",
   },
 
   // Voice Channel Cleanup (dbtrunk)
@@ -383,27 +421,32 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "Scheduled DB cleanup enabled",
     description: "Enable scheduled database cleanup of voice tracking data.",
     category: "voicetracking",
+    type: "boolean",
   },
   "voicetracking.cleanup.schedule": {
     label: "Cleanup schedule (cron)",
     description: "Cron schedule for the database cleanup job.",
     category: "voicetracking",
+    type: "cron",
   },
   "voicetracking.cleanup.retention.detailed_sessions_days": {
     label: "Detailed-session retention (days)",
     description:
       "Days to keep detailed session rows before they are summarised away.",
     category: "voicetracking",
+    type: "number",
   },
   "voicetracking.cleanup.retention.monthly_summaries_months": {
     label: "Monthly-summary retention (months)",
     description: "Months to keep monthly summary rows.",
     category: "voicetracking",
+    type: "number",
   },
   "voicetracking.cleanup.retention.yearly_summaries_years": {
     label: "Yearly-summary retention (years)",
     description: "Years to keep yearly summary rows.",
     category: "voicetracking",
+    type: "number",
   },
 
   // Individual Features
@@ -411,6 +454,7 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "/ping command enabled",
     description: "Enable the /ping latency check command.",
     category: "ping",
+    type: "boolean",
   },
 
   // Quote System
@@ -418,49 +462,58 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "Quote system enabled",
     description: "Enable the quotes system and the /quote command.",
     category: "quotes",
+    type: "boolean",
   },
   "quotes.channel_id": {
     label: "Quote channel",
     description: "Channel ID where quote messages are posted.",
     category: "quotes",
+    type: "channel",
   },
   "quotes.delete_roles": {
     label: "Roles allowed to delete quotes",
     description:
       "Comma-separated role IDs allowed to delete quotes. Empty means only admins.",
     category: "quotes",
+    type: "role_list",
   },
   "quotes.max_length": {
     label: "Maximum quote length (characters)",
     description: "Maximum length of a single quote in characters.",
     category: "quotes",
+    type: "number",
   },
   "quotes.cooldown": {
     label: "Cooldown between quotes (seconds)",
     description: "Cooldown in seconds between quote additions per user.",
     category: "quotes",
+    type: "number",
   },
   "quotes.cleanup_interval": {
     label: "Channel cleanup interval (minutes)",
     description:
       "Interval in minutes between sweeps for unauthorised messages in the quote channel.",
     category: "quotes",
+    type: "number",
   },
   "quotes.header_enabled": {
     label: "Pinned header post enabled",
     description:
       "Post and maintain a pinned informational header in the quote channel.",
     category: "quotes",
+    type: "boolean",
   },
   "quotes.header_message_id": {
     label: "Header message ID (auto-managed)",
     description: "Auto-managed message ID of the quote channel header post.",
     category: "quotes",
+    type: "string",
   },
   "quotes.header_pin_enabled": {
     label: "Pin header post",
     description: "Pin the header post in the quote channel.",
     category: "quotes",
+    type: "boolean",
   },
 
   // Core Bot Logging (Discord)
@@ -468,6 +521,7 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "Cleanup-job notifications channel",
     description: "Channel ID for cleanup-job notifications.",
     category: "core",
+    type: "channel",
   },
 
   // Rate Limiting
@@ -475,21 +529,25 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "Rate limiting enabled",
     description: "Enable per-user command rate limiting.",
     category: "ratelimit",
+    type: "boolean",
   },
   "ratelimit.max_commands": {
     label: "Max commands per window",
     description: "Maximum number of commands a user can run per time window.",
     category: "ratelimit",
+    type: "number",
   },
   "ratelimit.window_seconds": {
     label: "Rate-limit window (seconds)",
     description: "Length of the rate-limit time window in seconds.",
     category: "ratelimit",
+    type: "number",
   },
   "ratelimit.bypass_admin": {
     label: "Admins bypass rate limit",
     description: "Allow administrators to bypass rate limiting.",
     category: "ratelimit",
+    type: "boolean",
   },
 
   // Scheduled Announcements
@@ -497,6 +555,7 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "Scheduled announcements enabled",
     description: "Enable scheduled announcements and the /announce command.",
     category: "announcements",
+    type: "boolean",
   },
 
   // Achievements
@@ -504,16 +563,19 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "Achievements enabled",
     description: "Enable the achievements / accolades system.",
     category: "achievements",
+    type: "boolean",
   },
   "achievements.announcements.enabled": {
     label: "Channel announcements for earned achievements",
     description: "Announce newly earned achievements in a Discord channel.",
     category: "achievements",
+    type: "boolean",
   },
   "achievements.dm_notifications.enabled": {
     label: "DM notifications for earned achievements",
     description: "DM users when they earn a new achievement.",
     category: "achievements",
+    type: "boolean",
   },
 
   // Reaction Roles
@@ -521,11 +583,13 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "Reaction roles enabled",
     description: "Enable the reaction-role system and the /reactrole command.",
     category: "reactionroles",
+    type: "boolean",
   },
   "reactionroles.message_channel_id": {
     label: "Reaction-role message channel",
     description: "Channel ID where reaction-role messages are posted.",
     category: "reactionroles",
+    type: "channel",
   },
 
   // Setup Wizard
@@ -533,6 +597,7 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "/setup wizard command enabled",
     description: "Enable the /setup wizard command.",
     category: "wizard",
+    type: "boolean",
   },
 
   // Notices System
@@ -540,33 +605,39 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "Notices system enabled",
     description: "Enable the notices system and the /notice command.",
     category: "notices",
+    type: "boolean",
   },
   "notices.channel_id": {
     label: "Notices channel",
     description: "Channel ID where notice messages are posted.",
     category: "notices",
+    type: "channel",
   },
   "notices.cleanup_interval": {
     label: "Channel cleanup interval (minutes)",
     description:
       "Interval in minutes between sweeps for unauthorised messages in the notices channel.",
     category: "notices",
+    type: "number",
   },
   "notices.header_enabled": {
     label: "Pinned header post enabled",
     description:
       "Post and maintain a pinned informational header in the notices channel.",
     category: "notices",
+    type: "boolean",
   },
   "notices.header_message_id": {
     label: "Header message ID (auto-managed)",
     description: "Auto-managed message ID of the notices channel header post.",
     category: "notices",
+    type: "string",
   },
   "notices.header_pin_enabled": {
     label: "Pin header post",
     description: "Pin the header post in the notices channel.",
     category: "notices",
+    type: "boolean",
   },
 
   // Poll System
@@ -574,17 +645,20 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     label: "Polls system enabled",
     description: "Enable the poll system and the /poll command.",
     category: "polls",
+    type: "boolean",
   },
   "polls.default_duration_hours": {
     label: "Default poll duration (hours)",
     description: "Default poll duration in hours (1–768).",
     category: "polls",
+    type: "number",
   },
   "polls.cooldown_days": {
     label: "Reuse cooldown (days)",
     description:
       "Minimum days before a question from the library can be reused.",
     category: "polls",
+    type: "number",
   },
 
   // Leaderboard Role Rewards
@@ -593,29 +667,34 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     description:
       "Auto-assign Discord roles to users based on their voice-leaderboard position.",
     category: "leaderboard_roles",
+    type: "boolean",
   },
   "leaderboard_roles.period": {
     label: "Leaderboard period",
     description:
       'Leaderboard period to evaluate: "week", "month", or "alltime".',
     category: "leaderboard_roles",
+    type: "string",
   },
   "leaderboard_roles.update_cron": {
     label: "Recalculation schedule (cron)",
     description:
       "Cron schedule for recalculating leaderboard role assignments.",
     category: "leaderboard_roles",
+    type: "cron",
   },
   "leaderboard_roles.tiers": {
     label: "Tier definitions",
     description:
       'Comma-separated "topN:roleId" pairs (e.g. "1:111,3:222,10:333"). Each tier independently assigns the role to users whose rank is ≤ N. Admins pick any positions; nothing is hardcoded.',
     category: "leaderboard_roles",
+    type: "string",
   },
   "leaderboard_roles.announcement_channel_id": {
     label: "Role-change announcements channel",
     description:
       "Optional channel ID where role-change announcements are posted. Leave empty to disable announcements.",
     category: "leaderboard_roles",
+    type: "channel",
   },
 };
diff --git a/src/web/admin-views.ts b/src/web/admin-views.ts
index 21792d7..c0e2aeb 100644
--- a/src/web/admin-views.ts
+++ b/src/web/admin-views.ts
@@ -169,6 +169,9 @@ export interface SettingRow {
 
 export interface SettingsProps extends CommonProps {
   groups: Array<{ category: string; rows: SettingRow[] }>;
+  textChannels: ChannelOption[];
+  categoryChannels: ChannelOption[];
+  roles: RoleOption[];
   flash?: FlashMessage | null;
 }
 
@@ -190,10 +193,46 @@ function coerceToDisplayValue(value: unknown): string | number | boolean {
   return String(value);
 }
 
-function renderSettingInput(r: SettingRow, csrfToken: string): string {
+/**
+ * Build `<option>` elements where any option whose id is in `selected`
+ * (Set) carries the `selected` attribute. Single-select callers pass a
+ * Set with at most one entry; multi-select callers pass however many they
+ * have.
+ */
+function buildOptionsHtml(
+  options: ChannelOption[] | RoleOption[],
+  selected: Set<string>,
+  prefix: string,
+  includeNoneRow: boolean,
+): string {
+  const parts: string[] = [];
+  if (includeNoneRow) {
+    parts.push(
+      `<option value="" ${selected.size === 0 ? "selected" : ""}>(none)</option>`,
+    );
+  }
+  for (const opt of options) {
+    const sel = selected.has(opt.id) ? " selected" : "";
+    parts.push(
+      `<option value="${escapeHtml(opt.id)}"${sel}>${prefix}${escapeHtml(opt.name)}</option>`,
+    );
+  }
+  return parts.join("");
+}
+
+function renderSettingInput(
+  r: SettingRow,
+  csrfToken: string,
+  pickers: {
+    textChannels: ChannelOption[];
+    categoryChannels: ChannelOption[];
+    roles: RoleOption[];
+  },
+): string {
   const csrf = `<input type="hidden" name="_csrf" value="${escapeHtml(csrfToken)}">`;
   const keyField = `<input type="hidden" name="key" value="${escapeHtml(r.key)}">`;
   const primitive = coerceToDisplayValue(r.current);
+  const currentStr = typeof primitive === "string" ? primitive : "";
 
   let control: string;
   if (r.type === "boolean") {
@@ -205,7 +244,40 @@ function renderSettingInput(r: SettingRow, csrfToken: string): string {
       `</label>`;
   } else if (r.type === "number") {
     control = `<input type="number" name="value" value="${escapeHtml(primitive)}" style="width:8rem">`;
+  } else if (
+    r.type === "channel" ||
+    r.type === "category" ||
+    r.type === "role"
+  ) {
+    const options =
+      r.type === "channel"
+        ? pickers.textChannels
+        : r.type === "category"
+          ? pickers.categoryChannels
+          : pickers.roles;
+    const prefix = r.type === "role" ? "@" : "#";
+    const selected = currentStr ? new Set([currentStr]) : new Set<string>();
+    control =
+      `<select name="value">` +
+      buildOptionsHtml(options, selected, prefix, true) +
+      `</select>`;
+  } else if (r.type === "channel_list" || r.type === "role_list") {
+    const options =
+      r.type === "channel_list" ? pickers.textChannels : pickers.roles;
+    const prefix = r.type === "role_list" ? "@" : "#";
+    const selected = new Set(
+      currentStr
+        .split(",")
+        .map((v) => v.trim())
+        .filter((v) => v !== ""),
+    );
+    control =
+      `<select name="value" multiple size="${Math.min(8, Math.max(3, options.length))}">` +
+      buildOptionsHtml(options, selected, prefix, false) +
+      `</select>`;
   } else {
+    // string, cron, or any unknown type → plain text. Issue #444 will
+    // replace cron with a friendly picker.
     control = `<input type="text" name="value" value="${escapeHtml(primitive)}">`;
   }
 
@@ -238,6 +310,11 @@ export function renderSettingsPage(props: SettingsProps): string {
   <a href="/admin/wizard" class="btn">Setup wizard</a>
 </div>`;
 
+  const pickers = {
+    textChannels: props.textChannels,
+    categoryChannels: props.categoryChannels,
+    roles: props.roles,
+  };
   const sections = props.groups
     .map((g) => {
       const meta = categoryMetadata[g.category] ?? {
@@ -251,7 +328,7 @@ export function renderSettingsPage(props: SettingsProps): string {
   <div><strong>${escapeHtml(r.label || r.key)}</strong></div>
   <code class="mono muted" style="font-size:.85em">${escapeHtml(r.key)}</code>
 </td>
-<td>${renderSettingInput(r, props.csrfToken)}</td>
+<td>${renderSettingInput(r, props.csrfToken, pickers)}</td>
 <td><span class="tag tag-info">${escapeHtml(r.type)}</span></td>
 <td style="white-space:nowrap">${formatValue(r.defaultValue)}</td>
 <td class="muted">${escapeHtml(r.description)}</td>
diff --git a/src/web/read-only-routes.ts b/src/web/read-only-routes.ts
index 88f240b..f8dee16 100644
--- a/src/web/read-only-routes.ts
+++ b/src/web/read-only-routes.ts
@@ -119,6 +119,7 @@ function commonFromReq(req: AuthenticatedRequest): {
 interface ChannelData {
   names: Map<string, string>;
   textChannels: ChannelOption[];
+  categoryChannels: ChannelOption[];
 }
 
 interface RoleData {
@@ -127,10 +128,10 @@ interface RoleData {
 }
 
 /**
- * Fetch the guild's channel cache once and derive both the id→name map
- * used for table rendering and the text-channel options used to populate
- * picker dropdowns. One Discord API roundtrip per request instead of
- * two.
+ * Fetch the guild's channel cache once and derive the id→name map plus
+ * the option lists used to populate picker dropdowns (text channels for
+ * normal channel pickers, category channels for the voicechannels
+ * managed-category picker). One Discord API roundtrip per request.
  */
 async function fetchChannelData(
   client: Client,
@@ -138,6 +139,7 @@ async function fetchChannelData(
 ): Promise<ChannelData> {
   const names = new Map<string, string>();
   const textChannels: ChannelOption[] = [];
+  const categoryChannels: ChannelOption[] = [];
   try {
     const guild = await client.guilds.fetch(guildId);
     await guild.channels.fetch();
@@ -150,13 +152,16 @@ async function fetchChannelData(
         ch.type === ChannelType.GuildAnnouncement
       ) {
         textChannels.push({ id: ch.id, name });
+      } else if (ch.type === ChannelType.GuildCategory) {
+        categoryChannels.push({ id: ch.id, name });
       }
     }
     textChannels.sort((a, b) => a.name.localeCompare(b.name));
+    categoryChannels.sort((a, b) => a.name.localeCompare(b.name));
   } catch (err) {
     logger.debug("fetchChannelData failed", err);
   }
-  return { names, textChannels };
+  return { names, textChannels, categoryChannels };
 }
 
 /**
@@ -351,6 +356,9 @@ export function createReadOnlyRouter(
       // and overrides them, prefer the DB value. This way every key has a
       // stable description on a fresh install — even before /config set
       // ever runs — without losing operator-customised descriptions.
+      // `type` comes from settingsMetadata when present (the typed config
+      // schema is authoritative) and falls back to runtime-inferred type
+      // for orphan DB rows that the schema doesn't know about.
       const rows: SettingRow[] = Object.entries(defaultConfig).map(
         ([key, defaultValue]) => {
           const dbEntry = storedByKey.get(key);
@@ -360,7 +368,7 @@ export function createReadOnlyRouter(
             label: meta?.label ?? key,
             current: dbEntry ? dbEntry.value : defaultValue,
             defaultValue,
-            type: describeType(defaultValue),
+            type: meta?.type ?? describeType(defaultValue),
             description: dbEntry?.description ?? meta?.description ?? "",
             category:
               dbEntry?.category ?? meta?.category ?? deriveCategory(key),
@@ -397,7 +405,25 @@ export function createReadOnlyRouter(
         rows: rs,
       }));
 
-      res.type("text/html").send(renderSettingsPage({ ...common, groups }));
+      // Guild cache for the new dropdown selectors. One fetch, three lists.
+      const { textChannels, categoryChannels, roles } = await Promise.all([
+        fetchChannelData(client, common.guildId),
+        fetchRoleData(client, common.guildId),
+      ]).then(([chData, roleData]) => ({
+        textChannels: chData.textChannels,
+        categoryChannels: chData.categoryChannels,
+        roles: roleData.roles,
+      }));
+
+      res.type("text/html").send(
+        renderSettingsPage({
+          ...common,
+          groups,
+          textChannels,
+          categoryChannels,
+          roles,
+        }),
+      );
     }),
   );
 
diff --git a/src/web/write-routes.ts b/src/web/write-routes.ts
index 0f777c9..137d1b4 100644
--- a/src/web/write-routes.ts
+++ b/src/web/write-routes.ts
@@ -233,6 +233,16 @@ export function coerceConfigValue(
     if (!Number.isFinite(n)) return { ok: false, reason: "invalid number" };
     return { ok: true, value: n };
   }
+  // Multi-select dropdowns (channel_list / role_list types) post the
+  // `value` field as an array of selected IDs. Collapse to the
+  // comma-separated string format the backend stores. Single-string keys
+  // never see arrays here so this branch is safe for both shapes.
+  if (Array.isArray(raw)) {
+    const csv = raw
+      .filter((v): v is string => typeof v === "string" && v !== "")
+      .join(",");
+    return { ok: true, value: csv };
+  }
   return { ok: true, value: String(raw ?? "") };
 }
 

From dcf09b880d0a9b276e0386958d7781097847820a Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Tue, 19 May 2026 14:28:01 +0000
Subject: [PATCH 2/2] fix: address Copilot review on #452
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Two real issues caught by the reviewer:

1. coerceConfigValue silently accepted array payloads on ANY string-
   typed key by joining them into CSV. A crafted form post or
   misconfigured YAML import could turn an accidental list into a
   stored string for keys that aren't channel_list / role_list,
   bypassing the import preview's type-mismatch detection. Worse, the
   number branch's `Number([n]) === n` coercion happily produced a
   numeric value for a single-element array. Restructured so the
   array-shape guard runs first and only the two *_list types accept
   array input — everything else rejects with "invalid shape".

2. buildOptionsHtml didn't render stored IDs that weren't in the live
   guild cache. For single-selects that meant the browser defaulted to
   the first option (the "(none)" row) and an operator could silently
   clear the setting by saving the form without touching the control.
   Stale-cache or deleted-entity scenarios now surface as
   `(missing) <id>` options that stay selected, so the value round-
   trips safely until the operator deliberately picks a real entity.

Schema:

- Added an explanatory comment next to voicechannels.category.name
  pointing at #447. Its `type` stays "string" until that issue renames
  the key to category_id and switches storage to ID; the renderer
  infrastructure for "category" is already in place to consume the
  flipped type.

Tests:

- 3 new coerceConfigValue tests: array rejected for string key, array
  rejected for number key, array still accepted for list types.
- 1 new render test exercising the (missing) <id> path on both
  single- and multi-select dropdowns.

The (none) row's `selected` attribute is now only emitted when actually
selected (previously a stray empty `selected=""` attribute slot leaked
in when something else was selected). No behaviour change for callers.
---
 __tests__/web/admin-views.test.ts  | 67 ++++++++++++++++++++++++++++++
 __tests__/web/write-routes.test.ts | 16 +++++++
 src/services/config-schema.ts      |  4 ++
 src/web/admin-views.ts             | 19 +++++++--
 src/web/write-routes.ts            | 33 ++++++++++-----
 5 files changed, 126 insertions(+), 13 deletions(-)

diff --git a/__tests__/web/admin-views.test.ts b/__tests__/web/admin-views.test.ts
index c6d8d29..51417ad 100644
--- a/__tests__/web/admin-views.test.ts
+++ b/__tests__/web/admin-views.test.ts
@@ -414,6 +414,73 @@ describe("renderSettingsPage", () => {
     expect(html).toContain('<option value="r2" selected>@Mod</option>');
   });
 
+  it("surfaces stored IDs that aren't in the live options as `(missing) <id>` and keeps them selected", () => {
+    // The configured channel was deleted from Discord (or the bot's
+    // cache is stale). The dropdown must still preserve the stored value
+    // so saving the form doesn't silently clear the setting.
+    const singleSelect = renderSettingsPage({
+      ...COMMON,
+      textChannels: [{ id: "111", name: "general" }],
+      categoryChannels: [],
+      roles: [],
+      groups: [
+        {
+          category: "voicetracking",
+          rows: [
+            {
+              key: "voicetracking.announcements.channel_id",
+              label: "Announcement channel",
+              current: "999-deleted",
+              defaultValue: "",
+              type: "channel",
+              description: "",
+              category: "voicetracking",
+            },
+          ],
+        },
+      ],
+    });
+    expect(singleSelect).toContain(
+      '<option value="999-deleted" selected>(missing) 999-deleted</option>',
+    );
+    // And the "(none)" placeholder should NOT be the selected one in this
+    // case — the missing-ID option carries the selection.
+    expect(singleSelect).toMatch(/<option value=""[^>]*>\(none\)<\/option>/);
+    expect(singleSelect).not.toMatch(
+      /<option value="" selected>\(none\)<\/option>/,
+    );
+
+    // Multi-select case: one known + one missing.
+    const multiSelect = renderSettingsPage({
+      ...COMMON,
+      textChannels: [{ id: "111", name: "general" }],
+      categoryChannels: [],
+      roles: [],
+      groups: [
+        {
+          category: "voicetracking",
+          rows: [
+            {
+              key: "voicetracking.excluded_channels",
+              label: "Excluded channels",
+              current: "111,999-deleted",
+              defaultValue: "",
+              type: "channel_list",
+              description: "",
+              category: "voicetracking",
+            },
+          ],
+        },
+      ],
+    });
+    expect(multiSelect).toContain(
+      '<option value="111" selected>#general</option>',
+    );
+    expect(multiSelect).toContain(
+      '<option value="999-deleted" selected>(missing) 999-deleted</option>',
+    );
+  });
+
   it("falls back to a text input for cron-type settings (placeholder until #444)", () => {
     const html = renderSettingsPage({
       ...COMMON,
diff --git a/__tests__/web/write-routes.test.ts b/__tests__/web/write-routes.test.ts
index da6b283..978a170 100644
--- a/__tests__/web/write-routes.test.ts
+++ b/__tests__/web/write-routes.test.ts
@@ -124,4 +124,20 @@ describe("coerceConfigValue", () => {
       coerceConfigValue("voicetracking.excluded_channels", []),
     ).toEqual({ ok: true, value: "" });
   });
+
+  it("rejects an array payload for a non-list string key", () => {
+    // A misconfigured YAML import or crafted form post mustn't silently
+    // CSV-join an accidental list into a string-typed key. Only the two
+    // *_list types accept array input.
+    const r = coerceConfigValue("voicechannels.lobby.name", ["a", "b"]);
+    expect(r.ok).toBe(false);
+    if (!r.ok) {
+      expect(r.reason).toMatch(/array/i);
+    }
+  });
+
+  it("rejects an array payload for a number key", () => {
+    const r = coerceConfigValue("quotes.max_length", [500]);
+    expect(r.ok).toBe(false);
+  });
 });
diff --git a/src/services/config-schema.ts b/src/services/config-schema.ts
index 89cf41b..64dfcd4 100644
--- a/src/services/config-schema.ts
+++ b/src/services/config-schema.ts
@@ -308,6 +308,10 @@ export const settingsMetadata: Record<keyof ConfigSchema, SettingMetadata> = {
     description:
       "Name of the Discord category that contains managed voice channels.",
     category: "voicechannels",
+    // `string` (not "category") until #447 renames this to
+    // `voicechannels.category_id` and switches storage from name to ID.
+    // The renderer infrastructure for "category" already exists; flipping
+    // the type is a one-line change once #447 lands.
     type: "string",
   },
   "voicechannels.lobby.name": {
diff --git a/src/web/admin-views.ts b/src/web/admin-views.ts
index c0e2aeb..7833a82 100644
--- a/src/web/admin-views.ts
+++ b/src/web/admin-views.ts
@@ -198,6 +198,13 @@ function coerceToDisplayValue(value: unknown): string | number | boolean {
  * (Set) carries the `selected` attribute. Single-select callers pass a
  * Set with at most one entry; multi-select callers pass however many they
  * have.
+ *
+ * Stored IDs that aren't in the live options list (channel was deleted,
+ * role was renamed and the cache is stale, …) are surfaced as
+ * `(missing) <id>` options that stay `selected` on render. Without this
+ * the browser would default the single-select to the first option
+ * (typically the "(none)" row) and an operator could silently clear the
+ * setting by saving the form without touching the control.
  */
 function buildOptionsHtml(
   options: ChannelOption[] | RoleOption[],
@@ -207,16 +214,22 @@ function buildOptionsHtml(
 ): string {
   const parts: string[] = [];
   if (includeNoneRow) {
-    parts.push(
-      `<option value="" ${selected.size === 0 ? "selected" : ""}>(none)</option>`,
-    );
+    const noneSel = selected.size === 0 ? " selected" : "";
+    parts.push(`<option value=""${noneSel}>(none)</option>`);
   }
+  const knownIds = new Set(options.map((o) => o.id));
   for (const opt of options) {
     const sel = selected.has(opt.id) ? " selected" : "";
     parts.push(
       `<option value="${escapeHtml(opt.id)}"${sel}>${prefix}${escapeHtml(opt.name)}</option>`,
     );
   }
+  for (const id of selected) {
+    if (id === "" || knownIds.has(id)) continue;
+    parts.push(
+      `<option value="${escapeHtml(id)}" selected>(missing) ${escapeHtml(id)}</option>`,
+    );
+  }
   return parts.join("");
 }
 
diff --git a/src/web/write-routes.ts b/src/web/write-routes.ts
index 137d1b4..28a484e 100644
--- a/src/web/write-routes.ts
+++ b/src/web/write-routes.ts
@@ -222,6 +222,29 @@ export function coerceConfigValue(
   if (!(key in defaultConfig)) {
     return { ok: false, reason: "unknown key" };
   }
+
+  // Array payloads only make sense for the multi-select Discord-entity
+  // types (channel_list / role_list). For every other key shape, an
+  // array means something is wrong upstream — a misconfigured YAML
+  // import, a crafted form post, or JS coercion silently flattening a
+  // one-element array into a scalar (e.g. `Number([42]) === 42`).
+  // Reject loudly here so the failure surfaces in the import preview /
+  // audit log instead of being silently swallowed.
+  if (Array.isArray(raw)) {
+    const metaType =
+      settingsMetadata[key as keyof typeof settingsMetadata]?.type;
+    if (metaType !== "channel_list" && metaType !== "role_list") {
+      return {
+        ok: false,
+        reason: "invalid shape (array provided for non-list key)",
+      };
+    }
+    const csv = raw
+      .filter((v): v is string => typeof v === "string" && v !== "")
+      .join(",");
+    return { ok: true, value: csv };
+  }
+
   const expected = typeof defaultConfig[key as keyof typeof defaultConfig];
   if (expected === "boolean") {
     // HTML checkboxes post "true" when checked, the field is absent when
@@ -233,16 +256,6 @@ export function coerceConfigValue(
     if (!Number.isFinite(n)) return { ok: false, reason: "invalid number" };
     return { ok: true, value: n };
   }
-  // Multi-select dropdowns (channel_list / role_list types) post the
-  // `value` field as an array of selected IDs. Collapse to the
-  // comma-separated string format the backend stores. Single-string keys
-  // never see arrays here so this branch is safe for both shapes.
-  if (Array.isArray(raw)) {
-    const csv = raw
-      .filter((v): v is string => typeof v === "string" && v !== "")
-      .join(",");
-    return { ok: true, value: csv };
-  }
   return { ok: true, value: String(raw ?? "") };
 }