Merge version_5 into main #10

Merged
bender merged 8 commits from version_5 into main 2026-03-08 13:16:39 +00:00
8 changed files with 816 additions and 242 deletions

View File

@@ -2,34 +2,31 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import FeatureCardThree from "@/components/sections/feature/featureCardThree/FeatureCardThree";
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
import AboutMetric from "@/components/sections/about/AboutMetric";
import ContactText from "@/components/sections/contact/ContactText";
import FooterMedia from "@/components/sections/footer/FooterMedia";
import { Zap, Star } from "lucide-react";
import { Users, Store, Package, TrendingUp } from "lucide-react";
export default function AboutPage() {
const footerColumns = [
{
title: "Platform",
items: [
title: "Platform", items: [
{ label: "For Buyers", href: "/buyer" },
{ label: "For Sellers", href: "/seller" },
{ label: "How It Works", href: "#" },
{ label: "Pricing", href: "#pricing" },
{ label: "Pricing", href: "/pricing" },
],
},
{
title: "Support",
items: [
title: "Support", items: [
{ label: "Help Center", href: "#" },
{ label: "Contact Us", href: "/contact" },
{ label: "FAQ", href: "#faq" },
{ label: "FAQ", href: "#" },
{ label: "Report Issue", href: "#" },
],
},
{
title: "Company",
items: [
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Blog", href: "#" },
{ label: "Careers", href: "#" },
@@ -57,99 +54,43 @@ export default function AboutPage() {
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Features", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "FAQ", id: "faq" },
{ name: "Testimonials", id: "/testimonials" },
{ name: "Pricing", id: "/pricing" },
]}
button={{ text: "Launch Platform", href: "/dashboard" }}
/>
</div>
<div id="features" data-section="features">
<FeatureCardThree
title="Our Core Values & Mission"
description="Built on trust, transparency, and community empowerment"
tag="About Agora"
tagIcon={Zap}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
gridVariant="three-columns-all-equal-width"
features={[
{
id: "01",
title: "Trust & Transparency",
description: "Every transaction verified, every seller authenticated, every review genuine. We believe in honest commerce.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png?_wi=2",
imageAlt: "Trust and transparency",
},
{
id: "02",
title: "Community Driven",
description: "Agora grows with its sellers and buyers. Your feedback shapes our platform and drives continuous improvement.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png?_wi=3",
imageAlt: "Community driven approach",
},
{
id: "03",
title: "Local First",
description: "Designed specifically for Tajikistan's market. Supporting local businesses, enabling local connections.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png?_wi=4",
imageAlt: "Local marketplace",
},
<div id="about" data-section="about">
<AboutMetric
title="About Agora: Transforming Tajikistan's Digital Commerce Landscape"
metrics={[
{ icon: Users, label: "Active Users", value: "50K+" },
{ icon: Store, label: "Verified Sellers", value: "2,500+" },
{ icon: Package, label: "Products Available", value: "150K+" },
{ icon: TrendingUp, label: "Monthly Growth", value: "35%" },
]}
metricsAnimation="slide-up"
useInvertedBackground={false}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSixteen
title="Seller Success Stories"
description="How businesses in Tajikistan are thriving on Agora"
tag="Real Impact"
tagIcon={Star}
textboxLayout="default"
animationType="slide-up"
<div id="contact" data-section="contact">
<ContactText
text="Join Agora today and be part of the digital revolution in Tajikistan's marketplace."
animationType="entrance-slide"
background={{ variant: "radial-gradient" }}
useInvertedBackground={false}
testimonials={[
{
id: "1",
name: "Fatima Saidova",
role: "Fashion Seller",
company: "Dushanbe Boutique",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-professional-headshot-photo-of-a-woman-1772974544460-59be7fc4.png?_wi=2",
imageAlt: "Fatima Saidova",
},
{
id: "2",
name: "Rustam Karimov",
role: "Electronics Vendor",
company: "Tech Hub Tajikistan",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-professional-headshot-photo-of-a-man-i-1772974544950-907bdea5.png?_wi=2",
imageAlt: "Rustam Karimov",
},
{
id: "3",
name: "Zarina Mirzoeva",
role: "Daily Buyer",
company: "Khujand Resident",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-professional-headshot-photo-of-a-woman-1772974544761-785ee70a.png?_wi=2",
imageAlt: "Zarina Mirzoeva",
},
]}
kpiItems={[
{ value: "50K+", label: "Active Community Members" },
{ value: "150K+", label: "Products Listed" },
{ value: "2,500+", label: "Verified Sellers" },
buttons={[
{ text: "Get Started Now", href: "/signup" },
{ text: "Contact Us", href: "/contact-form" },
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png?_wi=5"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png"
imageAlt="Agora Marketplace Community"
logoText="Agora Marketplace"
copyrightText="© 2025 Agora. All rights reserved."
@@ -158,4 +99,4 @@ export default function AboutPage() {
</div>
</ThemeProvider>
);
}
}

198
src/app/catalog/page.tsx Normal file
View File

@@ -0,0 +1,198 @@
"use client";
import { useState, useMemo } from "react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import FooterMedia from "@/components/sections/footer/FooterMedia";
import { Package, Search } from "lucide-react";
const allProducts = [
{
id: "1", name: "Premium Smartphone", price: "2,499 TJS", variant: "Black 2 Colors", category: "Electronics", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-high-quality-product-photo-of-electron-1772974544867-3f442579.png?_wi=1", imageAlt: "Premium smartphone", isFavorited: false,
},
{
id: "2", name: "Business Laptop", price: "4,999 TJS", variant: "Silver 1 Color", category: "Electronics", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-high-quality-product-photo-of-electron-1772974544867-3f442579.png?_wi=2", imageAlt: "Business laptop", isFavorited: false,
},
{
id: "3", name: "Designer Jacket", price: "899 TJS", variant: "Navy 3 Colors", category: "Fashion", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-lifestyle-product-photo-showing-qualit-1772974545127-cd2a5761.png", imageAlt: "Designer jacket", isFavorited: false,
},
{
id: "4", name: "Wireless Headphones", price: "599 TJS", variant: "Black 2 Colors", category: "Electronics", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-high-quality-product-photo-of-electron-1772974544867-3f442579.png?_wi=3", imageAlt: "Wireless headphones", isFavorited: false,
},
{
id: "5", name: "Summer Dress", price: "349 TJS", variant: "Blue 4 Colors", category: "Fashion", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-lifestyle-product-photo-showing-qualit-1772974545127-cd2a5761.png?_wi=1", imageAlt: "Summer dress", isFavorited: false,
},
{
id: "6", name: "Smart Watch", price: "1,299 TJS", variant: "Gold 3 Colors", category: "Electronics", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-high-quality-product-photo-of-electron-1772974544867-3f442579.png?_wi=4", imageAlt: "Smart watch", isFavorited: false,
},
{
id: "7", name: "Leather Handbag", price: "1,499 TJS", variant: "Brown 2 Colors", category: "Fashion", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-lifestyle-product-photo-showing-qualit-1772974545127-cd2a5761.png?_wi=2", imageAlt: "Leather handbag", isFavorited: false,
},
{
id: "8", name: "Portable Speaker", price: "399 TJS", variant: "Red 5 Colors", category: "Electronics", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-high-quality-product-photo-of-electron-1772974544867-3f442579.png?_wi=5", imageAlt: "Portable speaker", isFavorited: false,
},
];
export default function CatalogPage() {
const [searchQuery, setSearchQuery] = useState("");
const [selectedCategory, setSelectedCategory] = useState<string | null>(null);
const categories = Array.from(new Set(allProducts.map((p) => p.category)));
const filteredProducts = useMemo(() => {
return allProducts.filter((product) => {
const matchesSearch = product.name
.toLowerCase()
.includes(searchQuery.toLowerCase());
const matchesCategory = !selectedCategory || product.category === selectedCategory;
return matchesSearch && matchesCategory;
});
}, [searchQuery, selectedCategory]);
const footerColumns = [
{
title: "Platform", items: [
{ label: "For Buyers", href: "/buyer" },
{ label: "For Sellers", href: "/seller" },
{ label: "How It Works", href: "#" },
{ label: "Pricing", href: "#pricing" },
],
},
{
title: "Support", items: [
{ label: "Help Center", href: "#" },
{ label: "Contact Us", href: "/contact" },
{ label: "FAQ", href: "#faq" },
{ label: "Report Issue", href: "#" },
],
},
{
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Blog", href: "#" },
{ label: "Careers", href: "#" },
{ label: "Press", href: "#" },
],
},
];
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="small"
sizing="large"
background="none"
cardStyle="subtle-shadow"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="glass"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
brandName="Agora"
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Catalog", id: "/catalog" },
{ name: "Features", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "FAQ", id: "faq" },
]}
button={{ text: "Launch Platform", href: "/dashboard" }}
/>
</div>
<div className="w-full pt-24 pb-20 px-4 sm:px-6 lg:px-8">
<div className="max-w-screen-xl mx-auto">
{/* Header */}
<div className="mb-12">
<h1 className="text-4xl sm:text-5xl font-bold mb-4">Catalog</h1>
<p className="text-lg opacity-80">Browse our extensive collection of products</p>
</div>
{/* Search Bar */}
<div className="mb-8">
<div className="relative flex items-center">
<Search className="absolute left-4 w-5 h-5 opacity-50" />
<input
type="text"
placeholder="Search products..."
value={searchQuery}
onChange={(e) => setSearchQuery(e.target.value)}
className="w-full pl-12 pr-4 py-3 bg-card text-foreground placeholder-opacity-50 border border-primary-cta/20 rounded-full focus:outline-none focus:ring-2 focus:ring-primary-cta"
/>
</div>
</div>
{/* Category Filters */}
<div className="mb-10 flex flex-wrap gap-3">
<button
onClick={() => setSelectedCategory(null)}
className={`px-4 py-2 rounded-full font-medium transition-all ${
selectedCategory === null
? "bg-primary-cta text-background"
: "bg-card text-foreground border border-primary-cta/20 hover:border-primary-cta/50"
}`}
>
All Categories
</button>
{categories.map((category) => (
<button
key={category}
onClick={() => setSelectedCategory(category)}
className={`px-4 py-2 rounded-full font-medium transition-all ${
selectedCategory === category
? "bg-primary-cta text-background"
: "bg-card text-foreground border border-primary-cta/20 hover:border-primary-cta/50"
}`}
>
{category}
</button>
))}
</div>
{/* Results Count */}
<div className="mb-6">
<p className="text-sm opacity-70">
Showing {filteredProducts.length} of {allProducts.length} products
</p>
</div>
{/* Products Section */}
{filteredProducts.length > 0 ? (
<div id="products" data-section="products">
<ProductCardFour
title=""
description=""
tag="Browse"
tagIcon={Package}
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
useInvertedBackground={false}
products={filteredProducts}
/>
</div>
) : (
<div className="text-center py-12">
<p className="text-lg opacity-70">No products found. Try adjusting your search or filters.</p>
</div>
)}
</div>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png"
imageAlt="Agora Marketplace Community"
logoText="Agora Marketplace"
copyrightText="© 2025 Agora. All rights reserved."
columns={footerColumns}
/>
</div>
</ThemeProvider>
);
}

View File

@@ -1385,4 +1385,4 @@ export default function RootLayout({
</body>
</html>
);
}
}

View File

@@ -34,14 +34,14 @@ export default function HomePage() {
{ label: "For Buyers", href: "/buyer" },
{ label: "For Sellers", href: "/seller" },
{ label: "How It Works", href: "#" },
{ label: "Pricing", href: "#pricing" },
{ label: "Pricing", href: "/pricing" },
],
},
{
title: "Support", items: [
{ label: "Help Center", href: "#" },
{ label: "Contact Us", href: "/contact" },
{ label: "FAQ", href: "#faq" },
{ label: "FAQ", href: "#" },
{ label: "Report Issue", href: "#" },
],
},
@@ -74,9 +74,8 @@ export default function HomePage() {
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Features", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "FAQ", id: "faq" },
{ name: "Testimonials", id: "/testimonials" },
{ name: "Pricing", id: "/pricing" },
]}
button={{ text: "Launch Platform", href: "/dashboard" }}
/>
@@ -290,4 +289,4 @@ export default function HomePage() {
</div>
</ThemeProvider>
);
}
}

