feat: pause Today during mobile device setup (Closes #1084)

frontend/dashboard.js

@@ -7916,6 +7916,7 @@
     installApp.start();
     deviceSetup = createMobileDeviceSetup.mount({
       document, installApp, promptStorage:localStorage,
+      timerView,
       offlineAvailable:() => offlineStorageReady,
       offlineEnabled:() => offlineWorkStore.enabled(),
       enableOffline:() => setOfflineWorkEnabled(true),

frontend/index.html

@@ -95,6 +95,10 @@
       </div>
       <button id="close-device-setup" type="button" aria-label="Close device setup">Close</button>
     </div>
+    <aside class="today-detour-interruption" id="device-setup-today-detour" data-today-detour role="status" aria-live="polite" hidden>
+      <strong data-today-detour-label>Today paused</strong>
+      <button id="return-from-device-setup" data-return-from-detour type="button">Return to Today</button>
+    </aside>
     <ol class="device-setup-list">
       <li class="device-setup-step">
         <div><strong>Install Stackchain</strong><p class="small" id="device-setup-install-status" role="status"></p></div>

frontend/mobile-device-setup.js

@@ -11,6 +11,7 @@
     ['deadline', options.deadlineButton, options.deadlineStatus, options.enableDeadline],
   ];
   let trigger = options.launcher;
+  let ownsDetour = false;
 
   function readinessCounts(readiness) {
     const available = steps.filter(([name]) => readiness[name].state !== 'unavailable').length;
@@ -50,13 +51,18 @@
 
   async function open(event) {
     trigger = event?.currentTarget || options.launcher;
+    if (options.isMobile?.()) {
+      ownsDetour = options.timerView?.beginDetour?.('device-setup')?.reason === 'device-setup';
+    }
     await render();
     options.sheet.hidden = false;
     options.closeButton.focus();
   }
 
-  function close() {
+  function close(resume = true) {
     options.sheet.hidden = true;
+    if (resume && ownsDetour) options.timerView?.finishDetour?.();
+    ownsDetour = false;
     trigger?.focus?.();
   }
 
@@ -70,6 +76,7 @@
       options.promptCard.hidden = true;
     });
     options.closeButton.addEventListener('click', close);
+    options.returnButton?.addEventListener('click', () => close(false));
     options.sheet.addEventListener('click', event => {
       if (event.target === options.sheet) close();
     });
@@ -108,6 +115,9 @@ function mountMobileDeviceSetup(options) {
     promptCard:qs('#device-readiness-card'), promptSummary:qs('#device-readiness-summary'),
     promptLauncher:qs('#finish-device-setup'), promptDismiss:qs('#dismiss-device-readiness'),
     promptStorage:options.promptStorage,
+    returnButton:qs('#return-from-device-setup'),
+    timerView:options.timerView,
+    isMobile:options.isMobile || (() => innerWidth <= 600),
     escapeTarget:options.document,
     getReadiness:() => ({
       install:options.installApp.state(),

frontend/today-timer.js

@@ -57,7 +57,7 @@ function createTodayTimer({ storage, getLogin, now = () => Date.now(), onChange
   const validDetour = state => {
     const pending = state.detour_interruption;
     return pending && typeof pending.identity === 'string' && pending.identity &&
-      typeof pending.resume === 'boolean' && ['find', 'queues', 'insights'].includes(pending.reason) ?
+      typeof pending.resume === 'boolean' && ['find', 'queues', 'insights', 'device-setup'].includes(pending.reason) ?
       { identity:pending.identity, resume:pending.resume, reason:pending.reason } : null;
   };
   const validBreak = state => {
@@ -289,7 +289,7 @@ function createTodayTimer({ storage, getLogin, now = () => Date.now(), onChange
       return write(state) ? { identity:pending.identity, resumed } : null;
     },
     beginDetour(reason) {
-      if (!['find', 'queues', 'insights'].includes(reason)) return null;
+      if (!['find', 'queues', 'insights', 'device-setup'].includes(reason)) return null;
       const state = read();
       const existing = validDetour(state);
       if (existing) return existing;