chore: setup project for production

2025-02-19 17:00:55 +05:30
commit 12caeee710
271 changed files with 16199 additions and 0 deletions
--- a/components/header/Navbar.jsx
+++ b/components/header/Navbar.jsx
@@ -0,0 +1,114 @@
+"use client"
+
+import React, { useContext, useEffect, useState } from "react"
+import { Menu, ShoppingBag, UserRound } from "lucide-react"
+import { IoMdClose } from "react-icons/io"
+import Link from "next/link"
+import { NavigationMenu, NavigationMenuList } from "@/components/ui/navigation-menu"
+import FullWidthMenu from "./FullWidthMenu"
+import MainContext from "@/app/contexts/mainContext"
+import DynamicNavbar from "../dynamic-navbar/dynamicNavbar"
+import SearchComponent from "../search/searchComponent"
+import { useCurrency } from "@/app/contexts/currencyContext"
+import CurrencySelect from "../dynamic-navbar/currencySelect"
+import Image from "next/image"
+
+const Navbar = () => {
+  const [isOpen, setIsOpen] = useState(false)
+  const [isScrolled, setIsScrolled] = useState(false)
+  const [isMounted, setIsMounted] = useState(false)
+  const { token } = useContext(MainContext)
+  const toggleMenu = () => setIsOpen(!isOpen)
+  const { selectedCurrency, setSelectedCurrency, SUPPORTED_CURRENCIES } = useCurrency()
+
+  useEffect(() => {
+    setIsMounted(true)
+    const handleScroll = () => {
+      setIsScrolled(window.scrollY > 60)
+    }
+
+    window.addEventListener("scroll", handleScroll)
+    return () => window.removeEventListener("scroll", handleScroll)
+  }, [])
+
+  if (!isMounted) {
+    return null // or a loading placeholder
+  }
+
+  return (
+    <>
+      <header className="fixed top-0 left-0 right-0 z-50 transition-all duration-200">
+        <nav className={`bg-white p-4 ${isScrolled ? "shadow-lg" : ""}`}>
+          <div className="container mx-auto flex justify-between items-center">
+            <div className="flex items-center">
+              <button onClick={toggleMenu} className="z-50">
+                {isOpen ? <IoMdClose size={44} /> : <Menu size={44} strokeWidth={1} />}
+              </button>
+              <Link href={"/"} className="flex items-center space-x-2">
+                <Image src="/logo1.jpg" alt="Logo" width={56} height={56} className="object-contain" />
+              </Link>
+            </div>
+
+            {!isOpen && (
+              <div
+                className={`hidden lg:flex items-center w-1/2 space-x-9 capitalize text-xl ${
+                  isScrolled ? "opacity-100" : "opacity-0"
+                } transition-opacity duration-200`}
+              >
+                <NavigationMenu className="text-xl">
+                  <NavigationMenuList className="text-2xl">
+                    <DynamicNavbar toggleMenu={toggleMenu} />
+                  </NavigationMenuList>
+                </NavigationMenu>
+              </div>
+            )}
+
+            <div className="flex items-center space-x-4">
+              <SearchComponent isScrolled={isScrolled} />
+              <Link href="/pages/shopping-cart">
+                <ShoppingBag size={20} className={`cursor-pointer ${isScrolled ? "block" : "hidden"}`} />
+              </Link>
+              <div className={`cursor-pointer ${isScrolled ? "block" : "hidden"}`}>
+                {token ? (
+                  <Link href="/accounts/profile">
+                    <UserRound size={20} />
+                  </Link>
+                ) : (
+                  <Link href="/accounts/login">
+                    <button className="bg-[#c19a5b] text-white px-3 py-1 rounded hover:bg-[#b48943] text-sm">
+                      Login
+                    </button>
+                  </Link>
+                )}
+              </div>
+              <CurrencySelect
+                selectedCurrency={selectedCurrency}
+                setSelectedCurrency={setSelectedCurrency}
+                SUPPORTED_CURRENCIES={SUPPORTED_CURRENCIES}
+              />
+            </div>
+          </div>
+        </nav>
+
+        {!isOpen && (
+          <div
+            className={`sm:block hidden bg-white p-2 transition-all duration-300 ${
+              isScrolled ? "opacity-0 h-0 overflow-hidden" : "opacity-100"
+            }`}
+          >
+            <div className="container mx-auto flex justify-center items-center space-x-16">
+              <DynamicNavbar toggleMenu={toggleMenu} />
+            </div>
+          </div>
+        )}
+      </header>
+
+      <FullWidthMenu isOpen={isOpen} onClose={toggleMenu} isScrolled={isScrolled} />
+
+      <div className="h-[104px] sm:h-[150px]"></div>
+    </>
+  )
+}
+
+export default Navbar
+