f4140d45c4
Tab-level choice (ped_last_tab) already survived sign-out/in via localStorage, but sub-pill and sub-tab selections inside a loaded tab lived only in memory — they reset to defaults after a reload or browser restart. Now the following are persisted under the ped_ui/ namespace: - Calculators nav pill (BP / BMI / GCS / …) - Bedside sub-pill (neonatal / airway / …) - Well Visit sub-tab (byvisit / milestones / shadess / note) - Physical Exam Guide age group + system Implementation: - Added public/js/ui-state.js — a ~30-line window.UIState wrapper around localStorage with a ped_ui/ prefix and try/catch around both read and write (Safari private mode + quota errors silently no-op). - Each tab's click handler now also calls UIState.set; each tab's init path calls UIState.get and replays the saved value through the same function a click would call — so there is exactly one code path for "show this selection", whether it came from the user or from a restore. For Bedside, the restore additionally listens for tabChanged so the lazy-loaded HTML is guaranteed to exist by the time we re-activate the pill. Tests: - e2e/tests/ui-state-persistence.spec.js — 5 specs × 2 viewports = 10 tests. Each clicks the feature, reloads the page, and asserts the same pill / subtab / dropdown value is still active. Catches any future regression in the persistence wiring. - e2e/tests/soap-hospital-workflow.spec.js — fills SOAP transcript, generates via mocked AI, clears, opens/closes load popovers; also smoke-tests the Hospital Course save-bar. Suite: 250 passed / 0 failed (+ 20 over the last run).
43 lines
1.8 KiB
JavaScript
43 lines
1.8 KiB
JavaScript
// ============================================================
|
|
// bedside/sub-nav.js
|
|
// EMERGENCIES SUB-NAV — data-em pill switching.
|
|
// Persists the active pill so reloads / sign-out-sign-in land on the
|
|
// same sub-section the user was last looking at.
|
|
// ============================================================
|
|
|
|
var SECTIONS = ['neonatal','airway','cardiac','respiratory','ventilation','seizure','sepsis','anaphylaxis','sedation','agitation','antiemetics','antimicrobials','burns','toxicology','trauma'];
|
|
|
|
function activate(emKey) {
|
|
var pill = document.querySelector('[data-em="' + emKey + '"]');
|
|
if (!pill) return false;
|
|
document.querySelectorAll('[data-em]').forEach(function(p) { p.classList.remove('active'); });
|
|
pill.classList.add('active');
|
|
SECTIONS.forEach(function(s) {
|
|
var el = document.getElementById('em-' + s);
|
|
if (el) el.style.display = emKey === s ? '' : 'none';
|
|
});
|
|
return true;
|
|
}
|
|
|
|
export function init() {
|
|
document.addEventListener('click', function(e) {
|
|
var pill = e.target.closest('[data-em]');
|
|
if (!pill) return;
|
|
activate(pill.dataset.em);
|
|
if (window.UIState) window.UIState.set('bedside.pill', pill.dataset.em);
|
|
});
|
|
// Restore on load. The bedside component is lazily injected the first time
|
|
// the tab is activated, so try both an immediate pass (harness where the
|
|
// DOM is synchronously ready) and a tabChanged listener (live app where
|
|
// the component HTML arrives async). Either path reaches the same
|
|
// activate(saved) call — whichever fires first wins; the other is a noop.
|
|
function applySaved() {
|
|
if (!window.UIState) return;
|
|
var saved = window.UIState.get('bedside.pill');
|
|
if (saved) activate(saved);
|
|
}
|
|
applySaved();
|
|
document.addEventListener('tabChanged', function(e) {
|
|
if (e.detail && e.detail.tab === 'bedside') applySaved();
|
|
});
|
|
}
|