View File

@@ -5,10 +5,36 @@ import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatin
import PricingCardThree from "@/components/sections/pricing/PricingCardThree";
import ContactText from "@/components/sections/contact/ContactText";
import FooterMedia from "@/components/sections/footer/FooterMedia";
import Link from "next/link";
import { DollarSign, Sparkles } from "lucide-react";
export default function PricingPage() {
const footerColumns = [
{
title: "Platform", items: [
{ label: "For Buyers", href: "/buyer" },
{ label: "For Sellers", href: "/seller" },
{ label: "How It Works", href: "#" },
{ label: "Pricing", href: "/pricing" },
],
},
{
title: "Support", items: [
{ label: "Help Center", href: "#" },
{ label: "Contact Us", href: "/contact" },
{ label: "FAQ", href: "#" },
{ label: "Report Issue", href: "#" },
],
},
{
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Blog", href: "#" },
{ label: "Careers", href: "#" },
{ label: "Press", href: "#" },
],
},
];
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
@@ -26,16 +52,12 @@ export default function PricingPage() {
<NavbarLayoutFloatingOverlay
brandName="Agora"
navItems={[
{ name: "Home", id: "hero" },
{ name: "About", id: "about" },
{ name: "Features", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "FAQ", id: "faq" },
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Testimonials", id: "/testimonials" },
{ name: "Pricing", id: "/pricing" },
]}
button={{
text: "Launch Platform",
href: "/dashboard",
}}
button={{ text: "Launch Platform", href: "/dashboard" }}
/>
</div>
@@ -50,171 +72,56 @@ export default function PricingPage() {
useInvertedBackground={false}
plans={[
{
id: "1",
price: "Free",
name: "Starter",
buttons: [
{
text: "Get Started",
href: "/signup",
},
{
text: "Learn More",
href: "#",
},
id: "1", price: "Free", name: "Starter", buttons: [
{ text: "Get Started", href: "/signup" },
{ text: "Learn More", href: "#" },
],
features: [
"Up to 50 products",
"Basic analytics",
"Standard support",
"10% transaction fee",
],
"Up to 50 products", "Basic analytics", "Standard support", "10% transaction fee"],
},
{
id: "2",
badge: "Most Popular",
badgeIcon: Sparkles,
price: "99 TJS",
name: "Professional",
buttons: [
{
text: "Get Started",
href: "/signup",
},
{
text: "Chat Sales",
href: "#",
},
id: "2", badge: "Most Popular", badgeIcon: Sparkles,
price: "99 TJS", name: "Professional", buttons: [
{ text: "Get Started", href: "/signup" },
{ text: "Chat Sales", href: "#" },
],
features: [
"Unlimited products",
"Advanced analytics",
"Priority support",
"5% transaction fee",
"Promotional tools",
],
"Unlimited products", "Advanced analytics", "Priority support", "5% transaction fee", "Promotional tools"],
},
{
id: "3",
price: "299 TJS",
name: "Enterprise",
buttons: [
{
text: "Contact Sales",
href: "/contact",
},
{
text: "Schedule Demo",
href: "/contact",
},
id: "3", price: "299 TJS", name: "Enterprise", buttons: [
{ text: "Contact Sales", href: "/contact" },
{ text: "Schedule Demo", href: "/contact" },
],
features: [
"Everything in Professional",
"Custom analytics dashboards",
"Dedicated account manager",
"2% transaction fee",
"API access",
"White-label options",
],
"Everything in Professional", "Custom analytics dashboards", "Dedicated account manager", "2% transaction fee", "API access", "White-label options"],
},
]}
/>
</div>
<div id="contact-cta" data-section="contact-cta">
<div id="contact" data-section="contact">
<ContactText
text="Ready to transform your business? Join Agora today and reach thousands of customers or discover the products you need."
text="Find the perfect plan for your business. Our team is here to help you get started."
animationType="entrance-slide"
background={{
variant: "radial-gradient",
}}
background={{ variant: "radial-gradient" }}
useInvertedBackground={false}
buttons={[
{
text: "Get Started Now",
href: "/signup",
},
{
text: "Contact Us",
href: "/contact-form",
},
{ text: "Get Started Now", href: "/signup" },
{ text: "Contact Sales", href: "/contact-form" },
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png?_wi=8"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png"
imageAlt="Agora Marketplace Community"
logoText="Agora Marketplace"
copyrightText="© 2025 Agora. All rights reserved."
columns={[
{
title: "Platform",
items: [
{
label: "For Buyers",
href: "/buyer",
},
{
label: "For Sellers",
href: "/seller",
},
{
label: "How It Works",
href: "#",
},
{
label: "Pricing",
href: "#pricing",
},
],
},
{
title: "Support",
items: [
{
label: "Help Center",
href: "#",
},
{
label: "Contact Us",
href: "/contact",
},
{
label: "FAQ",
href: "#faq",
},
{
label: "Report Issue",
href: "#",
},
],
},
{
title: "Company",
items: [
{
label: "About Us",
href: "#about",
},
{
label: "Blog",
href: "#",
},
{
label: "Careers",
href: "#",
},
{
label: "Press",
href: "#",
},
],
},
]}
columns={footerColumns}
/>
</div>
</ThemeProvider>
);
}
}

246
src/app/register/page.tsx Normal file
View File

@@ -0,0 +1,246 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import FooterMedia from "@/components/sections/footer/FooterMedia";
import { useState } from "react";
import { Input } from "@/components/form/Input";
import ButtonTextStagger from "@/components/button/ButtonTextStagger/ButtonTextStagger";
import Link from "next/link";
import { Mail, Lock, User, Phone } from "lucide-react";
export default function RegisterPage() {
const [formData, setFormData] = useState({
fullName: "", email: "", phone: "", password: "", confirmPassword: ""});
const [errors, setErrors] = useState<Record<string, string>>({});
const [submitted, setSubmitted] = useState(false);
const handleChange = (field: string, value: string) => {
setFormData((prev) => ({ ...prev, [field]: value }));
if (errors[field]) {
setErrors((prev) => ({ ...prev, [field]: "" }));
}
};
const validateForm = () => {
const newErrors: Record<string, string> = {};
if (!formData.fullName.trim()) {
newErrors.fullName = "Full name is required";
}
if (!formData.email.trim()) {
newErrors.email = "Email is required";
} else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(formData.email)) {
newErrors.email = "Please enter a valid email";
}
if (!formData.phone.trim()) {
newErrors.phone = "Phone number is required";
}
if (!formData.password) {
newErrors.password = "Password is required";
} else if (formData.password.length < 8) {
newErrors.password = "Password must be at least 8 characters";
}
if (!formData.confirmPassword) {
newErrors.confirmPassword = "Please confirm your password";
} else if (formData.password !== formData.confirmPassword) {
newErrors.confirmPassword = "Passwords do not match";
}
setErrors(newErrors);
return Object.keys(newErrors).length === 0;
};
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
if (validateForm()) {
setSubmitted(true);
console.log("Registration submitted:", formData);
setTimeout(() => {
setSubmitted(false);
}, 3000);
}
};
const footerColumns = [
{
title: "Platform", items: [
{ label: "For Buyers", href: "/buyer" },
{ label: "For Sellers", href: "/seller" },
{ label: "How It Works", href: "#" },
{ label: "Pricing", href: "#pricing" },
],
},
{
title: "Support", items: [
{ label: "Help Center", href: "#" },
{ label: "Contact Us", href: "/contact" },
{ label: "FAQ", href: "#faq" },
{ label: "Report Issue", href: "#" },
],
},
{
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Blog", href: "#" },
{ label: "Careers", href: "#" },
{ label: "Press", href: "#" },
],
},
];
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="small"
sizing="large"
background="none"
cardStyle="subtle-shadow"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="glass"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
brandName="Agora"
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Features", id: "features" },
{ name: "Pricing", id: "pricing" },
{ name: "FAQ", id: "faq" },
{ name: "Register", id: "/register" },
]}
button={{ text: "Launch Platform", href: "/dashboard" }}
/>
</div>
<div className="min-h-[calc(100vh-200px)] flex items-center justify-center py-20 px-4">
<div className="w-full max-w-md">
<div className="bg-card rounded-lg p-8 shadow-lg">
<h1 className="text-3xl font-bold mb-2 text-center">Create Account</h1>
<p className="text-center text-foreground/70 mb-8">
Join Agora marketplace today
</p>
{submitted && (
<div className="mb-6 p-4 bg-green-100 text-green-800 rounded-lg text-center">
Registration submitted successfully!
</div>
)}
<form onSubmit={handleSubmit} className="space-y-4">
<div>
<label className="block text-sm font-medium mb-2">
Full Name
</label>
<Input
type="text"
placeholder="Enter your full name"
value={formData.fullName}
onChange={(value) => handleChange("fullName", value)}
required
/>
{errors.fullName && (
<p className="text-red-500 text-xs mt-1">{errors.fullName}</p>
)}
</div>
<div>
<label className="block text-sm font-medium mb-2">Email</label>
<Input
type="email"
placeholder="Enter your email"
value={formData.email}
onChange={(value) => handleChange("email", value)}
required
/>
{errors.email && (
<p className="text-red-500 text-xs mt-1">{errors.email}</p>
)}
</div>
<div>
<label className="block text-sm font-medium mb-2">
Phone Number
</label>
<Input
type="tel"
placeholder="Enter your phone number"
value={formData.phone}
onChange={(value) => handleChange("phone", value)}
required
/>
{errors.phone && (
<p className="text-red-500 text-xs mt-1">{errors.phone}</p>
)}
</div>
<div>
<label className="block text-sm font-medium mb-2">
Password
</label>
<Input
type="password"
placeholder="Create a password"
value={formData.password}
onChange={(value) => handleChange("password", value)}
required
/>
{errors.password && (
<p className="text-red-500 text-xs mt-1">{errors.password}</p>
)}
</div>
<div>
<label className="block text-sm font-medium mb-2">
Confirm Password
</label>
<Input
type="password"
placeholder="Confirm your password"
value={formData.confirmPassword}
onChange={(value) => handleChange("confirmPassword", value)}
required
/>
{errors.confirmPassword && (
<p className="text-red-500 text-xs mt-1">
{errors.confirmPassword}
</p>
)}
</div>
<div className="pt-4">
<ButtonTextStagger
text="Create Account"
onClick={handleSubmit}
className="w-full py-3 text-center"
/>
</div>
</form>
<p className="text-center text-sm mt-6 text-foreground/70">
Already have an account?{" "}
<Link href="/login" className="text-primary-cta hover:underline">
Sign in
</Link>
</p>
</div>
</div>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png"
imageAlt="Agora Marketplace Community"
logoText="Agora Marketplace"
copyrightText="© 2025 Agora. All rights reserved."
columns={footerColumns}
/>
</div>
</ThemeProvider>
);
}

