@the-portland-company/shell 0.99.1 → 0.100.0

package/CHANGELOG.md

@@ -1,3 +1,12 @@
+## 0.100.0
+
+New pages open at the top (Ben 2026-11-08, clicked "Save as written" and "Go, all Modes" in the scroll-to-top session box; Reference/UI-Platform → URL state → "Scroll position"). Ben: "when clicking from one tab to another … the next page starts out slightly scrolled down. I need every new page to start fully scrolled at the top."
+
+- **Cause.** Next's App Router only scrolls when the new page's top edge is off screen, so a page scrolled down a little kept that offset. And most pages and tabs switch by query parameter (`?page=…&tab=…`) on the same path, which nothing reset.
+- **Fix.** `NavAppShell` (so every app on `PolitogyAppFrame`) now scrolls the window to the top, instantly, when the URL moves to a new page: a different path, or a different `mode`, `page` or `tab`. Changing only `section`, `org_id` or a feature parameter (filters, pagination) keeps the place; filling a missing default is not a new page; Back / Forward keep the browser's own position; a `#anchor` URL lands on its anchor. Uses the Navigation API where present, with a `popstate` + render-time check as the fallback, and survives apps that remount their chrome on each page (Tribes, Surveys).
+- New exports on `./native`: `useScrollToTopOnNewPage`, `isNewPage`, `pageIdentityOf`, type `PageIdentity`.
+- Tests: `__tests__/scrollToTop.test.tsx` (new).
+
 ## 0.99.1
 
 The user card says "Account Manager" for an Account Manager (bug seen live 2026-11-07: benedtl@hotmail.com, `account_manager` in "TEST Campaign A (link test)", a Linked Accounts roster membership, was shown as "Member").

package/dist/app-chrome.cjs

@@ -422,6 +422,75 @@ function SpeculationRulesScript({ items }) {
   }, [items, origin]);
   return null;
 }
+var PAGE_KEYS = ["mode", "page", "tab"];
+function pageIdentityOf(pathname, search) {
+  const params = new URLSearchParams(search.startsWith("?") ? search.slice(1) : search);
+  const path = pathname.length > 1 ? pathname.replace(/\/+$/, "") : pathname;
+  return {
+    pathname: path || "/",
+    mode: params.get("mode") || null,
+    page: params.get("page") || null,
+    tab: params.get("tab") || null
+  };
+}
+function isNewPage(prev, next) {
+  if (prev.pathname !== next.pathname) return true;
+  return PAGE_KEYS.some((k) => prev[k] !== null && next[k] !== prev[k]);
+}
+function scrollWindowToTop() {
+  if (window.scrollX === 0 && window.scrollY === 0) return;
+  try {
+    window.scrollTo({ top: 0, left: 0, behavior: "instant" });
+  } catch {
+    window.scrollTo(0, 0);
+  }
+}
+var lastIdentity = null;
+var listeners = 0;
+var detach = null;
+function currentIdentity() {
+  return pageIdentityOf(window.location.pathname, window.location.search);
+}
+function check(traverse = false) {
+  const next = currentIdentity();
+  const prev = lastIdentity;
+  lastIdentity = next;
+  if (!prev || traverse) return;
+  if (!isNewPage(prev, next)) return;
+  if (window.location.hash) return;
+  scrollWindowToTop();
+}
+function attach() {
+  const nav = window.navigation;
+  if (nav && typeof nav.addEventListener === "function") {
+    const onEntryChange = (e) => {
+      check(e.navigationType === "traverse");
+    };
+    nav.addEventListener("currententrychange", onEntryChange);
+    return () => nav.removeEventListener("currententrychange", onEntryChange);
+  }
+  const onPopState = () => check(true);
+  window.addEventListener("popstate", onPopState);
+  return () => window.removeEventListener("popstate", onPopState);
+}
+var useIsoLayoutEffect = typeof window === "undefined" ? react.useEffect : react.useLayoutEffect;
+function useScrollToTopOnNewPage() {
+  react.useEffect(() => {
+    if (listeners === 0) detach = attach();
+    listeners += 1;
+    return () => {
+      listeners -= 1;
+      if (listeners === 0) {
+        detach?.();
+        detach = null;
+      }
+    };
+  }, []);
+  useIsoLayoutEffect(() => {
+    if (lastIdentity) check();
+    else lastIdentity = currentIdentity();
+  });
+}
 
 // src/native/credits.ts
 var CREDIT_TYPE_ORDER = [
@@ -3463,6 +3532,7 @@ function NavAppShell({
   children
 }) {
   useCloseNavDetailsOnOutsideClick();
+  useScrollToTopOnNewPage();
   if (contentWrapper === "bare") {
     warnDeprecated(
       "contentWrapper",
@@ -3673,7 +3743,7 @@ function watchLogout(onLogout, options = {}) {
     cleanup();
     onLogout();
   };
-  const check = () => {
+  const check2 = () => {
     const at = readLogoutCookie();
     if (at !== null) fire(at);
   };
@@ -3687,15 +3757,15 @@ function watchLogout(onLogout, options = {}) {
   } catch {
     channel = null;
   }
-  const timer = window.setInterval(check, intervalMs);
-  window.addEventListener("visibilitychange", check);
-  window.addEventListener("focus", check);
-  window.addEventListener("pageshow", check);
+  const timer = window.setInterval(check2, intervalMs);
+  window.addEventListener("visibilitychange", check2);
+  window.addEventListener("focus", check2);
+  window.addEventListener("pageshow", check2);
   function cleanup() {
     window.clearInterval(timer);
-    window.removeEventListener("visibilitychange", check);
-    window.removeEventListener("focus", check);
-    window.removeEventListener("pageshow", check);
+    window.removeEventListener("visibilitychange", check2);
+    window.removeEventListener("focus", check2);
+    window.removeEventListener("pageshow", check2);
     try {
       channel?.close();
     } catch {