refactor(settings/audit): conditional retention disclosure + flat layout
Drops the wrapping details-card so the audit toggle and retention input read like the email page. The audit switch now uses role="switch" and a new app-settings-audit component (built on the existing createConditionalToggleInit primitive) hides the retention block when audit is disabled — the input is meaningless without audit on, and the control state syncs automatically on toggle. The redundant info blockquote and the toggle's paraphrased DB description are gone. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -20,6 +20,7 @@ import { initCustomFieldOptionsToggle } from './components/app-custom-field-opti
|
||||
import { initTenantSsoToggle } from './components/app-tenant-sso-toggle.js';
|
||||
import { initTenantLdapToggle } from './components/app-tenant-ldap-toggle.js';
|
||||
import { initTelemetrySettings } from './components/app-settings-telemetry.js';
|
||||
import { initSettingsAudit } from './components/app-settings-audit.js';
|
||||
import { initStandardDetailPages } from './components/app-standard-detail-page.js';
|
||||
import { initAutoSubmit } from './components/app-auto-submit.js';
|
||||
import { initTabs } from './components/app-tabs.js';
|
||||
@@ -196,6 +197,10 @@ const bootRuntime = async () => {
|
||||
scope: 'global',
|
||||
configPath: 'components.settingsTelemetry',
|
||||
});
|
||||
runtime.register('settings-audit', initSettingsAudit, {
|
||||
scope: 'global',
|
||||
configPath: 'components.settingsAudit',
|
||||
});
|
||||
runtime.register('auto-submit', initAutoSubmit, {
|
||||
scope: 'global',
|
||||
configPath: 'components.autoSubmit',
|
||||
|
||||
24
web/js/components/app-settings-audit.js
Normal file
24
web/js/components/app-settings-audit.js
Normal file
@@ -0,0 +1,24 @@
|
||||
/**
|
||||
* Shows/hides audit retention field based on the audit-enabled toggle.
|
||||
*/
|
||||
import { syncControlState, createConditionalToggleInit } from '../core/app-conditional-controls.js';
|
||||
|
||||
const initRoot = (root) => {
|
||||
const enabledInput = root.querySelector('[data-audit-enabled-toggle]');
|
||||
const dependent = root.querySelector('[data-audit-when-enabled]');
|
||||
if (!(enabledInput instanceof HTMLInputElement) || !(dependent instanceof HTMLElement)) {
|
||||
return null;
|
||||
}
|
||||
const sync = () => syncControlState(dependent, enabledInput.checked);
|
||||
enabledInput.addEventListener('change', sync);
|
||||
sync();
|
||||
return () => {
|
||||
enabledInput.removeEventListener('change', sync);
|
||||
};
|
||||
};
|
||||
|
||||
export const initSettingsAudit = createConditionalToggleInit({
|
||||
rootSelector: '[data-settings-audit-root]',
|
||||
boundKey: 'settingsAuditBound',
|
||||
initRoot,
|
||||
});
|
||||
Reference in New Issue
Block a user