Merge version_1 into main #2
@@ -1,11 +1,11 @@
|
||||
use client";
|
||||
"use client";
|
||||
|
||||
import ReactLenis from "lenis/react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import { useBlogPosts } from "@/hooks/useBlogPosts";
|
||||
import Link from 'next/link';
|
||||
|
||||
export default function BlogPage() {
|
||||
const { posts, isLoading } = useBlogPosts();
|
||||
@@ -23,71 +23,69 @@ export default function BlogPage() {
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
brandName="Dobry Khlib"
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
button={{ text: "Order Now", href: "#products" }}
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
brandName="Dobry Khlib"
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About", id: "/#about" },
|
||||
{ name: "Products", id: "/#products" },
|
||||
{ name: "Testimonials", id: "/#testimonials" },
|
||||
{ name: "FAQ", id: "/#faq" },
|
||||
{ name: "Contact", id: "/#contact" },
|
||||
]}
|
||||
button={{ text: "Order Now", href: "/#products" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{isLoading ? (
|
||||
<div className="w-content-width mx-auto py-20 text-center">
|
||||
<p className="text-foreground">Loading posts...</p>
|
||||
</div>
|
||||
) : (
|
||||
<div id="blog" data-section="blog">
|
||||
<BlogCardTwo
|
||||
blogs={posts}
|
||||
title="From Our Bakery"
|
||||
description="The latest news, stories, and recipes from the team at Dobry Khlib."
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
carouselMode="buttons"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{isLoading ? (
|
||||
<div className="w-content-width mx-auto py-20 text-center">
|
||||
<p className="text-foreground">Loading posts...</p>
|
||||
</div>
|
||||
) : (
|
||||
<div id="blog" data-section="blog">
|
||||
<BlogCardTwo
|
||||
blogs={posts}
|
||||
title="From Our Bakery"
|
||||
description="The latest news, stories, and recipes from the team at Dobry Khlib."
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
carouselMode="buttons"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg?_wi=3"
|
||||
imageAlt="Assortment of freshly baked Ukrainian goods"
|
||||
columns={[
|
||||
{
|
||||
title: "Bakery", items: [
|
||||
{ label: "Our Story", href: "#about" },
|
||||
{ label: "Products", href: "#products" },
|
||||
{ label: "Order Online", href: "#products" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "Contact Us", href: "#contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy Policy", href: "/privacy" },
|
||||
{ label: "Terms of Service", href: "/terms" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="Dobry Khlib"
|
||||
copyrightText="© 2024 Dobry Khlib. All rights reserved."
|
||||
onPrivacyClick={() => console.log('Privacy Policy clicked')}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg"
|
||||
imageAlt="Assortment of freshly baked Ukrainian goods"
|
||||
columns={[
|
||||
{
|
||||
title: "Bakery", items: [
|
||||
{ label: "Our Story", href: "/#about" },
|
||||
{ label: "Products", href: "/#products" },
|
||||
{ label: "Order Online", href: "/#products" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{ label: "FAQ", href: "/#faq" },
|
||||
{ label: "Contact Us", href: "/#contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy Policy", href: "/privacy" },
|
||||
{ label: "Terms of Service", href: "/terms" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="Dobry Khlib"
|
||||
copyrightText="© 2024 Dobry Khlib. All rights reserved."
|
||||
onPrivacyClick={() => console.log('Privacy Policy clicked')}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,8 +1,6 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Inter } from "next/font/google";
|
||||
import "./globals.css";
|
||||
import { ServiceWrapper } from "@/components/ServiceWrapper";
|
||||
import Tag from "@/tag/Tag";
|
||||
|
||||
const inter = Inter({
|
||||
variable: "--font-inter", subsets: ["latin"],
|
||||
@@ -31,11 +29,9 @@ export default function RootLayout({
|
||||
}>) {
|
||||
return (
|
||||
<html lang="en" suppressHydrationWarning>
|
||||
<ServiceWrapper>
|
||||
<body
|
||||
className={`${inter.variable} antialiased`}
|
||||
>
|
||||
<Tag />
|
||||
{children}
|
||||
|
||||
<script
|
||||
@@ -1405,7 +1401,6 @@ export default function RootLayout({
|
||||
}}
|
||||
/>
|
||||
</body>
|
||||
</ServiceWrapper>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -9,6 +9,7 @@ import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCar
|
||||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import Link from 'next/link';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -28,11 +29,11 @@ export default function LandingPage() {
|
||||
<NavbarLayoutFloatingOverlay
|
||||
brandName="Dobry Khlib"
|
||||
navItems={[
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Products", id: "#products" },
|
||||
{ name: "Testimonials", id: "#testimonials" },
|
||||
{ name: "FAQ", id: "#faq" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
button={{ text: "Order Now", href: "#products" }}
|
||||
/>
|
||||
@@ -44,7 +45,7 @@ export default function LandingPage() {
|
||||
description="Experience the warmth of homemade traditions with our freshly baked breads, pastries, and savory delights, crafted with love and authentic recipes."
|
||||
background={{ variant: "plain" }}
|
||||
imagePosition="right"
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg?_wi=1"
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg"
|
||||
imageAlt="Freshly baked Ukrainian bread on a rustic table"
|
||||
mediaAnimation="slide-up"
|
||||
buttons={[
|
||||
@@ -58,7 +59,7 @@ export default function LandingPage() {
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
title="Our Story: From Kyiv to Your Table"
|
||||
description='"Dobry Khlib" (Good Bread) brings the heart of Ukrainian baking to your community. We use time-honored recipes, premium local ingredients, and traditional techniques to create the flavors you remember. Every item is a piece of our heritage, baked with passion.'
|
||||
description={`"Dobry Khlib" (Good Bread) brings the heart of Ukrainian baking to your community. We use time-honored recipes, premium local ingredients, and traditional techniques to create the flavors you remember. Every item is a piece of our heritage, baked with passion.`}
|
||||
tag="About Us"
|
||||
imageSrc="https://img.b2bpic.net/free-photo/chef-holds-fresh-bread-hand-man-preparing-dough-table-kitchen-black-background-healthy-cooking-concept_639032-471.jpg"
|
||||
imageAlt="Ukrainian baker smiling in a traditional bakery"
|
||||
@@ -92,16 +93,20 @@ export default function LandingPage() {
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Olena K.", role: "Regular Customer", company: "Local Resident", rating: 5,
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/female-bakery-owner-counter-with-croissant-talking-mobile-phone_23-2148189128.jpg", imageAlt: "Olena K."},
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/female-bakery-owner-counter-with-croissant-talking-mobile-phone_23-2148189128.jpg", imageAlt: "Olena K."
|
||||
},
|
||||
{
|
||||
id: "2", name: "Mark S.", role: "Food Enthusiast", company: "Food Blogger", rating: 5,
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/person-paying-using-nfc-technology_23-2149893776.jpg", imageAlt: "Mark S."},
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/person-paying-using-nfc-technology_23-2149893776.jpg", imageAlt: "Mark S."
|
||||
},
|
||||
{
|
||||
id: "3", name: "Irina P.", role: "Community Organizer", company: "Ukrainian Cultural Center", rating: 5,
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/portrait-family-having-fun-kitchen_329181-5378.jpg", imageAlt: "Irina P."},
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/portrait-family-having-fun-kitchen_329181-5378.jpg", imageAlt: "Irina P."
|
||||
},
|
||||
{
|
||||
id: "4", name: "Dmytro H.", role: "Owner", company: "The Golden Wheat Cafe", rating: 5,
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-baker-standing-with-arms-crossed_1170-2018.jpg", imageAlt: "Dmytro H."},
|
||||
imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiling-baker-standing-with-arms-crossed_1170-2018.jpg", imageAlt: "Dmytro H."
|
||||
},
|
||||
]}
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
animationType="slide-up"
|
||||
@@ -116,13 +121,17 @@ export default function LandingPage() {
|
||||
description="Got questions about our bakery or products? We've got answers."
|
||||
faqs={[
|
||||
{
|
||||
id: "1", title: "Do you offer gluten-free options?", content: "Currently, we do not offer certified gluten-free products, but we are exploring options to do so in the future."},
|
||||
id: "1", title: "Do you offer gluten-free options?", content: "Currently, we do not offer certified gluten-free products, but we are exploring options to do so in the future."
|
||||
},
|
||||
{
|
||||
id: "2", title: "Can I place a custom order for an event?", content: "Yes, we love custom orders! Please contact us directly with your request, and we'll be happy to discuss options and availability."},
|
||||
id: "2", title: "Can I place a custom order for an event?", content: "Yes, we love custom orders! Please contact us directly with your request, and we'll be happy to discuss options and availability."
|
||||
},
|
||||
{
|
||||
id: "3", title: "What are your baking hours?", content: "Our baking typically starts very early in the morning to ensure fresh products for opening. You can find our store hours on the contact page."},
|
||||
id: "3", title: "What are your baking hours?", content: "Our baking typically starts very early in the morning to ensure fresh products for opening. You can find our store hours on the contact page."
|
||||
},
|
||||
{
|
||||
id: "4", title: "Do you deliver?", content: "We offer local delivery within a 5-mile radius. Please check our delivery section for more details and to see if your address is covered."},
|
||||
id: "4", title: "Do you deliver?", content: "We offer local delivery within a 5-mile radius. Please check our delivery section for more details and to see if your address is covered."
|
||||
},
|
||||
]}
|
||||
faqsAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
@@ -154,7 +163,7 @@ export default function LandingPage() {
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg?_wi=2"
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg"
|
||||
imageAlt="Assortment of freshly baked Ukrainian goods"
|
||||
columns={[
|
||||
{
|
||||
|
||||
@@ -2,7 +2,6 @@
|
||||
|
||||
import { Suspense, use, useCallback } from "react";
|
||||
import { useRouter } from "next/navigation";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ProductDetailCard from "@/components/ecommerce/productDetail/ProductDetailCard";
|
||||
import ProductCart from "@/components/ecommerce/cart/ProductCart";
|
||||
@@ -11,6 +10,7 @@ import { useCart } from "@/hooks/useCart";
|
||||
import { useCheckout } from "@/hooks/useCheckout";
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import Link from 'next/link';
|
||||
|
||||
interface ProductPageProps {
|
||||
params: Promise<{ id: string }>;
|
||||
@@ -19,12 +19,12 @@ interface ProductPageProps {
|
||||
export default function ProductPage({ params }: ProductPageProps) {
|
||||
return (
|
||||
<Suspense fallback={null}>
|
||||
<ProductPageContent params={params} />
|
||||
<ProductPageContentWrapper params={params} />
|
||||
</Suspense>
|
||||
);
|
||||
}
|
||||
|
||||
function ProductPageContent({ params }: ProductPageProps) {
|
||||
function ProductPageContentWrapper({ params }: ProductPageProps) {
|
||||
const { id } = use(params);
|
||||
const router = useRouter();
|
||||
|
||||
@@ -74,100 +74,52 @@ function ProductPageContent({ params }: ProductPageProps) {
|
||||
await checkout(getCheckoutItems(), { successUrl: currentUrl.toString() });
|
||||
}, [cartItems, checkout, getCheckoutItems]);
|
||||
|
||||
if (isLoading) {
|
||||
const content = () => {
|
||||
if (isLoading) {
|
||||
return (
|
||||
<main className="min-h-screen flex items-center justify-center pt-20">
|
||||
<p className="text-foreground">Loading product...</p>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
if (!product) {
|
||||
return (
|
||||
<main className="min-h-screen flex items-center justify-center pt-20">
|
||||
<div className="text-center">
|
||||
<p className="text-foreground mb-4">Product not found</p>
|
||||
<button
|
||||
onClick={() => router.push("/shop")}
|
||||
className="primary-button px-6 py-2 rounded-theme text-primary-cta-text"
|
||||
>
|
||||
Back to Shop
|
||||
</button>
|
||||
</div>
|
||||
</main>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="mediumSmall"
|
||||
sizing="largeSmall"
|
||||
background="noise"
|
||||
cardStyle="solid"
|
||||
primaryButtonStyle="double-inset"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="navbar" data-section="navbar">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "Shop", id: "/shop" }]}
|
||||
brandName="Dobry Khlib"
|
||||
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
|
||||
/>
|
||||
</div>
|
||||
<main className="min-h-screen flex items-center justify-center pt-20">
|
||||
<p className="text-foreground">Loading product...</p>
|
||||
</main>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg?_wi=6"
|
||||
imageAlt="Assortment of freshly baked Ukrainian goods"
|
||||
columns={[
|
||||
{title: "Bakery", items: [{label: "Our Story", href: "#about"}, {label: "Products", href: "#products"}, {label: "Order Online", href: "#products"}]},
|
||||
{title: "Support", items: [{label: "FAQ", href: "#faq"}, {label: "Contact Us", href: "#contact"}]},
|
||||
{title: "Legal", items: [{label: "Privacy Policy", href: "/privacy"}, {label: "Terms of Service", href: "/terms"}]}
|
||||
]}
|
||||
logoText="Dobry Khlib"
|
||||
copyrightText="© 2024 Dobry Khlib. All rights reserved."
|
||||
onPrivacyClick={() => console.log('Privacy Policy clicked')}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
|
||||
if (!product) {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="mediumSmall"
|
||||
sizing="largeSmall"
|
||||
background="noise"
|
||||
cardStyle="solid"
|
||||
primaryButtonStyle="double-inset"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="navbar" data-section="navbar">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "Shop", id: "/shop" }]}
|
||||
brandName="Dobry Khlib"
|
||||
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
|
||||
/>
|
||||
</div>
|
||||
<main className="min-h-screen flex items-center justify-center pt-20">
|
||||
<div className="text-center">
|
||||
<p className="text-foreground mb-4">Product not found</p>
|
||||
<button
|
||||
onClick={() => router.push("/shop")}
|
||||
className="primary-button px-6 py-2 rounded-theme text-primary-cta-text"
|
||||
>
|
||||
Back to Shop
|
||||
</button>
|
||||
</div>
|
||||
</main>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg?_wi=7"
|
||||
imageAlt="Assortment of freshly baked Ukrainian goods"
|
||||
columns={[
|
||||
{title: "Bakery", items: [{label: "Our Story", href: "#about"}, {label: "Products", href: "#products"}, {label: "Order Online", href: "#products"}]},
|
||||
{title: "Support", items: [{label: "FAQ", href: "#faq"}, {label: "Contact Us", href: "#contact"}]},
|
||||
{title: "Legal", items: [{label: "Privacy Policy", href: "/privacy"}, {label: "Terms of Service", href: "/terms"}]}
|
||||
]}
|
||||
logoText="Dobry Khlib"
|
||||
copyrightText="© 2024 Dobry Khlib. All rights reserved."
|
||||
onPrivacyClick={() => console.log('Privacy Policy clicked')}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
<div id="product-detail-card" data-section="product-detail-card">
|
||||
<ProductDetailCard
|
||||
layout="page"
|
||||
name={product.name}
|
||||
price={product.price}
|
||||
salePrice={meta.salePrice}
|
||||
rating={product.rating || 0}
|
||||
description={product.description}
|
||||
images={images}
|
||||
variants={variants.length > 0 ? variants : undefined}
|
||||
quantity={quantityVariant}
|
||||
ribbon={meta.ribbon}
|
||||
inventoryStatus={meta.inventoryStatus}
|
||||
inventoryQuantity={meta.inventoryQuantity}
|
||||
sku={meta.sku}
|
||||
buttons={[
|
||||
{ text: "Add To Cart", onClick: handleAddToCart },
|
||||
{ text: "Buy Now", onClick: handleBuyNow },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
@@ -183,65 +135,43 @@ function ProductPageContent({ params }: ProductPageProps) {
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="navbar" data-section="navbar">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "Shop", id: "/shop" }]}
|
||||
brandName="Dobry Khlib"
|
||||
button={{ text: "Cart", onClick: () => setCartOpen(true) }}
|
||||
/>
|
||||
</div>
|
||||
<div id="product-detail-card" data-section="product-detail-card">
|
||||
<ProductDetailCard
|
||||
layout="page"
|
||||
name={product.name}
|
||||
price={product.price}
|
||||
salePrice={meta.salePrice}
|
||||
rating={product.rating || 0}
|
||||
description={product.description}
|
||||
images={images}
|
||||
variants={variants.length > 0 ? variants : undefined}
|
||||
quantity={quantityVariant}
|
||||
ribbon={meta.ribbon}
|
||||
inventoryStatus={meta.inventoryStatus}
|
||||
inventoryQuantity={meta.inventoryQuantity}
|
||||
sku={meta.sku}
|
||||
buttons={[
|
||||
{ text: "Add To Cart", onClick: handleAddToCart },
|
||||
{ text: "Buy Now", onClick: handleBuyNow },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="product-cart" data-section="product-cart">
|
||||
<ProductCart
|
||||
isOpen={cartOpen}
|
||||
onClose={() => setCartOpen(false)}
|
||||
items={cartItems}
|
||||
onQuantityChange={updateQuantity}
|
||||
onRemove={removeItem}
|
||||
total={`$${cartTotal}`}
|
||||
buttons={[
|
||||
{
|
||||
text: isCheckoutLoading ? "Processing..." : "Check Out", onClick: handleCheckout,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg?_wi=8"
|
||||
imageAlt="Assortment of freshly baked Ukrainian goods"
|
||||
columns={[
|
||||
{title: "Bakery", items: [{label: "Our Story", href: "#about"}, {label: "Products", href: "#products"}, {label: "Order Online", href: "#products"}]},
|
||||
{title: "Support", items: [{label: "FAQ", href: "#faq"}, {label: "Contact Us", href: "#contact"}]},
|
||||
{title: "Legal", items: [{label: "Privacy Policy", href: "/privacy"}, {label: "Terms of Service", href: "/terms"}]}
|
||||
]}
|
||||
logoText="Dobry Khlib"
|
||||
copyrightText="© 2024 Dobry Khlib. All rights reserved."
|
||||
onPrivacyClick={() => console.log('Privacy Policy clicked')}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[{ name: "Home", id: "/" }]}
|
||||
brandName="Dobry Khlib"
|
||||
button={{ text: `Cart (${cartItems.length})`, onClick: () => setCartOpen(true) }}
|
||||
/>
|
||||
</div>
|
||||
{content()}
|
||||
<div id="product-cart" data-section="product-cart">
|
||||
<ProductCart
|
||||
isOpen={cartOpen}
|
||||
onClose={() => setCartOpen(false)}
|
||||
items={cartItems}
|
||||
onQuantityChange={updateQuantity}
|
||||
onRemove={removeItem}
|
||||
total={`$${cartTotal}`}
|
||||
buttons={[
|
||||
{
|
||||
text: isCheckoutLoading ? "Processing..." : "Check Out", onClick: handleCheckout,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg"
|
||||
imageAlt="Assortment of freshly baked Ukrainian goods"
|
||||
columns={[
|
||||
{title: "Bakery", items: [{label: "Our Story", href: "/#about"}, {label: "Products", href: "/#products"}, {label: "Order Online", href: "/#products"}]},
|
||||
{title: "Support", items: [{label: "FAQ", href: "/#faq"}, {label: "Contact Us", href: "/#contact"}]},
|
||||
{title: "Legal", items: [{label: "Privacy Policy", href: "/privacy"}, {label: "Terms of Service", href: "/terms"}]}
|
||||
]}
|
||||
logoText="Dobry Khlib"
|
||||
copyrightText="© 2024 Dobry Khlib. All rights reserved."
|
||||
onPrivacyClick={() => console.log('Privacy Policy clicked')}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
"use client";
|
||||
|
||||
import { Suspense } from "react";
|
||||
import ReactLenis from "lenis/react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ProductCatalog from "@/components/ecommerce/productCatalog/ProductCatalog";
|
||||
import { useProductCatalog } from "@/hooks/useProductCatalog";
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import Link from 'next/link';
|
||||
|
||||
function ShopPageContent() {
|
||||
const {
|
||||
@@ -19,6 +19,48 @@ function ShopPageContent() {
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[{ name: "Home", id: "/" }]}
|
||||
brandName="Dobry Khlib"
|
||||
button={{ text: "Cart", onClick: () => console.log("cart") }}
|
||||
/>
|
||||
</div>
|
||||
<main className="min-h-screen flex items-center justify-center pt-20">
|
||||
<p className="text-foreground">Loading products...</p>
|
||||
</main>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[{ name: "Home", id: "/" }]}
|
||||
brandName="Dobry Khlib"
|
||||
button={{ text: "Cart", onClick: () => console.log("cart") }}
|
||||
/>
|
||||
</div>
|
||||
<div id="product-catalog" data-section="product-catalog">
|
||||
<ProductCatalog
|
||||
layout="page"
|
||||
products={products}
|
||||
searchValue={search}
|
||||
onSearchChange={setSearch}
|
||||
searchPlaceholder="Search products..."
|
||||
filters={filters}
|
||||
emptyMessage="No products found"
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default function ShopPage() {
|
||||
return (
|
||||
<Suspense>
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
@@ -31,75 +73,14 @@ function ShopPageContent() {
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="navbar" data-section="navbar">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "Shop", id: "/shop" }]}
|
||||
brandName="Dobry Khlib"
|
||||
button={{ text: "Cart", onClick: () => console.log("cart") }}
|
||||
/>
|
||||
</div>
|
||||
<main className="min-h-screen flex items-center justify-center pt-20">
|
||||
<p className="text-foreground">Loading products...</p>
|
||||
</main>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg?_wi=4"
|
||||
imageAlt="Assortment of freshly baked Ukrainian goods"
|
||||
columns={[
|
||||
{title: "Bakery", items: [{label: "Our Story", href: "#about"}, {label: "Products", href: "#products"}, {label: "Order Online", href: "#products"}]},
|
||||
{title: "Support", items: [{label: "FAQ", href: "#faq"}, {label: "Contact Us", href: "#contact"}]},
|
||||
{title: "Legal", items: [{label: "Privacy Policy", href: "/privacy"}, {label: "Terms of Service", href: "/terms"}]}
|
||||
]}
|
||||
logoText="Dobry Khlib"
|
||||
copyrightText="© 2024 Dobry Khlib. All rights reserved."
|
||||
onPrivacyClick={() => console.log('Privacy Policy clicked')}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="mediumSmall"
|
||||
sizing="largeSmall"
|
||||
background="noise"
|
||||
cardStyle="solid"
|
||||
primaryButtonStyle="double-inset"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="navbar" data-section="navbar">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "Shop", id: "/shop" }]}
|
||||
brandName="Dobry Khlib"
|
||||
button={{ text: "Cart", onClick: () => console.log("cart") }}
|
||||
/>
|
||||
</div>
|
||||
<div id="product-catalog" data-section="product-catalog">
|
||||
<ProductCatalog
|
||||
layout="page"
|
||||
products={products}
|
||||
searchValue={search}
|
||||
onSearchChange={setSearch}
|
||||
searchPlaceholder="Search products..."
|
||||
filters={filters}
|
||||
emptyMessage="No products found"
|
||||
/>
|
||||
</div>
|
||||
<ShopPageContent />
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg?_wi=5"
|
||||
imageSrc="https://img.b2bpic.net/free-photo/white-cheese-bread-with-eggs_140725-3991.jpg"
|
||||
imageAlt="Assortment of freshly baked Ukrainian goods"
|
||||
columns={[
|
||||
{title: "Bakery", items: [{label: "Our Story", href: "#about"}, {label: "Products", href: "#products"}, {label: "Order Online", href: "#products"}]},
|
||||
{title: "Support", items: [{label: "FAQ", href: "#faq"}, {label: "Contact Us", href: "#contact"}]},
|
||||
{title: "Bakery", items: [{label: "Our Story", href: "/#about"}, {label: "Products", href: "/#products"}, {label: "Order Online", href: "/#products"}]},
|
||||
{title: "Support", items: [{label: "FAQ", href: "/#faq"}, {label: "Contact Us", href: "/#contact"}]},
|
||||
{title: "Legal", items: [{label: "Privacy Policy", href: "/privacy"}, {label: "Terms of Service", href: "/terms"}]}
|
||||
]}
|
||||
logoText="Dobry Khlib"
|
||||
@@ -107,15 +88,7 @@ function ShopPageContent() {
|
||||
onPrivacyClick={() => console.log('Privacy Policy clicked')}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
|
||||
export default function ShopPage() {
|
||||
return (
|
||||
<Suspense>
|
||||
<ShopPageContent />
|
||||
</ThemeProvider>
|
||||
</Suspense>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user