@the-portland-company/shell 0.55.0 → 0.57.0

package/dist/app-chrome.cjs

@@ -169,6 +169,7 @@ var CORE_APP_ORIGIN = "https://app.politogyvrm.com";
 var CORE_BILLING_PATH = "/organization-settings/subscription-billing/text-email";
 var CORE_BILLING_URL = `${CORE_APP_ORIGIN}${CORE_BILLING_PATH}`;
 var QUARANTINED_CONTACTS_URL = `https://contacts.politogyvrm.com/duplicates`;
+var SPECS_ORIGIN = "https://specs.politogyvrm.com";
 function withOrgParam(url, orgId) {
   if (!orgId) return url;
   return `${url}${url.includes("?") ? "&" : "?"}org=${orgId}`;
@@ -291,16 +292,46 @@ function NavThemeControl({
     )
   ] });
 }
+var CHROME_FETCH_CACHE_TTL_MS = 3e4;
+function chromeCacheKey(path, orgId) {
+  return orgId === void 0 ? path : `${path}::${orgId ?? ""}`;
+}
+function createChromeFetchCache(getFetchJson) {
+  const cache = /* @__PURE__ */ new Map();
+  function dedupedFetch(path, init, opts = {}) {
+    const key = chromeCacheKey(path, opts.orgId);
+    const now = Date.now();
+    const hit = cache.get(key);
+    if (hit && hit.expiresAt > now) return hit.promise;
+    const promise = getFetchJson()(path, init);
+    promise.catch(() => cache.delete(key));
+    cache.set(key, { promise, expiresAt: now + (opts.ttlMs ?? CHROME_FETCH_CACHE_TTL_MS) });
+    return promise;
+  }
+  function invalidate(path) {
+    for (const key of cache.keys()) {
+      if (key === path || key.startsWith(`${path}::`)) cache.delete(key);
+    }
+  }
+  return { dedupedFetch, invalidate };
+}
 var NavChromeContext = react.createContext(null);
 function NavChromeProvider({
   fetchJson,
   children
 }) {
+  const fetchJsonRef = react.useRef(fetchJson);
+  fetchJsonRef.current = fetchJson;
+  const cacheRef = react.useRef(null);
+  if (!cacheRef.current) {
+    cacheRef.current = createChromeFetchCache(() => fetchJsonRef.current);
+  }
+  const { dedupedFetch, invalidate: invalidateChromeCache } = cacheRef.current;
   const [me, setMe] = react.useState(null);
   const [meLoaded, setMeLoaded] = react.useState(false);
   react.useEffect(() => {
     let cancelled = false;
-    fetchJson("me").then((data) => {
+    dedupedFetch("me", void 0).then((data) => {
       if (!cancelled) setMe(data);
     }).catch(() => {
     }).finally(() => {
@@ -309,8 +340,8 @@ function NavChromeProvider({
     return () => {
       cancelled = true;
     };
-  }, [fetchJson]);
-  return /* @__PURE__ */ jsxRuntime.jsx(NavChromeContext.Provider, { value: { fetchJson, me, meLoaded }, children });
+  }, [dedupedFetch]);
+  return /* @__PURE__ */ jsxRuntime.jsx(NavChromeContext.Provider, { value: { fetchJson, dedupedFetch, invalidateChromeCache, me, meLoaded }, children });
 }
 function useChromeMe() {
   const ctx = react.useContext(NavChromeContext);
@@ -329,7 +360,7 @@ function useNavChrome(component) {
   return ctx;
 }
 function useChromeOrgs() {
-  const { fetchJson } = useNavChrome("useChromeOrgs");
+  const { dedupedFetch } = useNavChrome("useChromeOrgs");
   const [orgs, setOrgs] = react.useState(null);
   const [loading, setLoading] = react.useState(true);
   const [error, setError] = react.useState(false);
@@ -337,7 +368,7 @@ function useChromeOrgs() {
     let cancelled = false;
     setLoading(true);
     setError(false);
-    fetchJson("orgs").then((data) => {
+    dedupedFetch("orgs", void 0).then((data) => {
       if (cancelled) return;
       const list = data?.orgs ?? [];
       setOrgs(list);
@@ -349,7 +380,7 @@ function useChromeOrgs() {
     return () => {
       cancelled = true;
     };
-  }, [fetchJson]);
+  }, [dedupedFetch]);
   return { orgs, loading, error };
 }
 function ValueSkeleton({ className }) {
@@ -633,7 +664,7 @@ function LowFuelHint({ lowFuel, orgId }) {
   );
 }
 function FuelAction({ orgId }) {
-  const { fetchJson } = useNavChrome("FuelAction");
+  const { dedupedFetch } = useNavChrome("FuelAction");
   const [fuel, setFuel] = react.useState(null);
   const [loading, setLoading] = react.useState(true);
   const [error, setError] = react.useState(false);
@@ -642,9 +673,11 @@ function FuelAction({ orgId }) {
     setLoading(true);
     setError(false);
     setFuel(null);
-    fetchJson("communications/fuel-status", {
-      headers: orgId ? { "x-contacts-org": orgId } : void 0
-    }).then((data) => {
+    dedupedFetch(
+      "communications/fuel-status",
+      { headers: orgId ? { "x-contacts-org": orgId } : void 0 },
+      { orgId }
+    ).then((data) => {
       if (cancelled) return;
       setFuel(data?.fuel ?? null);
     }).catch(() => {
@@ -655,7 +688,7 @@ function FuelAction({ orgId }) {
     return () => {
       cancelled = true;
     };
-  }, [fetchJson, orgId]);
+  }, [dedupedFetch, orgId]);
   const low = !!fuel && (fuel.signal.lowFuel || fuel.broadcast.lowFuel);
   return (
     // The nudge anchors to the trigger, so it sits OUTSIDE the popover panel in
@@ -726,7 +759,6 @@ function writeNotifState(orgId, state) {
   } catch {
   }
 }
-var TEN_DLC_REDIRECTED_KEY = "politogy_10dlc_redirected";
 var TOASTS_MUTED_KEY = "politogy_chrome_toasts_muted";
 function readToastsMuted() {
   if (typeof window === "undefined") return false;
@@ -857,7 +889,7 @@ function NewReplyToast({
   );
 }
 function NotificationsAction({ orgId }) {
-  const { fetchJson } = useNavChrome("NotificationsAction");
+  const { dedupedFetch } = useNavChrome("NotificationsAction");
   const [payload, setPayload] = react.useState(null);
   const [loading, setLoading] = react.useState(true);
   const [error, setError] = react.useState(false);
@@ -876,9 +908,11 @@ function NotificationsAction({ orgId }) {
     setLoading(true);
     setError(false);
     setPayload(null);
-    fetchJson("notifications", {
-      headers: orgId ? { "x-contacts-org": orgId } : void 0
-    }).then((data) => {
+    dedupedFetch(
+      "notifications",
+      { headers: orgId ? { "x-contacts-org": orgId } : void 0 },
+      { orgId }
+    ).then((data) => {
       if (!cancelled) setPayload(data);
     }).catch(() => {
       if (!cancelled) setError(true);
@@ -888,29 +922,7 @@ function NotificationsAction({ orgId }) {
     return () => {
       cancelled = true;
     };
-  }, [fetchJson, orgId]);
-  react.useEffect(() => {
-    if (!payload || typeof window === "undefined") return;
-    const alert = payload.alerts.find((a) => a.kind === "10dlc_registration" && a.href);
-    if (!alert?.href) return;
-    try {
-      if (window.sessionStorage.getItem(TEN_DLC_REDIRECTED_KEY) === "1") return;
-    } catch {
-      return;
-    }
-    let target;
-    try {
-      target = new URL(alert.href, window.location.href);
-    } catch {
-      return;
-    }
-    if (target.origin !== window.location.origin) return;
-    try {
-      window.sessionStorage.setItem(TEN_DLC_REDIRECTED_KEY, "1");
-    } catch {
-    }
-    window.location.assign(alert.href);
-  }, [payload]);
+  }, [dedupedFetch, orgId]);
   const markRead = react.useCallback(
     (id) => {
       setNotif((prev) => {
@@ -1311,6 +1323,216 @@ function SupportAction({ orgId } = {}) {
     ) : null
   ] });
 }
+var SPEC_OVERLAY_ACCESS_CACHE_KEY = "politogy_spec_overlay_access";
+function readSpecOverlayAccessCache() {
+  if (typeof window === "undefined") return null;
+  try {
+    const raw = window.sessionStorage.getItem(SPEC_OVERLAY_ACCESS_CACHE_KEY);
+    if (!raw) return null;
+    const parsed = JSON.parse(raw);
+    if (typeof parsed?.allowed === "boolean") return parsed;
+  } catch {
+  }
+  return null;
+}
+function writeSpecOverlayAccessCache(access) {
+  if (typeof window === "undefined") return;
+  try {
+    window.sessionStorage.setItem(SPEC_OVERLAY_ACCESS_CACHE_KEY, JSON.stringify(access));
+  } catch {
+  }
+}
+var locationChangeListeners = /* @__PURE__ */ new Set();
+var historyPatched = false;
+function ensureHistoryPatched() {
+  if (historyPatched || typeof window === "undefined") return;
+  historyPatched = true;
+  const notify = () => locationChangeListeners.forEach((fn) => fn());
+  const originalPushState = window.history.pushState.bind(window.history);
+  const originalReplaceState = window.history.replaceState.bind(window.history);
+  window.history.pushState = (...args) => {
+    originalPushState(...args);
+    notify();
+  };
+  window.history.replaceState = (...args) => {
+    originalReplaceState(...args);
+    notify();
+  };
+  window.addEventListener("popstate", notify);
+}
+function useLocationHref() {
+  const [href, setHref] = react.useState(
+    () => typeof window === "undefined" ? "" : window.location.href
+  );
+  react.useEffect(() => {
+    ensureHistoryPatched();
+    const onChange = () => setHref(window.location.href);
+    locationChangeListeners.add(onChange);
+    return () => {
+      locationChangeListeners.delete(onChange);
+    };
+  }, []);
+  return href;
+}
+function specOverlayFetchJson(path) {
+  return fetch(`${SPECS_ORIGIN}${path}`, { credentials: "include" }).then((res) => {
+    if (!res.ok) throw new Error(`spec overlay ${path}: ${res.status}`);
+    return res.json();
+  });
+}
+function SpecOverlayAction({ orgId } = {}) {
+  const [access, setAccess] = react.useState(() => readSpecOverlayAccessCache());
+  const [status, setStatus] = react.useState(null);
+  const [open, setOpen] = react.useState(false);
+  const href = useLocationHref();
+  react.useEffect(() => {
+    if (access) return;
+    let cancelled = false;
+    specOverlayFetchJson("/api/overlay/access").then((data) => {
+      if (cancelled) return;
+      const next = data && typeof data.allowed === "boolean" ? data : { allowed: false };
+      setAccess(next);
+      writeSpecOverlayAccessCache(next);
+    }).catch(() => {
+      if (cancelled) return;
+      const next = { allowed: false };
+      setAccess(next);
+      writeSpecOverlayAccessCache(next);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [access]);
+  react.useEffect(() => {
+    if (!access?.allowed || typeof window === "undefined") return;
+    const timer = window.setTimeout(() => {
+      const url = `/api/overlay/status?url=${encodeURIComponent(window.location.href)}`;
+      specOverlayFetchJson(url).then((data) => setStatus(data)).catch(() => setStatus(null));
+    }, 300);
+    return () => window.clearTimeout(timer);
+  }, [access?.allowed, href, orgId]);
+  if (!access?.allowed) return null;
+  const badgeLabel = status && status.matched ? `${Math.round(status.mismatch_pct)}%` : status ? "\u2014" : void 0;
+  const badgeTone = status && status.matched ? status.passed ? "default" : "danger" : "default";
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        type: "button",
+        "aria-label": "Spec",
+        "aria-expanded": open,
+        className: topBarIconButtonClass(badgeTone),
+        onClick: () => setOpen(true),
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(LayoutGlyph, { size: 20, className: "text-current" }),
+          badgeLabel ? /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: [
+                "absolute -top-1 -right-1 flex h-4 min-w-4 items-center justify-center rounded-full px-1 text-[10px] font-normal leading-none text-white",
+                status && status.matched ? status.passed ? "bg-[color:var(--chrome-success,#2f855a)]" : "bg-[color:var(--chrome-danger)]" : "bg-[color:var(--muted)]"
+              ].join(" "),
+              children: badgeLabel
+            }
+          ) : null,
+          !open ? /* @__PURE__ */ jsxRuntime.jsx(
+            TopBarTooltip,
+            {
+              title: "Spec",
+              description: "Spec design + visual regression for this page."
+            }
+          ) : null
+        ]
+      }
+    ),
+    open && typeof document !== "undefined" ? reactDom.createPortal(
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "fixed inset-0 z-50 flex justify-end bg-black/40",
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-label": "Spec overlay",
+          onMouseDown: (e) => {
+            if (e.target === e.currentTarget) setOpen(false);
+          },
+          onKeyDown: (e) => {
+            if (e.key === "Escape") setOpen(false);
+          },
+          children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full w-full max-w-[480px] flex-col border-l border-[color:var(--line)] bg-[color:var(--panel-elevated)] shadow-[var(--shadow-soft)]", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2 border-b border-[color:var(--line)] px-4 py-3", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("h2", { className: "truncate text-sm font-bold tracking-[-0.01em] text-[color:var(--foreground)]", children: [
+                "Spec",
+                status && status.matched ? `: ${status.spec_title}` : ""
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  type: "button",
+                  "aria-label": "Close",
+                  onClick: () => setOpen(false),
+                  className: "rounded-full p-1 text-[color:var(--muted)] hover:bg-[color:var(--panel)] hover:text-[color:var(--foreground)]",
+                  children: /* @__PURE__ */ jsxRuntime.jsx(CloseGlyph, { size: 16 })
+                }
+              )
+            ] }),
+            status && status.matched ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3 border-b border-[color:var(--line)] px-4 py-2 text-xs font-semibold", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "a",
+                  {
+                    href: status.spec_url,
+                    target: "_blank",
+                    rel: "noreferrer",
+                    className: "text-[color:var(--color-accent)] hover:underline",
+                    children: "Open spec \u2197"
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "a",
+                  {
+                    href: status.compare_url,
+                    target: "_blank",
+                    rel: "noreferrer",
+                    className: "text-[color:var(--color-accent)] hover:underline",
+                    children: "Compare tab \u2197"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "iframe",
+                {
+                  src: status.overlay_url,
+                  title: "Spec overlay",
+                  className: "h-full w-full flex-1 border-0"
+                }
+              )
+            ] }) : status && !status.matched ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4 text-sm text-[color:var(--muted)]", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("p", { children: "No compare target covers this page." }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "a",
+                {
+                  href: status.search_url,
+                  target: "_blank",
+                  rel: "noreferrer",
+                  className: "mt-2 inline-block font-semibold text-[color:var(--color-accent)] hover:underline",
+                  children: "Search specs \u2197"
+                }
+              )
+            ] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsx(ValueSkeleton, { className: "h-4 w-full" }) })
+          ] })
+        }
+      ),
+      document.body
+    ) : null
+  ] });
+}
+function CloseGlyph({ size = 16, className }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", className, "aria-hidden": true, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+    /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+  ] });
+}
 var NAV_DISPLAY_OPTIONS = [
   { value: "menu", label: "Sub Menu" },
   { value: "tabs", label: "Tabs Only" },
@@ -1494,11 +1716,6 @@ var APP_EMAIL_CHILDREN = [
   { label: "Deliverability", icon: "activity", href: `${EMAIL_APP}/deliverability` }
 ];
 var EMAIL_V1_LEGACY = { label: "Email V1 (legacy)", icon: "clock", path: "/relationship/email/dashboard" };
-var SMS_CHILDREN = [
-  { label: "Dashboard", icon: "grid", path: "/relationship/sms-mms-blast/dashboard" },
-  { label: "Compose & Send", icon: "send", path: "/relationship/sms-mms-blast/compose-and-send" },
-  { label: "Conversations", icon: "messageSquare", path: "/relationship/sms-mms-blast/conversations" }
-];
 var CTA_CHILDREN = [
   { label: "Dashboard", icon: "grid", path: "/relationship/cta-database/dashboard" },
   { label: "Create & Edit", icon: "edit", path: "/relationship/cta-creator/create-and-edit" },
@@ -1579,6 +1796,14 @@ function standardPolitogyNav(opts) {
     href: withOrg(abs(c.path)),
     children: c.children ? leaves(c.children) : void 0
   }));
