Files
f082bce4-f5d3-4cbf-b3f8-ef4…/src/app/shop/page.tsx
2026-02-06 15:44:18 +00:00

120 lines
3.7 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import FooterCard from '@/components/sections/footer/FooterCard';
import { MapPin, Mail, Phone, ShoppingBag } from 'lucide-react';
export default function ShopPage() {
const products = [
{
id: '1',
name: 'Wanderlust Adventure Backpack',
price: '$89',
variant: 'Forest Green • 3 Colors',
imageSrc: '/products/backpack-1.jpg',
imageAlt: 'Adventure backpack in forest green',
isFavorited: false
},
{
id: '2',
name: 'Explorer Travel Jacket',
price: '$145',
variant: 'Navy Blue • 4 Colors',
imageSrc: '/products/jacket-1.jpg',
imageAlt: 'Travel jacket in navy blue',
isFavorited: false
},
{
id: '3',
name: 'Compass Navigation Watch',
price: '$220',
variant: 'Black Steel • 2 Colors',
imageSrc: '/products/watch-1.jpg',
imageAlt: 'Navigation watch with compass',
isFavorited: true
},
{
id: '4',
name: 'Mountain Peak Hiking Boots',
price: '$165',
variant: 'Brown Leather • 3 Colors',
imageSrc: '/products/boots-1.jpg',
imageAlt: 'Hiking boots in brown leather',
isFavorited: false
},
{
id: '5',
name: 'Summit Camera Strap',
price: '$35',
variant: 'Vintage Brown • 5 Colors',
imageSrc: '/products/strap-1.jpg',
imageAlt: 'Camera strap in vintage brown',
isFavorited: false
},
{
id: '6',
name: 'Traveler Water Bottle',
price: '$28',
variant: 'Matte Black • 4 Colors',
imageSrc: '/products/bottle-1.jpg',
imageAlt: 'Water bottle in matte black',
isFavorited: false
}
];
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="none"
cardStyle="solid"
primaryButtonStyle="shadow"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<div className="min-h-screen flex flex-col">
<NavbarLayoutFloatingInline
brandName="WanderLust"
navItems={[
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" }
]}
button={{ text: "Book Now", href: "contact" }}
/>
<main className="flex-1 pt-20">
<ProductCardFour
products={products}
title="Travel Gear Collection"
description="Discover premium travel essentials and adventure gear for your next journey"
tag="New Arrivals"
tagIcon={ShoppingBag}
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
useInvertedBackground="noInvert"
buttons={[
{ text: "View All Products", href: "/shop" },
{ text: "Filter by Category" }
]}
/>
</main>
<FooterCard
logoText="WanderLust"
copyrightText="© 2025 WanderLust Travel Agency. All rights reserved. Making dreams a destination."
socialLinks={[
{ icon: MapPin, href: "https://maps.google.com", ariaLabel: "Our Locations" },
{ icon: Mail, href: "mailto:hello@wanderlust.com", ariaLabel: "Email us" },
{ icon: Phone, href: "tel:+1234567890", ariaLabel: "Call us" }
]}
/>
</div>
</ThemeProvider>
);
}