Skip to content

Commit 3abdafc

Browse files
committed
fix(navbar): preserve SSR HTML, drop Suspense bailout
Reading useSearchParams() forced a Suspense fallback that emitted no navbar HTML during SSR — leaving crawlers and no-JS users without nav. The 'home' query param only affects client-side link targets, so read it from window.location in an effect after hydration. Restores full SSR navbar markup.
1 parent 24c4c77 commit 3abdafc

1 file changed

Lines changed: 6 additions & 21 deletions

File tree

  • apps/sim/app/(landing)/components/navbar

apps/sim/app/(landing)/components/navbar/navbar.tsx

Lines changed: 6 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,9 @@
11
'use client'
22

3-
import {
4-
Suspense,
5-
useCallback,
6-
useContext,
7-
useEffect,
8-
useRef,
9-
useState,
10-
useSyncExternalStore,
11-
} from 'react'
3+
import { useCallback, useContext, useEffect, useRef, useState, useSyncExternalStore } from 'react'
124
import dynamic from 'next/dynamic'
135
import Image from 'next/image'
146
import Link from 'next/link'
15-
import { useSearchParams } from 'next/navigation'
167
import { GithubOutlineIcon } from '@/components/icons'
178
import { cn } from '@/lib/core/utils/cn'
189
import { SessionContext } from '@/app/_shell/providers/session-provider'
@@ -58,22 +49,16 @@ interface NavbarProps {
5849
blogPosts?: NavBlogPost[]
5950
}
6051

61-
export default function Navbar(props: NavbarProps) {
62-
return (
63-
<Suspense fallback={null}>
64-
<NavbarInner {...props} />
65-
</Suspense>
66-
)
67-
}
68-
69-
function NavbarInner({ logoOnly = false, blogPosts = [] }: NavbarProps) {
52+
export default function Navbar({ logoOnly = false, blogPosts = [] }: NavbarProps) {
7053
const brand = getBrandConfig()
71-
const searchParams = useSearchParams()
7254
const sessionCtx = useContext(SessionContext)
7355
const session = sessionCtx?.data ?? null
7456
const isSessionPending = sessionCtx?.isPending ?? true
7557
const isAuthenticated = Boolean(session?.user?.id)
76-
const isBrowsingHome = searchParams.has('home')
58+
const [isBrowsingHome, setIsBrowsingHome] = useState(false)
59+
useEffect(() => {
60+
setIsBrowsingHome(new URLSearchParams(window.location.search).has('home'))
61+
}, [])
7762
const useHomeLinks = isAuthenticated || isBrowsingHome
7863
const logoHref = useHomeLinks ? '/?home' : '/'
7964
const mounted = useSyncExternalStore(

0 commit comments

Comments
 (0)