I need to convert component to server component
Answered
Rhinelander posted this in #help-forum
![Avatar](https://cdn.discordapp.com/embed/avatars/3.png)
RhinelanderOP
"use client";
import { useState } from "react";
import MobileMenu from "./mobile-menu";
import MenuIcon from "./menu-icon";
import Menu from "./menu";
import Overlay from "../overlay";
import { openDialog } from "@/utils/dialogFunction";
const Navigation = () => {
const [isOpen, setIsOpen] = useState(false);
const toggleOpen = () => {
setIsOpen(!isOpen);
};
return (
<>
<header className="fixed top-0 right-0 w-full h-20 border-b-[1px] z-30 bg-primary-100 backdrop-blur-md">
<div className="nav-container grid lg:grid-cols-12 grid-cols-2 lg:gap-8 gap-4 h-full">
<div className="flex items-center lg:col-span-3"><a href="/"><img src="/logo/logo-black.svg" alt="TrendFox Logo" className="max-h-14" /></a></div>
<div className="hidden lg:flex lg:items-center lg:justify-center lg:col-span-6">
<Menu />
</div>
<div className="hidden lg:flex lg:items-center lg:justify-end lg:col-span-3">
<button className="accent" onClick={() => openDialog()}>Get Free Monthly Toolkit</button>
</div>
<div className="lg:hidden relative">
<MenuIcon isOpen={isOpen} toggleOpen={toggleOpen} />
</div>
</div>
</header>
<div className="lg:hidden">
<MobileMenu isOpen={isOpen} />
<Overlay isOpen={isOpen} onClick={() => setIsOpen(false)} />
</div>
</>
);
};
export default Navigation;
Well I fucked up somewhere now I need to convert that to server component. In to Menu component i will be fetching something and it doesn't let me as it's parent is client component. Is there any quick fix or do I need to waste my day on this shit.
Answered by Anay-208 | Ping For Help
Create another use client function, and pass the data to that function
1 Reply
![Avatar](https://cdn.discordapp.com/avatars/755810867878297610/5ab9ece60bc14c554a7376a599d3deb3.webp?size=256)
Anay-208 | Ping For Help
Create another use client function, and pass the data to that function
Answer