Files
breadcrumb-the-shire/web/js/components/app-settings-telemetry.js
fs 9ee2589820 refactor(settings/telemetry): single card with full sub-config disclosure
Collapses the two telemetry cards (Frontend telemetry + Advanced) into
one card so the master toggle and its sub-config (sampling + allowed
events) read as one coherent block. The conditional disclosure now
hides the entire sub-config when telemetry is off — previously only the
sampling fieldset hid, leaving Advanced visible with no effect.

The sampling select sits in a 2-column grid with an empty filler so it
keeps a sensible width instead of stretching across the page. Both
redundant info blockquotes are gone (the master switch carries a muted
hint, and the events block has its own caption). The simplified
component drops the now-redundant samplingRowSelector and consumes a
single data-telemetry-when-enabled wrapper.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-25 18:22:23 +02:00

30 lines
1.1 KiB
JavaScript

/**
* Hides the telemetry sub-config (sampling + allowed events) when the
* master toggle is off. The sub-block is one container so all dependent
* fields stay in sync together.
*/
import { resolveHost } from '../core/app-dom.js';
import { syncControlState } from '../core/app-conditional-controls.js';
export const initTelemetrySettings = (root = document, options = {}) => {
const host = resolveHost(root);
const toggleSelector = String(options.toggleSelector || '[data-telemetry-enabled-toggle]').trim() || '[data-telemetry-enabled-toggle]';
const dependentSelector = String(options.dependentSelector || '[data-telemetry-when-enabled]').trim() || '[data-telemetry-when-enabled]';
const toggle = host.querySelector(toggleSelector);
const dependent = host.querySelector(dependentSelector);
if (!toggle || !dependent) {
return { destroy: () => {} };
}
const sync = () => syncControlState(dependent, Boolean(toggle.checked));
toggle.addEventListener('change', sync);
sync();
return {
destroy: () => {
toggle.removeEventListener('change', sync);
},
};
};