Organize settings into searchable sections with responsive navigation

frontend/settings-sections.test.js

@@ -0,0 +1,18 @@
+const { test } = require('node:test');
+const assert = require('node:assert/strict');
+const Settings = require('./settings-sections');
+test('registry supports extension sections, replacement and safe removal', () => {
+  const registry = Settings.createRegistry(), render = () => {};
+  const remove = registry.register({ id: 'pedals', title: 'MIDI pedals', render });
+  assert.equal(registry.get('pedals').cluster, 'Advanced & about');
+  registry.register({ id: 'pedals', title: 'Pedalboard', render: () => {} }); remove();
+  assert.equal(registry.get('pedals').title, 'Pedalboard');
+  assert.throws(() => registry.register({ id: '../bad', title: 'Invalid', render }));
+});
+test('settings search matches labels and help text across sections without case sensitivity', () => {
+  const rows = [{ title: 'Playback', description: 'Level volume between songs' }, { title: 'Cache size limit', description: 'Auto-evict oldest files' }];
+  assert.equal(Settings.search(rows, 'VOLUME songs')[0].title, 'Playback');
+  assert.equal(Settings.search(rows, 'oldest limit')[0].title, 'Cache size limit');
+  assert.equal(Settings.search(rows, 'unavailable').length, 0);
+  assert.equal(Settings.search(rows, '').length, 2);
+});