leadstocompany/rudarksh-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added

Browse Source
This commit is contained in:
Aritra Ghorai
2025-03-13 18:07:29 +05:30
parent 3ff5be64de
commit ef61d38753
5 changed files with 68 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
components/header/Navbar.jsx
View File

@@ -1,38 +1,42 @@
"use client"
"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"
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()
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)
setIsMounted(true);
const handleScroll = () => {
setIsScrolled(window.scrollY > 60)
}
setIsScrolled(window.scrollY > 60);
};
window.addEventListener("scroll", handleScroll)
return () => window.removeEventListener("scroll", handleScroll)
}, [])
window.addEventListener("scroll", handleScroll);
return () => window.removeEventListener("scroll", handleScroll);
}, []);
if (!isMounted) {
return null // or a loading placeholder
return null; // or a loading placeholder
}
return (
@@ -42,10 +46,20 @@ const Navbar = () => {
<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} />}
{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" />
<Image
src="/logo1.jpg"
alt="Logo"
width={56}
height={56}
className="object-contain"
/>
</Link>
</div>
@@ -66,9 +80,9 @@ const Navbar = () => {
<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"}`} />
<ShoppingBag size={20} className={`cursor-pointer `} />
</Link>
<div className={`cursor-pointer ${isScrolled ? "block" : "hidden"}`}>
<div className={`cursor-pointer `}>
{token ? (
<Link href="/accounts/profile">
<UserRound size={20} />
@@ -103,12 +117,15 @@ const Navbar = () => {
)}
</header>
<FullWidthMenu isOpen={isOpen} onClose={toggleMenu} isScrolled={isScrolled} />
<FullWidthMenu
isOpen={isOpen}
onClose={toggleMenu}
isScrolled={isScrolled}
/>
<div className="h-[104px] sm:h-[150px]"></div>
</>
)
}
export default Navbar
);
};
export default Navbar;

4
components/hero-page/HeroSix.jsx
View File

@@ -8,7 +8,7 @@ import { backendUrl } from "@/utils/axios";
const HeroSix = ({ guranteeData, data }) => {
console.log(data);
const { heading2, description2, heading9, description6 } = data | {};
const { heading2, description2, header9, description6 } = data || {};
return (
<section className="py-16 bg-gradient-to-b from-background to-muted">
<div className="container px-4 mx-auto">
@@ -29,7 +29,7 @@ const HeroSix = ({ guranteeData, data }) => {
<PremiumBannerOne
bannerImage={`${backendUrl}${data.image1?.path}`}
data={{
header2: heading9,
header2: header9,
description2: description6,
}}
/>

6
components/products/RelatedProductCards.jsx
View File

@@ -30,7 +30,7 @@ const RelatedProductCards = ({ productId }) => {
You may also like
</h1>
</div>
<div className="overflow-x-auto sm:pl-[400px] hide-navbar gap-5 flex items-center justify-center">
<div className="overflow-x-auto hide-navbar gap-5 flex items-center justify-center">
{relatedProducts.map((product) => (
<Link href={`/products/${product.id}`} key={product.id}>
<div
@@ -43,7 +43,7 @@ const RelatedProductCards = ({ productId }) => {
<div className="sm:h-[300px] h-[200px] w-[200px] sm:w-[300px] flex items-center justify-center overflow-hidden">
<Image
src={`${backendUrl}${product?.images[0]?.image}`}
alt={`Logo for ${product.title}`}
alt={`Logo for ${product.product_name}`}
width={300}
height={300}
className="w-full h-full object-cover hover:scale-125 transition-transform ease-in-out duration-300"
@@ -51,7 +51,7 @@ const RelatedProductCards = ({ productId }) => {
</div>
<div className="p-4 ">
<h3 className="text-center text-[1rem] uppercase text-gray-800">
{product.title}
{product.product_name}
</h3>
</div>
</div>

2
components/search/searchComponent.jsx
View File

@@ -130,7 +130,7 @@ const SearchComponent = ({ isScrolled }) => {
<Search size={20} />
</button>
{isExpanded && (
<div className="absolute right-0 top-12 bg-white shadow-lg w-72 p-4">
<div className="absolute right-[-10rem] top-12 bg-white shadow-lg w-72 p-4">
<SearchInput />
<Suggestions />
</div>

10
components/sliders/SliderTwo.jsx
View File

@@ -43,7 +43,7 @@ const EnhancedSlider = () => {
Best-Selling {catData.category?.category_name}
</h2>
<Link
href={`/category/${catData.category?.id}`}
href={`/collections/${catData.category?.id}`}
className="inline-flex items-center text-primary hover:text-primary/80 transition-colors"
>
<span className="text-lg font-medium">
@@ -58,20 +58,20 @@ const EnhancedSlider = () => {
opts={{
align: "start",
}}
className="w-full"
className="w-full "
>
<CarouselContent className="-ml-2 md:-ml-4">
<CarouselContent className="-ml-2 md:-ml-4 p-10">
{catData.products?.map((product, idx) => (
<CarouselItem
key={idx}
className="pl-2 md:pl-4 md:basis-1/2 lg:basis-1/3"
className="pl-2 md:pl-4 md:basis-1/2 lg:basis-1/6"
>
<Link href={`/products/${product.id}`}>
<motion.div
whileHover={{ y: -5 }}
className="group rounded-lg overflow-hidden bg-card shadow-lg transition-shadow hover:shadow-xl"
>
<div className="aspect-square relative overflow-hidden">
<div className="aspect-square relative overflow-hidden max-h-[50%]">
<Image
src={`${backendUrl}${
product.images[0]?.image || "/placeholder.jpg"