View File

@@ -0,0 +1,119 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import TestimonialCardSixteen from "@/components/sections/testimonial/TestimonialCardSixteen";
import ContactText from "@/components/sections/contact/ContactText";
import FooterMedia from "@/components/sections/footer/FooterMedia";
import { Star } from "lucide-react";
export default function TestimonialsPage() {
const footerColumns = [
{
title: "Platform", items: [
{ label: "For Buyers", href: "/buyer" },
{ label: "For Sellers", href: "/seller" },
{ label: "How It Works", href: "#" },
{ label: "Pricing", href: "/pricing" },
],
},
{
title: "Support", items: [
{ label: "Help Center", href: "#" },
{ label: "Contact Us", href: "/contact" },
{ label: "FAQ", href: "#" },
{ label: "Report Issue", href: "#" },
],
},
{
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Blog", href: "#" },
{ label: "Careers", href: "#" },
{ label: "Press", href: "#" },
],
},
];
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="small"
sizing="large"
background="none"
cardStyle="subtle-shadow"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="glass"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
brandName="Agora"
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Testimonials", id: "/testimonials" },
{ name: "Pricing", id: "/pricing" },
]}
button={{ text: "Launch Platform", href: "/dashboard" }}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSixteen
title="What Our Community Says"
description="Real experiences from buyers and sellers using Agora"
tag="Success Stories"
tagIcon={Star}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
testimonials={[
{
id: "1", name: "Fatima Saidova", role: "Fashion Seller", company: "Dushanbe Boutique", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-professional-headshot-photo-of-a-woman-1772974544460-59be7fc4.png", imageAlt: "Fatima Saidova"},
{
id: "2", name: "Rustam Karimov", role: "Electronics Vendor", company: "Tech Hub Tajikistan", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-professional-headshot-photo-of-a-man-i-1772974544950-907bdea5.png", imageAlt: "Rustam Karimov"},
{
id: "3", name: "Zarina Mirzoeva", role: "Daily Buyer", company: "Khujand Resident", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-professional-headshot-photo-of-a-woman-1772974544761-785ee70a.png", imageAlt: "Zarina Mirzoeva"},
{
id: "4", name: "Akmal Sharifov", role: "Premium Seller", company: "Kulob Trading Co.", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-professional-headshot-photo-of-a-man-i-1772974544711-3a9132ff.png", imageAlt: "Akmal Sharifov"},
]}
kpiItems={[
{ value: "98%", label: "Satisfaction Rate" },
{ value: "50K+", label: "Active Users" },
{ value: "2,500+", label: "Trusted Sellers" },
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactText
text="Ready to share your Agora success story? Join thousands of satisfied buyers and sellers."
animationType="entrance-slide"
background={{ variant: "radial-gradient" }}
useInvertedBackground={false}
buttons={[
{ text: "Get Started Now", href: "/signup" },
{ text: "Contact Us", href: "/contact-form" },
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png"
imageAlt="Agora Marketplace Community"
logoText="Agora Marketplace"
copyrightText="© 2025 Agora. All rights reserved."
columns={footerColumns}
/>
</div>
</ThemeProvider>
);
}

164
src/app/welcome/page.tsx Normal file
View File

@@ -0,0 +1,164 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import HeroBillboardRotatedCarousel from "@/components/sections/hero/HeroBillboardRotatedCarousel";
import FeatureCardThree from "@/components/sections/feature/featureCardThree/FeatureCardThree";
import FooterMedia from "@/components/sections/footer/FooterMedia";
import {
Zap,
ShoppingCart,
TrendingUp,
Users,
Store,
Package,
DollarSign,
Star,
CheckCircle,
} from "lucide-react";
export default function WelcomePage() {
const footerColumns = [
{
title: "Platform", items: [
{ label: "For Buyers", href: "/buyer" },
{ label: "For Sellers", href: "/seller" },
{ label: "How It Works", href: "#" },
{ label: "Pricing", href: "#pricing" },
],
},
{
title: "Support", items: [
{ label: "Help Center", href: "#" },
{ label: "Contact Us", href: "/contact" },
{ label: "FAQ", href: "#faq" },
{ label: "Report Issue", href: "#" },
],
},
{
title: "Company", items: [
{ label: "About Us", href: "/about" },
{ label: "Blog", href: "#" },
{ label: "Careers", href: "#" },
{ label: "Press", href: "#" },
],
},
];
const carouselItems = [
{
id: "1", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-modern-marketplace-dashboard-interface-1772974551757-f074afce.png", imageAlt: "Marketplace Dashboard"},
{
id: "2", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-detailed-product-search-interface-show-1772974547310-ed15e040.png?_wi=1", imageAlt: "Product Search Interface"},
{
id: "3", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-seller-dashboard-showing-product-inven-1772974548976-6f45f9da.png", imageAlt: "Seller Dashboard"},
{
id: "4", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-payment-checkout-interface-showing-mul-1772974545827-a610aa1c.png?_wi=1", imageAlt: "Payment Checkout"},
{
id: "5", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-order-tracking-interface-showing-real-1772974545297-60526892.png", imageAlt: "Order Tracking"},
{
id: "6", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png", imageAlt: "Community Illustration"},
];
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="small"
sizing="large"
background="none"
cardStyle="subtle-shadow"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="glass"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
brandName="Agora"
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Features", id: "#features" },
{ name: "Pricing", id: "pricing" },
{ name: "FAQ", id: "faq" },
{ name: "Register", id: "/register" },
]}
button={{ text: "Launch Platform", href: "/dashboard" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardRotatedCarousel
title="Welcome to Agora"
description="Experience the future of local commerce in Tajikistan with our innovative marketplace platform"
tag="Welcome"
tagIcon={ShoppingCart}
background={{ variant: "radial-gradient" }}
buttons={[
{ text: "Get Started", href: "/register" },
{ text: "Learn More", href: "/" },
]}
carouselItems={carouselItems}
autoPlay={true}
autoPlayInterval={4000}
/>
</div>
<div id="features" data-section="features">
<FeatureCardThree
title="Why Choose Agora?"
description="Discover the features that make our marketplace the best choice for Tajikistan's digital commerce"
tag="Platform Advantages"
tagIcon={Zap}
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
gridVariant="three-columns-all-equal-width"
features={[
{
id: "01", title: "Secure & Trusted", description:
"Verified sellers and buyers with secure payment gateways and buyer protection guarantee", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-payment-checkout-interface-showing-mul-1772974545827-a610aa1c.png?_wi=1", imageAlt: "Secure Payments"},
{
id: "02", title: "Local First", description:
"Supporting Tajikistan's local economy with easy buying and selling for everyone", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png", imageAlt: "Local Community"},
{
id: "03", title: "Easy to Use", description:
"Intuitive interface available in Tajik, Russian, and English for seamless experience", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-detailed-product-search-interface-show-1772974547310-ed15e040.png?_wi=1", imageAlt: "User Interface"},
{
id: "04", title: "Real-Time Updates", description:
"Instant notifications for orders, messages, and transactions keeping you always informed", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-order-tracking-interface-showing-real-1772974545297-60526892.png", imageAlt: "Real-time Tracking"},
{
id: "05", title: "Seller Tools", description:
"Powerful analytics and management tools to help sellers grow their business effectively", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-seller-dashboard-showing-product-inven-1772974548976-6f45f9da.png", imageAlt: "Seller Tools"},
{
id: "06", title: "Community Support", description:
"24/7 customer support and active community to help with any questions or issues", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/a-modern-marketplace-dashboard-interface-1772974551757-f074afce.png", imageAlt: "Community Support"},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AfBvzLipXWZDam6ggyuaVWEFRP/an-illustration-representing-digital-mar-1772974545983-08d3526b.png"
imageAlt="Agora Marketplace Community"
logoText="Agora Marketplace"
copyrightText="© 2025 Agora. All rights reserved."
columns={footerColumns}
/>
</div>
</ThemeProvider>
);
}