fix(landing): handle runtime env race on error-page renders

waleedlatif1 · waleedlatif1 · commit 7dfbe69654f0 · 2026-04-21T12:15:42.000-07:00
React skips SSR on unhandled server errors and re-renders on the client (see vercel/next.js#63980, #82456). Root-layout scripts — including the runtime env script that populates window.__ENV — are inserted but not executed on that client re-render, so any client module that reads env at module evaluation crashes the render into a blank "Application error" overlay instead of rendering the styled 404. This replaces the earlier PublicEnvScript tweak with the architectural fix: - auth-client.ts: fall back to window.location.origin when getBaseUrl() throws on the client. Auth endpoints are same-origin, so this is the correct baseURL on the client. Server-side we still throw on genuine misconfig. - loading.tsx under /models/[provider], /models/[provider]/[model], and /integrations/[slug]: establishes a Suspense boundary below the root layout so a page-level notFound() no longer invalidates the layout's SSR output (the fix endorsed by Next.js maintainers in #63980). - layout.tsx: revert disableNextScript — the research showed this doesn't actually fix error-page renders. The real fix is above.
diff --git a/apps/sim/app/(landing)/integrations/[slug]/loading.tsx b/apps/sim/app/(landing)/integrations/[slug]/loading.tsx
@@ -0,0 +1,3 @@
+export default function IntegrationDetailLoading() {
+  return <div className='min-h-[60vh]' aria-hidden />
+}
diff --git a/apps/sim/app/(landing)/models/[provider]/[model]/loading.tsx b/apps/sim/app/(landing)/models/[provider]/[model]/loading.tsx
@@ -0,0 +1,3 @@
+export default function ModelDetailLoading() {
+  return <div className='min-h-[60vh]' aria-hidden />
+}
diff --git a/apps/sim/app/(landing)/models/[provider]/loading.tsx b/apps/sim/app/(landing)/models/[provider]/loading.tsx
@@ -0,0 +1,3 @@
+export default function ModelProviderLoading() {
+  return <div className='min-h-[60vh]' aria-hidden />
+}
diff --git a/apps/sim/app/layout.tsx b/apps/sim/app/layout.tsx
@@ -239,7 +239,7 @@ j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
           </>
         )}
 
-        <PublicEnvScript disableNextScript />
+        <PublicEnvScript />
       </head>
       <body className={`${season.variable} font-season`} suppressHydrationWarning>
         {/* Google Tag Manager (noscript) — hosted only */}
diff --git a/apps/sim/lib/auth/auth-client.ts b/apps/sim/lib/auth/auth-client.ts
@@ -15,8 +15,26 @@ import { isBillingEnabled, isOrganizationsEnabled } from '@/lib/core/config/feat
 import { getBaseUrl } from '@/lib/core/utils/urls'
 import { SessionContext, type SessionHookResult } from '@/app/_shell/providers/session-provider'
 
+/**
+ * On Next.js error-page renders (`<html id="__next_error__">`), scripts from the
+ * root layout — including the runtime env script that populates `window.__ENV`
+ * — are inserted but not executed by React (see vercel/next.js#63980, #82456).
+ * Calling `getBaseUrl()` here at module evaluation would then throw and cascade
+ * the error-page render into a blank "Application error" overlay. On the
+ * client, auth endpoints are same-origin, so `window.location.origin` is a
+ * correct fallback; server-side we still surface a genuine misconfig.
+ */
+function getAuthBaseUrl(): string {
+  try {
+    return getBaseUrl()
+  } catch (e) {
+    if (typeof window !== 'undefined') return window.location.origin
+    throw e
+  }
+}
+
 export const client = createAuthClient({
-  baseURL: getBaseUrl(),
+  baseURL: getAuthBaseUrl(),
   plugins: [
     adminClient(),
     emailOTPClient(),

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+export default function IntegrationDetailLoading() {`
	`2`	`+ return <div className='min-h-[60vh]' aria-hidden />`
	`3`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+export default function ModelDetailLoading() {`
	`2`	`+ return <div className='min-h-[60vh]' aria-hidden />`
	`3`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+export default function ModelProviderLoading() {`
	`2`	`+ return <div className='min-h-[60vh]' aria-hidden />`
	`3`	`+}`