+  const appLeaves = (origin, children, modeParam) => {
+    const base2 = origin.replace(/\/+$/, "");
+    return children.map((c) => {
+      const url = c.path ? `${base2}/${c.path}` : `${base2}/`;
+      const withMode = modeParam ? `${url}${url.includes("?") ? "&" : "?"}mode=${modeParam}` : url;
+      return { label: c.label, icon: icon(c.icon), href: withOrg(withMode) };
+    });
+  };
   const buildRelationship = () => {
     const contacts = opts.contactsItem ? {
       label: "Contacts",
@@ -1607,11 +1832,17 @@ function standardPolitogyNav(opts) {
           ...leaves([EMAIL_V1_LEGACY])
         ]
       },
+      // SMS/MMS Blast IS a2p (Specs/A2P) — the standalone delivery engine
+      // shared with Campaign Mode, not a core-hosted surface (the old
+      // `/relationship/sms-mms-blast/*` core routes are dead; core no longer
+      // hosts them). Every link carries `mode=relationship` so a2p's nav
+      // resolves the Relationship tree instead of its own Campaign default
+      // (resolveActiveMode, mode-preference.ts).
       {
         label: "SMS/MMS Blast",
         icon: icon("messageSquare"),
-        href: withOrg(abs("/relationship/sms-mms-blast/dashboard")),
-        children: leaves(SMS_CHILDREN)
+        href: withOrg(`${A2P_ORIGIN}?mode=relationship`),
+        children: appLeaves(A2P_ORIGIN, APP_A2P_CHILDREN, "relationship")
       },
       // These two carry no top-level href in VRM core (parent row only toggles).
       { label: "Calls to Action", icon: icon("layout"), children: leaves(CTA_CHILDREN) },
@@ -1652,14 +1883,6 @@ function standardPolitogyNav(opts) {
       ...CAMPAIGN_FEATURE_AVAILABILITY,
       ...opts.campaignAvailability
     };
-    const appLeaves = (origin, children) => {
-      const base2 = origin.replace(/\/+$/, "");
-      return children.map((c) => ({
-        label: c.label,
-        icon: icon(c.icon),
-        href: withOrg(c.path ? `${base2}/${c.path}` : `${base2}/`)
-      }));
-    };
     const rows = [
       { label: "Dashboard", icon: icon("home"), href: withOrg(abs("/campaign/dashboard")) },
       { label: "Voter Contact", icon: icon("target"), href: withOrg(abs("/campaign/campaigns")) },
@@ -3256,6 +3479,58 @@ function watchLogout(onLogout, options = {}) {
   }
   return cleanup;
 }
+
+// src/mode-preference.ts
+var ACTIVE_MODE_COOKIE = "politogy_active_mode";
+var VALID_MODES = ["relationship", "campaign", "petition"];
+function isStandardNavMode(v) {
+  return typeof v === "string" && VALID_MODES.includes(v);
+}
+function readActiveModeCookie() {
+  if (typeof document === "undefined") return null;
+  try {
+    const m = document.cookie.match(
+      new RegExp(`(?:^|;\\s*)${ACTIVE_MODE_COOKIE}=([^;]+)`)
+    );
+    const v = m ? decodeURIComponent(m[1]) : null;
+    return isStandardNavMode(v) ? v : null;
+  } catch {
+    return null;
+  }
+}
+function writeActiveModeCookie(mode) {
+  if (typeof document === "undefined" || typeof window === "undefined") return;
+  const host = window.location.hostname;
+  const domainAttr = /(^|\.)politogyvrm\.com$/i.test(host) ? "; Domain=.politogyvrm.com" : "";
+  const secure = window.location.protocol === "https:" ? "; Secure" : "";
+  document.cookie = `${ACTIVE_MODE_COOKIE}=${encodeURIComponent(
+    mode
+  )}; Path=/; Max-Age=31536000; SameSite=Lax${domainAttr}${secure}`;
+}
+function modeFromSearch(search) {
+  if (!search) return null;
+  try {
+    const params = new URLSearchParams(search.startsWith("?") ? search.slice(1) : search);
+    return params.get("mode");
+  } catch {
+    return null;
+  }
+}
+function resolveActiveMode({
+  search,
+  modes,
+  defaultMode
+}) {
+  const fromQuery = modeFromSearch(search);
+  if (fromQuery && isStandardNavMode(fromQuery) && modes.includes(fromQuery)) {
+    return fromQuery;
+  }
+  const fromCookie = readActiveModeCookie();
+  if (fromCookie && modes.includes(fromCookie)) {
+    return fromCookie;
+  }
+  return defaultMode;
+}
 var BOOT_STAGE_TABLE = [
   { id: "s0_session", weight: 5, critical: true, waitsOn: "Politogy ID session resolution" },
   { id: "s1_org", weight: 10, critical: true, waitsOn: "Chrome API /api/chrome/me + orgs" },
@@ -3625,7 +3900,17 @@ var POLITOGY_APPS = {
   // Campaign Mode apps — each scoped to Campaign, so they render the Campaign
   // tree and a static Campaign pill. Not yet deployed; hidden from the Campaign
   // nav by CAMPAIGN_FEATURE_AVAILABILITY until their launch flips the flag.
-  a2p: { title: "A2P Messaging", origin: "https://a2p.politogyvrm.com", storagePrefix: "a2p", mode: "campaign" },
+  // Dual-mode: a2p is the SMS/MMS delivery engine for BOTH Relationship Mode
+  // and Campaign Mode (Specs/A2P). `mode: 'campaign'` stays the fallback for
+  // anything reading `meta.mode` directly; the effective mode a user sees is
+  // resolved per-visit (see `dual`, resolveActiveMode).
+  a2p: {
+    title: "A2P Messaging",
+    origin: "https://a2p.politogyvrm.com",
+    storagePrefix: "a2p",
+    mode: "campaign",
+    dual: { modes: ["relationship", "campaign"], defaultMode: "campaign" }
+  },
   phonebank: { title: "Phone Banking", origin: "https://phonebank.politogyvrm.com", storagePrefix: "phonebank", mode: "campaign" },
   canvass: { title: "Field Canvassing", origin: "https://canvass.politogyvrm.com", storagePrefix: "canvass", mode: "campaign" },
   signs: { title: "Sign Mapping", origin: "https://signs.politogyvrm.com", storagePrefix: "signs", mode: "campaign" }
@@ -3762,9 +4047,19 @@ function FrameBody({
   });
   const userMenu = core?.userMenu ?? derivedUserMenu;
   const footer = useChromeFooter(buildMeta ?? {});
-  const appMode = meta.mode;
+  const resolvedDualMode = meta.dual ? resolveActiveMode({
+    search: search ?? (typeof window !== "undefined" ? window.location.search : void 0),
+    modes: meta.dual.modes,
+    defaultMode: meta.dual.defaultMode
+  }) : void 0;
+  const appMode = resolvedDualMode ?? meta.mode;
   const derivedMode = useChromeMode(appMode ? { pinnedModeId: appMode } : void 0);
   const mode = core?.mode ?? derivedMode;
+  const coreLiveMode = app === CORE_APP ? pathname.startsWith("/campaign") ? "campaign" : pathname.startsWith("/relationship") ? "relationship" : void 0 : void 0;
+  const cookieMode = coreLiveMode ?? (meta.dual ? void 0 : meta.mode);
+  react.useEffect(() => {
+    if (cookieMode) writeActiveModeCookie(cookieMode);
+  }, [cookieMode]);
   const coreOrgs = chrome?.orgs ?? [];
   const activeCoreOrg = coreOrgs.find((o) => o.id === chrome?.orgId) ?? null;
   const navDisplay = chrome?.navDisplay ?? "both";
@@ -4137,18 +4432,71 @@ function AppDevNotes({
     }),
     [storagePrefix, identity.role]
   );
-  if (devNotes?.providedByApp) return /* @__PURE__ */ jsxRuntime.jsx(DevNotesSurface, { children });
-  return /* @__PURE__ */ jsxRuntime.jsx(devnotes.DevNotesProvider, { adapter, user, config, children: /* @__PURE__ */ jsxRuntime.jsx(DevNotesSurface, { children }) });
+  const activatedRef = react.useRef(false);
+  const activationWaitersRef = react.useRef([]);
+  const activate = react.useCallback(() => {
+    if (activatedRef.current) return;
+    activatedRef.current = true;
+    const waiters = activationWaitersRef.current;
+    activationWaitersRef.current = [];
+    waiters.forEach((resolve) => resolve());
+  }, []);
+  const waitForActivation = react.useCallback(() => {
+    if (activatedRef.current) return Promise.resolve();
+    return new Promise((resolve) => {
+      activationWaitersRef.current.push(resolve);
+    });
+  }, []);
+  const lazyAdapter = react.useMemo(() => {
+    const GATED_METHODS = [
+      "fetchTasks",
+      "fetchTaskTypes",
+      "fetchTaskLists",
+      "fetchCollaborators",
+      "fetchCapabilities",
+      "getAppLinkStatus",
+      "fetchBugReports",
+      "fetchBugReportTypes"
+    ];
+    const wrapped = { ...adapter };
+    for (const method of GATED_METHODS) {
+      const original = adapter[method].bind(adapter);
+      wrapped[method] = (...args) => waitForActivation().then(() => original(...args));
+    }
+    let idleScheduled = false;
+    const originalUnreadCounts = adapter.fetchUnreadCounts.bind(adapter);
+    wrapped.fetchUnreadCounts = () => {
+      if (idleScheduled || typeof window === "undefined") return originalUnreadCounts();
+      idleScheduled = true;
+      return new Promise((resolve, reject) => {
+        const run = () => originalUnreadCounts().then(resolve, reject);
+        const ric = window.requestIdleCallback;
+        if (ric) ric(run);
+        else setTimeout(run, 0);
+      });
+    };
+    return wrapped;
+  }, [adapter, waitForActivation]);
+  if (devNotes?.providedByApp) return /* @__PURE__ */ jsxRuntime.jsx(DevNotesSurface, { activate, children });
+  return /* @__PURE__ */ jsxRuntime.jsx(devnotes.DevNotesProvider, { adapter: lazyAdapter, user, config, children: /* @__PURE__ */ jsxRuntime.jsx(DevNotesSurface, { activate, children }) });
 }
 var DevNotesTasksContext = react.createContext({
   ready: false,
   openTasks: () => {
+  },
+  activate: () => {
   }
 });
-function DevNotesSurface({ children }) {
+function DevNotesSurface({
+  activate,
+  children
+}) {
   const [tasksOpen, setTasksOpen] = react.useState(false);
-  const openTasks = react.useCallback(() => setTasksOpen(true), []);
-  const tasksCtx = react.useMemo(() => ({ ready: true, openTasks }), [openTasks]);
+  const openTasks = react.useCallback(() => {
+    activate();
+    setTasksOpen(true);
+  }, [activate]);
+  const tasksCtx = react.useMemo(() => ({ ready: true, openTasks, activate }), [openTasks, activate]);
   return /* @__PURE__ */ jsxRuntime.jsxs(DevNotesTasksContext.Provider, { value: tasksCtx, children: [
     children,
     tasksOpen ? /* @__PURE__ */ jsxRuntime.jsx(devnotes.DevNotesTaskListModal, { open: true, onClose: () => setTasksOpen(false) }) : null,
@@ -4204,14 +4552,15 @@ function ChromeTopBarActions() {
         children: /* @__PURE__ */ jsxRuntime.jsx(ChromeDevNotesMenu, {})
       }
     ),
+    /* @__PURE__ */ jsxRuntime.jsx(SpecOverlayAction, { orgId: state.orgId }),
     /* @__PURE__ */ jsxRuntime.jsx(SupportAction, { orgId: state.orgId }),
     /* @__PURE__ */ jsxRuntime.jsx(NotificationsAction, { orgId: state.orgId })
   ] });
 }
 function ChromeDevNotesMenu() {
-  const { ready, openTasks } = react.useContext(DevNotesTasksContext);
+  const { ready, openTasks, activate } = react.useContext(DevNotesTasksContext);
   if (!ready) return null;
-  return /* @__PURE__ */ jsxRuntime.jsx(devnotes.DevNotesMenu, { position: "top-right", onViewTasks: openTasks });
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "contents" }, onPointerDownCapture: activate, onFocusCapture: activate, onKeyDownCapture: activate, children: /* @__PURE__ */ jsxRuntime.jsx(devnotes.DevNotesMenu, { position: "top-right", onViewTasks: openTasks }) });
 }
 function useIsSuperAdmin() {
   const state = useChromeState();