You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Is it possible to render the Navigation Menu on server side in nextjs? I cant figure it out. I believe it might be impossible because the navigation menu uses browser specific APIs
`"use client"
import React from "react"
import * as NavigationMenu from "@radix-ui/react-navigation-menu"
import { CaretDownIcon } from "@radix-ui/react-icons"
import "./styles.css"
import "../nav-tabs/styles.css"
import LocalizedClientLink from "@modules/common/components/localized-client-link"
import ExtendingArrowButton from "@modules/common/components/extendingArrowButton"
import NavbarTabs from "../nav-tabs"
import LogoIcon from "@modules/common/icons/logo"
import CartButton from "@modules/layout/components/cart-button"
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
Is it possible to render the Navigation Menu on server side in nextjs? I cant figure it out. I believe it might be impossible because the navigation menu uses browser specific APIs
`"use client"
import React from "react"
import * as NavigationMenu from "@radix-ui/react-navigation-menu"
import { CaretDownIcon } from "@radix-ui/react-icons"
import "./styles.css"
import "../nav-tabs/styles.css"
import LocalizedClientLink from "@modules/common/components/localized-client-link"
import ExtendingArrowButton from "@modules/common/components/extendingArrowButton"
import NavbarTabs from "../nav-tabs"
import LogoIcon from "@modules/common/icons/logo"
import CartButton from "@modules/layout/components/cart-button"
const Navbar: React.FC<{ categories: any[] }> = ({ categories }) => {
console.log("Categories fetched:", categories) // Log the fetched categories
return (
<NavigationMenu.Root className="navbar shadow-elevation-card-hover">
<NavigationMenu.List className="navbar-dropdown-tabs">
<NavigationMenu.Indicator className="NavigationMenuIndicator" />
</NavigationMenu.List>
)
}
export default Navbar
`
Beta Was this translation helpful? Give feedback.
All reactions