From 291192475449b2ba01fe0d33d5bd5451e112494b Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Wed, 20 May 2026 11:10:25 -0700
Subject: [PATCH 1/7] fix(landing-nav): scroll to top on route change in shared
 shells

---
 apps/sim/app/(landing)/blog/layout.tsx        |  2 ++
 .../(landing)/components/scroll-to-top.tsx    | 35 +++++++++++++++++++
 .../(landing)/integrations/(shell)/layout.tsx |  2 ++
 .../app/(landing)/models/(shell)/layout.tsx   |  2 ++
 4 files changed, 41 insertions(+)
 create mode 100644 apps/sim/app/(landing)/components/scroll-to-top.tsx

diff --git a/apps/sim/app/(landing)/blog/layout.tsx b/apps/sim/app/(landing)/blog/layout.tsx
index 96b81a7dca5..a82cb763a4e 100644
--- a/apps/sim/app/(landing)/blog/layout.tsx
+++ b/apps/sim/app/(landing)/blog/layout.tsx
@@ -2,6 +2,7 @@ import { getNavBlogPosts } from '@/lib/blog/registry'
 import { SITE_URL } from '@/lib/core/utils/urls'
 import Footer from '@/app/(landing)/components/footer/footer'
 import Navbar from '@/app/(landing)/components/navbar/navbar'
