From 25951f05191822eab16033c89688ba6bfd32c653 Mon Sep 17 00:00:00 2001
From: smfahim25 <smfahimhossen@gmail.com>
Date: Mon, 3 Mar 2025 14:50:43 +0600
Subject: [PATCH] solved the sheet issue

---
 src/components/Header.tsx | 20 ++++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index fdc3e61..0ba769e 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -3,8 +3,15 @@ import Link from "next/link";
 import Image from "next/image";
 import { Menu } from "lucide-react";
 import { Sheet, SheetContent, SheetTitle, SheetTrigger } from "./ui/sheet";
+import { useState } from "react";
 
 export default function Header() {
+  const [isOpen, setIsOpen] = useState(false);
+
+  const handleClose = () => {
+    setIsOpen(false);
+  };
+
   return (
     <nav className="flex items-center justify-between pr-4 absolute z-50 w-full">
       <Link href="/">
@@ -56,7 +63,7 @@ export default function Header() {
 
       {/* Mobile Menu with Sheet Component */}
       <div className="md:hidden">
-        <Sheet>
+        <Sheet open={isOpen} onOpenChange={setIsOpen}>
           <SheetTrigger asChild>
             <button className="text-gray-800 focus:outline-none mt-2">
               <Menu className="w-8 h-8" />
@@ -80,7 +87,11 @@ export default function Header() {
                 </div>
                 <ul className="flex flex-col space-y-6 text-gray-800 font-medium">
                   <li>
-                    <Link href="/" className="hover:text-purple-600 text-lg">
+                    <Link
+                      href="/"
+                      className="hover:text-purple-600 text-lg"
+                      onClick={handleClose}
+                    >
                       Home
                     </Link>
                   </li>
@@ -88,6 +99,7 @@ export default function Header() {
                     <Link
                       href="/#feature"
                       className="hover:text-purple-600 text-lg"
+                      onClick={handleClose}
                     >
                       Feature
                     </Link>
@@ -96,6 +108,7 @@ export default function Header() {
                     <Link
                       href="/#pricingSection"
                       className="hover:text-purple-600 text-lg"
+                      onClick={handleClose}
                     >
                       Pricing
                     </Link>
@@ -104,6 +117,7 @@ export default function Header() {
                     <Link
                       href="/contact"
                       className="hover:text-purple-600 text-lg"
+                      onClick={handleClose}
                     >
                       Contact
                     </Link>
@@ -116,6 +130,7 @@ export default function Header() {
                   <Link
                     href="https://dashboard.planpostai.com/"
                     className="w-full"
+                    onClick={handleClose}
                   >
                     <button className="w-full font-bold px-5 py-3 border-[1px] border-[#6A47ED] text-[#6A47ED] rounded-xl hover:bg-purple-100">
                       Log in
@@ -124,6 +139,7 @@ export default function Header() {
                   <Link
                     href="https://dashboard.planpostai.com/"
                     className="w-full"
+                    onClick={handleClose}
                   >
                     <button className="w-full font-bold px-5 py-3 bg-[#6A47ED] text-white rounded-xl hover:bg-purple-700">
                       Sign Up