+import { ScrollToTop } from '@/app/(landing)/components/scroll-to-top'
 
 export default async function StudioLayout({ children }: { children: React.ReactNode }) {
   const blogPosts = await getNavBlogPosts()
@@ -29,6 +30,7 @@ export default async function StudioLayout({ children }: { children: React.React
 
   return (
     <div className='flex min-h-screen flex-col bg-[var(--landing-bg)] font-[430] font-season text-[var(--landing-text)]'>
+      <ScrollToTop />
       <script
         type='application/ld+json'
         dangerouslySetInnerHTML={{ __html: JSON.stringify(orgJsonLd) }}
diff --git a/apps/sim/app/(landing)/components/scroll-to-top.tsx b/apps/sim/app/(landing)/components/scroll-to-top.tsx
new file mode 100644
index 00000000000..40ec652b928
--- /dev/null
+++ b/apps/sim/app/(landing)/components/scroll-to-top.tsx
@@ -0,0 +1,35 @@
+'use client'
+
+import { useEffect, useRef } from 'react'
+import { usePathname } from 'next/navigation'
+
+/**
+ * Resets window scroll to the top on App Router pathname changes.
+ *
+ * Next.js's default scroll handling only brings the new Page element into view,
+ * which often resolves to "no scroll" inside shared layouts (see vercel/next.js#64435).
+ * Popstate-driven navigations are skipped so browser back/forward scroll restoration
+ * is preserved.
+ */
+export function ScrollToTop() {
+  const pathname = usePathname()
+  const isPopNavigationRef = useRef(false)
+
+  useEffect(() => {
+    const onPop = () => {
+      isPopNavigationRef.current = true
+    }
+    window.addEventListener('popstate', onPop)
+    return () => window.removeEventListener('popstate', onPop)
+  }, [])
+
+  useEffect(() => {
+    if (isPopNavigationRef.current) {
+      isPopNavigationRef.current = false
+      return
+    }
+    window.scrollTo(0, 0)
+  }, [pathname])
+
+  return null
+}
diff --git a/apps/sim/app/(landing)/integrations/(shell)/layout.tsx b/apps/sim/app/(landing)/integrations/(shell)/layout.tsx
index 231771091c7..c21291ff46a 100644
--- a/apps/sim/app/(landing)/integrations/(shell)/layout.tsx
+++ b/apps/sim/app/(landing)/integrations/(shell)/layout.tsx
@@ -2,6 +2,7 @@ import { getNavBlogPosts } from '@/lib/blog/registry'
 import { SITE_URL } from '@/lib/core/utils/urls'
 import Footer from '@/app/(landing)/components/footer/footer'
 import Navbar from '@/app/(landing)/components/navbar/navbar'
+import { ScrollToTop } from '@/app/(landing)/components/scroll-to-top'
 
 export default async function IntegrationsLayout({ children }: { children: React.ReactNode }) {
   const blogPosts = await getNavBlogPosts()
@@ -29,6 +30,7 @@ export default async function IntegrationsLayout({ children }: { children: React
 
   return (
     <div className='dark flex min-h-screen flex-col bg-[var(--landing-bg)] font-[430] font-season text-[var(--landing-text)]'>
+      <ScrollToTop />
       <script
         type='application/ld+json'
         dangerouslySetInnerHTML={{ __html: JSON.stringify(orgJsonLd) }}
diff --git a/apps/sim/app/(landing)/models/(shell)/layout.tsx b/apps/sim/app/(landing)/models/(shell)/layout.tsx
index 672632f70b4..87a5f42c677 100644
--- a/apps/sim/app/(landing)/models/(shell)/layout.tsx
+++ b/apps/sim/app/(landing)/models/(shell)/layout.tsx
@@ -2,6 +2,7 @@ import { getNavBlogPosts } from '@/lib/blog/registry'
 import { SITE_URL } from '@/lib/core/utils/urls'
 import Footer from '@/app/(landing)/components/footer/footer'
 import Navbar from '@/app/(landing)/components/navbar/navbar'
+import { ScrollToTop } from '@/app/(landing)/components/scroll-to-top'
 
 export default async function ModelsLayout({ children }: { children: React.ReactNode }) {
   const blogPosts = await getNavBlogPosts()
@@ -24,6 +25,7 @@ export default async function ModelsLayout({ children }: { children: React.React
 
   return (
     <div className='dark flex min-h-screen flex-col bg-[var(--landing-bg)] font-[430] font-season text-[var(--landing-text)]'>
+      <ScrollToTop />
       <script
         type='application/ld+json'
         dangerouslySetInnerHTML={{ __html: JSON.stringify(orgJsonLd) }}

From 35b29e6dd00cc328963fa8bd431f9aee1e6d128c Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Wed, 20 May 2026 11:18:27 -0700
Subject: [PATCH 2/7] fix(landing-nav): hoist popstate flag to module scope and
 skip on hash anchors

---
 .../(landing)/components/scroll-to-top.tsx    | 36 +++++++++++--------
 1 file changed, 22 insertions(+), 14 deletions(-)

diff --git a/apps/sim/app/(landing)/components/scroll-to-top.tsx b/apps/sim/app/(landing)/components/scroll-to-top.tsx
index 40ec652b928..7ca3a31b219 100644
--- a/apps/sim/app/(landing)/components/scroll-to-top.tsx
+++ b/apps/sim/app/(landing)/components/scroll-to-top.tsx
@@ -1,33 +1,41 @@
 'use client'
 
-import { useEffect, useRef } from 'react'
+import { useEffect } from 'react'
 import { usePathname } from 'next/navigation'
 
+/**
+ * Module-level flag so the popstate signal survives layout remounts when the
+ * user navigates across sections (e.g., blog ↔ integrations ↔ models), where
+ * the outgoing layout — and its component instances — unmount before the
+ * incoming layout's effect runs.
+ */
+let isPopNavigation = false
+
+if (typeof window !== 'undefined') {
+  window.addEventListener('popstate', () => {
+    isPopNavigation = true
+  })
+}
+
 /**
  * Resets window scroll to the top on App Router pathname changes.
  *
  * Next.js's default scroll handling only brings the new Page element into view,
  * which often resolves to "no scroll" inside shared layouts (see vercel/next.js#64435).
- * Popstate-driven navigations are skipped so browser back/forward scroll restoration
- * is preserved.
+ *
+ * Popstate-driven navigations are skipped so browser back/forward scroll
+ * restoration is preserved, and hash-anchor navigations are skipped so the
+ * browser's native anchor scroll wins.
  */
 export function ScrollToTop() {
   const pathname = usePathname()
-  const isPopNavigationRef = useRef(false)
-
-  useEffect(() => {
-    const onPop = () => {
-      isPopNavigationRef.current = true
-    }
-    window.addEventListener('popstate', onPop)
-    return () => window.removeEventListener('popstate', onPop)
-  }, [])
 
   useEffect(() => {
-    if (isPopNavigationRef.current) {
-      isPopNavigationRef.current = false
+    if (isPopNavigation) {
+      isPopNavigation = false
       return
     }
+    if (window.location.hash) return
     window.scrollTo(0, 0)
   }, [pathname])
 

From 2ecfa5118210c87ad55840ff5507efde50647865 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Wed, 20 May 2026 11:41:58 -0700
Subject: [PATCH 3/7] fix(landing-nav): use popstate timestamp window so flag
 self-expires

---
 .../(landing)/components/scroll-to-top.tsx    | 28 ++++++++++---------
 1 file changed, 15 insertions(+), 13 deletions(-)

diff --git a/apps/sim/app/(landing)/components/scroll-to-top.tsx b/apps/sim/app/(landing)/components/scroll-to-top.tsx
index 7ca3a31b219..7264b52a485 100644
--- a/apps/sim/app/(landing)/components/scroll-to-top.tsx
+++ b/apps/sim/app/(landing)/components/scroll-to-top.tsx
@@ -4,16 +4,21 @@ import { useEffect } from 'react'
 import { usePathname } from 'next/navigation'
 
 /**
- * Module-level flag so the popstate signal survives layout remounts when the
- * user navigates across sections (e.g., blog ↔ integrations ↔ models), where
- * the outgoing layout — and its component instances — unmount before the
- * incoming layout's effect runs.
+ * Timestamp of the most recent popstate. Module-scoped so it survives layout
+ * remounts when navigating across sections (e.g., blog ↔ integrations ↔ models),
+ * where the outgoing layout's component instances unmount before the incoming
+ * layout's effect runs.
+ *
+ * A timestamp window (rather than a sticky boolean) self-expires the signal —
+ * a hash-only back/forward fires popstate but doesn't change `usePathname`, so
+ * a boolean would never be consumed and would poison the next real navigation.
  */
-let isPopNavigation = false
+let lastPopstateAt = 0
+const POPSTATE_WINDOW_MS = 200
 
 if (typeof window !== 'undefined') {
   window.addEventListener('popstate', () => {
-    isPopNavigation = true
+    lastPopstateAt = performance.now()
   })
 }
 
@@ -23,18 +28,15 @@ if (typeof window !== 'undefined') {
  * Next.js's default scroll handling only brings the new Page element into view,
  * which often resolves to "no scroll" inside shared layouts (see vercel/next.js#64435).
  *
- * Popstate-driven navigations are skipped so browser back/forward scroll
- * restoration is preserved, and hash-anchor navigations are skipped so the
- * browser's native anchor scroll wins.
+ * Skipped when the pathname change closely follows a popstate (preserving browser
+ * back/forward scroll restoration) or when a hash anchor is targeted (letting the
+ * browser's native anchor scroll win).
  */
 export function ScrollToTop() {
   const pathname = usePathname()
 
   useEffect(() => {
-    if (isPopNavigation) {
-      isPopNavigation = false
-      return
-    }
+    if (performance.now() - lastPopstateAt < POPSTATE_WINDOW_MS) return
     if (window.location.hash) return
     window.scrollTo(0, 0)
   }, [pathname])

From fb02c2a67289b6e2085aedb261415cc4df08ad1d Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Wed, 20 May 2026 11:50:14 -0700
Subject: [PATCH 4/7] fix(landing-nav): use -Infinity sentinel and consume
 popstate timestamp on use

---
 .../app/(landing)/components/scroll-to-top.tsx    | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/apps/sim/app/(landing)/components/scroll-to-top.tsx b/apps/sim/app/(landing)/components/scroll-to-top.tsx
index 7264b52a485..8dc91e87755 100644
--- a/apps/sim/app/(landing)/components/scroll-to-top.tsx
+++ b/apps/sim/app/(landing)/components/scroll-to-top.tsx
@@ -9,11 +9,13 @@ import { usePathname } from 'next/navigation'
  * where the outgoing layout's component instances unmount before the incoming
  * layout's effect runs.
  *
- * A timestamp window (rather than a sticky boolean) self-expires the signal —
- * a hash-only back/forward fires popstate but doesn't change `usePathname`, so
- * a boolean would never be consumed and would poison the next real navigation.
+ * Initialized to `-Infinity` so initial mounts don't mimic a recent popstate.
+ * Consumed on first use (reset back to `-Infinity`) so a real link navigation
+ * immediately after Back isn't swallowed. The timestamp window provides a
+ * safety net for popstates that never trigger a pathname effect (e.g.,
+ * hash-only back/forward), letting the signal self-expire.
  */
-let lastPopstateAt = 0
+let lastPopstateAt = Number.NEGATIVE_INFINITY
 const POPSTATE_WINDOW_MS = 200
 
 if (typeof window !== 'undefined') {
@@ -36,7 +38,10 @@ export function ScrollToTop() {
   const pathname = usePathname()
 
   useEffect(() => {
-    if (performance.now() - lastPopstateAt < POPSTATE_WINDOW_MS) return
+    if (performance.now() - lastPopstateAt < POPSTATE_WINDOW_MS) {
+      lastPopstateAt = Number.NEGATIVE_INFINITY
+      return
+    }
     if (window.location.hash) return
     window.scrollTo(0, 0)
   }, [pathname])

From e156dba8c92e2a9e6484b1fef8979cc67e01109b Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Wed, 20 May 2026 11:56:43 -0700
Subject: [PATCH 5/7] fix(landing-nav): skip scroll on initial mount so reload
 restoration wins

---
 .../(landing)/components/scroll-to-top.tsx    | 20 ++++++++++++++++---
 1 file changed, 17 insertions(+), 3 deletions(-)

diff --git a/apps/sim/app/(landing)/components/scroll-to-top.tsx b/apps/sim/app/(landing)/components/scroll-to-top.tsx
index 8dc91e87755..00bc865f6ff 100644
--- a/apps/sim/app/(landing)/components/scroll-to-top.tsx
+++ b/apps/sim/app/(landing)/components/scroll-to-top.tsx
@@ -18,6 +18,15 @@ import { usePathname } from 'next/navigation'
 let lastPopstateAt = Number.NEGATIVE_INFINITY
 const POPSTATE_WINDOW_MS = 200
 
+/**
+ * Tracks whether any `ScrollToTop` instance has run its mount effect yet.
+ * Module-scoped so cross-section navigation (which mounts a fresh instance)
+ * still scrolls — only the very first mount on page load is treated as the
+ * initial render, letting the browser's native scroll restoration win on
+ * reload.
+ */
+let hasMounted = false
+
 if (typeof window !== 'undefined') {
   window.addEventListener('popstate', () => {
     lastPopstateAt = performance.now()
@@ -30,14 +39,19 @@ if (typeof window !== 'undefined') {
  * Next.js's default scroll handling only brings the new Page element into view,
  * which often resolves to "no scroll" inside shared layouts (see vercel/next.js#64435).
  *
- * Skipped when the pathname change closely follows a popstate (preserving browser
- * back/forward scroll restoration) or when a hash anchor is targeted (letting the
- * browser's native anchor scroll win).
+ * Skipped on the initial mount (so browser scroll restoration on reload wins),
+ * when the pathname change closely follows a popstate (preserving browser
+ * back/forward scroll restoration), and when a hash anchor is targeted (letting
+ * the browser's native anchor scroll win).
  */
 export function ScrollToTop() {
   const pathname = usePathname()
 
   useEffect(() => {
+    if (!hasMounted) {
+      hasMounted = true
+      return
+    }
     if (performance.now() - lastPopstateAt < POPSTATE_WINDOW_MS) {
       lastPopstateAt = Number.NEGATIVE_INFINITY
       return

From 1f673171802e21d529b962ba9a168c8276ccc96b Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Wed, 20 May 2026 12:14:10 -0700
Subject: [PATCH 6/7] fix(landing-nav): gate initial-mount skip on
 document.readyState

---
 .../(landing)/components/scroll-to-top.tsx    | 25 +++++++++++++------
 1 file changed, 17 insertions(+), 8 deletions(-)

diff --git a/apps/sim/app/(landing)/components/scroll-to-top.tsx b/apps/sim/app/(landing)/components/scroll-to-top.tsx
index 00bc865f6ff..f83dadbf9b5 100644
--- a/apps/sim/app/(landing)/components/scroll-to-top.tsx
+++ b/apps/sim/app/(landing)/components/scroll-to-top.tsx
@@ -18,12 +18,21 @@ import { usePathname } from 'next/navigation'
 let lastPopstateAt = Number.NEGATIVE_INFINITY
 const POPSTATE_WINDOW_MS = 200
 
+/**
+ * Captured at module evaluation time. When this module is bundled into the
+ * initial page payload (direct load / reload of a shelled route), readyState
+ * is still `loading` or `interactive`, the browser will restore scroll on
+ * reload, and we should skip the first reset. When the module is dynamically
+ * imported during a client-side navigation (e.g., user clicked from `/` into
+ * `/blog/x`), readyState is already `complete` and the first mount is a real
+ * route change that should scroll to top.
+ */
+const wasInitialPageLoad = typeof document !== 'undefined' && document.readyState !== 'complete'
+
 /**
  * Tracks whether any `ScrollToTop` instance has run its mount effect yet.
  * Module-scoped so cross-section navigation (which mounts a fresh instance)
- * still scrolls — only the very first mount on page load is treated as the
- * initial render, letting the browser's native scroll restoration win on
- * reload.
+ * doesn't re-trigger the initial-mount guard.
  */
 let hasMounted = false
 
@@ -39,10 +48,10 @@ if (typeof window !== 'undefined') {
  * Next.js's default scroll handling only brings the new Page element into view,
  * which often resolves to "no scroll" inside shared layouts (see vercel/next.js#64435).
  *
- * Skipped on the initial mount (so browser scroll restoration on reload wins),
- * when the pathname change closely follows a popstate (preserving browser
- * back/forward scroll restoration), and when a hash anchor is targeted (letting
- * the browser's native anchor scroll win).
+ * Skipped on the very first mount of an initial page load (so browser scroll
+ * restoration on reload wins), when the pathname change closely follows a
+ * popstate (preserving browser back/forward restoration), and when a hash
+ * anchor is targeted (letting the browser's native anchor scroll win).
  */
 export function ScrollToTop() {
   const pathname = usePathname()
@@ -50,7 +59,7 @@ export function ScrollToTop() {
   useEffect(() => {
     if (!hasMounted) {
       hasMounted = true
-      return
+      if (wasInitialPageLoad) return
     }
     if (performance.now() - lastPopstateAt < POPSTATE_WINDOW_MS) {
       lastPopstateAt = Number.NEGATIVE_INFINITY

From 7e926fea6865141843c36b22bd843ae44493a673 Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Wed, 20 May 2026 12:26:26 -0700
Subject: [PATCH 7/7] refactor(landing-nav): simplify scroll-to-top to
 conventional pattern

---
 .../(landing)/components/scroll-to-top.tsx    | 53 +------------------
 1 file changed, 1 insertion(+), 52 deletions(-)

diff --git a/apps/sim/app/(landing)/components/scroll-to-top.tsx b/apps/sim/app/(landing)/components/scroll-to-top.tsx
index f83dadbf9b5..781bfa944b0 100644
--- a/apps/sim/app/(landing)/components/scroll-to-top.tsx
+++ b/apps/sim/app/(landing)/components/scroll-to-top.tsx
@@ -3,68 +3,17 @@
 import { useEffect } from 'react'
 import { usePathname } from 'next/navigation'
 
-/**
- * Timestamp of the most recent popstate. Module-scoped so it survives layout
- * remounts when navigating across sections (e.g., blog ↔ integrations ↔ models),
- * where the outgoing layout's component instances unmount before the incoming
- * layout's effect runs.
- *
- * Initialized to `-Infinity` so initial mounts don't mimic a recent popstate.
- * Consumed on first use (reset back to `-Infinity`) so a real link navigation
- * immediately after Back isn't swallowed. The timestamp window provides a
- * safety net for popstates that never trigger a pathname effect (e.g.,
- * hash-only back/forward), letting the signal self-expire.
- */
-let lastPopstateAt = Number.NEGATIVE_INFINITY
-const POPSTATE_WINDOW_MS = 200
-
-/**
- * Captured at module evaluation time. When this module is bundled into the
- * initial page payload (direct load / reload of a shelled route), readyState
- * is still `loading` or `interactive`, the browser will restore scroll on
- * reload, and we should skip the first reset. When the module is dynamically
- * imported during a client-side navigation (e.g., user clicked from `/` into
- * `/blog/x`), readyState is already `complete` and the first mount is a real
- * route change that should scroll to top.
- */
-const wasInitialPageLoad = typeof document !== 'undefined' && document.readyState !== 'complete'
-
-/**
- * Tracks whether any `ScrollToTop` instance has run its mount effect yet.
- * Module-scoped so cross-section navigation (which mounts a fresh instance)
- * doesn't re-trigger the initial-mount guard.
- */
-let hasMounted = false
-
-if (typeof window !== 'undefined') {
-  window.addEventListener('popstate', () => {
-    lastPopstateAt = performance.now()
-  })
-}
-
 /**
  * Resets window scroll to the top on App Router pathname changes.
  *
  * Next.js's default scroll handling only brings the new Page element into view,
  * which often resolves to "no scroll" inside shared layouts (see vercel/next.js#64435).
- *
- * Skipped on the very first mount of an initial page load (so browser scroll
- * restoration on reload wins), when the pathname change closely follows a
- * popstate (preserving browser back/forward restoration), and when a hash
- * anchor is targeted (letting the browser's native anchor scroll win).
+ * Skipped when a hash anchor is targeted so the browser's native anchor scroll wins.
  */
 export function ScrollToTop() {
   const pathname = usePathname()
 
   useEffect(() => {
-    if (!hasMounted) {
-      hasMounted = true
-      if (wasInitialPageLoad) return
-    }
-    if (performance.now() - lastPopstateAt < POPSTATE_WINDOW_MS) {
-      lastPopstateAt = Number.NEGATIVE_INFINITY
-      return
-    }
     if (window.location.hash) return
     window.scrollTo(0, 0)
   }, [pathname])