diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx index 86294d0..c6afbf6 100644 --- a/src/app/about/page.tsx +++ b/src/app/about/page.tsx @@ -2,21 +2,17 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline"; -import SplitAbout from "@/components/sections/about/SplitAbout"; -import SocialProofOne from "@/components/sections/socialProof/SocialProofOne"; -import ContactCenter from "@/components/sections/contact/ContactCenter"; +import TextAbout from "@/components/sections/about/TextAbout"; import FooterBaseCard from "@/components/sections/footer/FooterBaseCard"; -import { Sparkles, Award, Mail, Heart, Zap } from "lucide-react"; +import { Award } from "lucide-react"; export default function AboutPage() { const navItems = [ - { name: "Home", id: "home" }, + { name: "Home", id: "/" }, { name: "Shop", id: "shop" }, - { name: "Brands", id: "/brands" }, - { name: "New Arrivals", id: "new-arrivals" }, - { name: "Best Sellers", id: "best-sellers" }, { name: "About", id: "/about" }, { name: "Contact", id: "/contact" }, + { name: "FAQ", id: "/faq" }, ]; const footerColumns = [ @@ -25,7 +21,7 @@ export default function AboutPage() { { label: "All Products", href: "/shop" }, { label: "New Arrivals", href: "/shop" }, { label: "Best Sellers", href: "/shop" }, - { label: "Brands", href: "/brands" }, + { label: "Brands", href: "/shop" }, ], }, { @@ -39,7 +35,7 @@ export default function AboutPage() { { title: "Support", items: [ { label: "Shipping & Returns", href: "/" }, - { label: "FAQ", href: "/" }, + { label: "FAQ", href: "/faq" }, { label: "Size Guide", href: "#" }, { label: "Track Order", href: "#" }, ], @@ -81,68 +77,16 @@ export default function AboutPage() { /> -
- + -
- -
- -
- -
-
@@ -156,4 +100,4 @@ export default function AboutPage() { ); -} \ No newline at end of file +} diff --git a/src/app/admin/page.tsx b/src/app/admin/page.tsx index fa49550..488448f 100644 --- a/src/app/admin/page.tsx +++ b/src/app/admin/page.tsx @@ -1,614 +1,154 @@ "use client"; -import { useState } from "react"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline"; import FooterBaseCard from "@/components/sections/footer/FooterBaseCard"; +import { useState } from "react"; import { - Package, - Image, - Tag, - FolderOpen, - DollarSign, - Box, - ShoppingCart, - Users, - FileText, - Image as ImageIcon, Star, - Menu, - X, - Plus, - Edit, - Trash2, + CreditCard, + CheckCircle, + AlertCircle, + Download, + Filter, Search, - ChevronRight, + Plus, + Trash2, + Edit2, + Eye, + EyeOff, } from "lucide-react"; -type AdminTab = - | "products" - | "images" - | "brands" - | "categories" - | "prices" - | "stock" - | "orders" - | "customers" - | "content" - | "banners" - | "reviews"; - -interface Product { - id: string; - name: string; - brand: string; - price: number; - stock: number; - category: string; -} - -interface Order { - id: string; - customer: string; - total: number; - status: string; - date: string; -} - -interface Customer { - id: string; - name: string; - email: string; - orders: number; - spent: number; -} - -interface Review { - id: string; - product: string; - author: string; - rating: number; - text: string; -} - export default function AdminDashboard() { - const [activeTab, setActiveTab] = useState("products"); - const [sidebarOpen, setSidebarOpen] = useState(true); - const [searchTerm, setSearchTerm] = useState(""); - const navItems = [ - { name: "Dashboard", id: "dashboard" }, { name: "Home", id: "home" }, + { name: "Shop", id: "shop" }, + { name: "Brands", id: "brands" }, + { name: "New Arrivals", id: "new-arrivals" }, + { name: "Best Sellers", id: "best-sellers" }, + { name: "About", id: "about" }, + { name: "Contact", id: "contact" }, ]; const footerColumns = [ { - title: "Admin", items: [ - { label: "Dashboard", href: "/admin" }, - { label: "Analytics", href: "/admin" }, + title: "Shop", items: [ + { label: "All Products", href: "/shop" }, + { label: "New Arrivals", href: "/shop" }, + { label: "Best Sellers", href: "/shop" }, + { label: "Brands", href: "/shop" }, + ], + }, + { + title: "Company", items: [ + { label: "About Us", href: "/" }, + { label: "Contact", href: "/" }, + { label: "Blog", href: "/" }, + { label: "Careers", href: "#" }, + ], + }, + { + title: "Support", items: [ + { label: "Shipping & Returns", href: "/" }, + { label: "FAQ", href: "/" }, + { label: "Size Guide", href: "#" }, + { label: "Track Order", href: "#" }, + ], + }, + { + title: "Legal", items: [ + { label: "Privacy Policy", href: "#" }, + { label: "Terms & Conditions", href: "#" }, + { label: "Cookie Policy", href: "#" }, + { label: "Accessibility", href: "#" }, ], }, ]; - // Sample data - const products: Product[] = [ + // Review Management State + const [reviews, setReviews] = useState([ { - id: "1", name: "Air Max 90 Classic", brand: "Nike", price: 129.99, - stock: 45, - category: "Sneakers"}, - { - id: "2", name: "Box Logo Hoodie", brand: "Supreme", price: 345.0, - stock: 12, - category: "Hoodies"}, - { - id: "3", name: "Detroit Jacket", brand: "Carhartt WIP", price: 159.99, - stock: 28, - category: "Jackets"}, - ]; - - const orders: Order[] = [ - { - id: "ORD-001", customer: "John Doe", total: 299.99, - status: "Shipped", date: "2025-01-15"}, - { - id: "ORD-002", customer: "Jane Smith", total: 549.98, - status: "Processing", date: "2025-01-16"}, - { - id: "ORD-003", customer: "Bob Johnson", total: 189.99, - status: "Delivered", date: "2025-01-14"}, - ]; - - const customers: Customer[] = [ - { - id: "C-001", name: "John Doe", email: "john@example.com", orders: 5, - spent: 1299.95, + id: "rev-001", product: "Air Max 90 Classic", author: "Sarah Chen", rating: 5, + text: "Absolutely fantastic! Authentic and arrived quickly.", status: "approved", date: "2025-01-15", verified: true, }, { - id: "C-002", name: "Jane Smith", email: "jane@example.com", orders: 3, - spent: 849.99, + id: "rev-002", product: "Box Logo Hoodie", author: "Michael Torres", rating: 4, + text: "Great quality but sizing ran small. Overall satisfied.", status: "pending", date: "2025-01-14", verified: true, }, { - id: "C-003", name: "Bob Johnson", email: "bob@example.com", orders: 2, - spent: 549.98, + id: "rev-003", product: "Detroit Jacket", author: "Emma Wilson", rating: 3, + text: "Good but not as described in the listing.", status: "pending", date: "2025-01-13", verified: false, }, - ]; + ]); - const reviews: Review[] = [ + // Checkout/Payment State + const [orders, setOrders] = useState([ { - id: "R-001", product: "Air Max 90 Classic", author: "John D.", rating: 5, - text: "Amazing quality and comfort. Highly recommend!"}, + id: "ord-001", customer: "Alex Johnson", amount: "$129.99", status: "completed", method: "stripe", date: "2025-01-15", items: 2, + }, { - id: "R-002", product: "Box Logo Hoodie", author: "Jane S.", rating: 4, - text: "Great piece, shipping was fast."}, + id: "ord-002", customer: "Patricia Lee", amount: "$345.00", status: "processing", method: "paypal", date: "2025-01-14", items: 1, + }, { - id: "R-003", product: "Detroit Jacket", author: "Bob J.", rating: 5, - text: "Perfect fit and authentic. Very satisfied."}, - ]; + id: "ord-003", customer: "James Mitchell", amount: "$567.50", status: "pending", method: "apple-pay", date: "2025-01-14", items: 3, + }, + { + id: "ord-004", customer: "Lisa Rodriguez", amount: "$234.75", status: "completed", method: "google-pay", date: "2025-01-13", items: 1, + }, + ]); - const menuItems = [ - { id: "products" as AdminTab, label: "Products", icon: Package }, - { id: "images" as AdminTab, label: "Images", icon: ImageIcon }, - { id: "brands" as AdminTab, label: "Brands", icon: Tag }, - { id: "categories" as AdminTab, label: "Categories", icon: FolderOpen }, - { id: "prices" as AdminTab, label: "Prices", icon: DollarSign }, - { id: "stock" as AdminTab, label: "Stock", icon: Box }, - { id: "orders" as AdminTab, label: "Orders", icon: ShoppingCart }, - { id: "customers" as AdminTab, label: "Customers", icon: Users }, - { id: "content" as AdminTab, label: "Content", icon: FileText }, - { id: "banners" as AdminTab, label: "Banners", icon: ImageIcon }, - { id: "reviews" as AdminTab, label: "Reviews", icon: Star }, - ]; + const [activeTab, setActiveTab] = useState<"reviews" | "checkout">("reviews"); + const [searchTerm, setSearchTerm] = useState(""); - const renderContent = () => { - switch (activeTab) { - case "products": - return ( -
-
-

Products Management

- -
-
- - - - - - - - - - - - - {products.map((product) => ( - - - - - - - - - ))} - -
NameBrandPriceStockCategoryActions
{product.name}{product.brand}${product.price.toFixed(2)}{product.stock} units{product.category} - - -
-
-
- ); + // Review Management Functions + const approveReview = (id: string) => { + setReviews( + reviews.map((r) => + r.id === id ? { ...r, status: "approved" } : r + ) + ); + }; - case "orders": - return ( -
-
-

Orders Management

-
-
- - - - - - - - - - - - - {orders.map((order) => ( - - - - - - - - - ))} - -
Order IDCustomerTotalStatusDateActions
{order.id}{order.customer}${order.total.toFixed(2)} - - {order.status} - - {order.date} - -
-
-
- ); + const rejectReview = (id: string) => { + setReviews(reviews.filter((r) => r.id !== id)); + }; - case "customers": - return ( -
-
-

Customers Management

-
-
- - - - - - - - - - - - {customers.map((customer) => ( - - - - - - - - ))} - -
NameEmailOrdersTotal SpentActions
{customer.name}{customer.email}{customer.orders}${customer.spent.toFixed(2)} - -
-
-
- ); + const deleteReview = (id: string) => { + setReviews(reviews.filter((r) => r.id !== id)); + }; - case "reviews": - return ( -
-
-

Reviews Management

-
-
- {reviews.map((review) => ( -
-
-
-

{review.product}

-
- {[...Array(review.rating)].map((_, i) => ( - - ))} -
-
-

By {review.author}

-

{review.text}

-
-
- - -
-
- ))} -
-
- ); + const filteredReviews = reviews.filter( + (review) => + review.product.toLowerCase().includes(searchTerm.toLowerCase()) || + review.author.toLowerCase().includes(searchTerm.toLowerCase()) + ); - case "images": - return ( -
-
-

Images Management

- -
-
- {[1, 2, 3, 4, 5, 6, 7, 8].map((i) => ( -
-
- -
-
-

Image {i}

-
- - -
-
-
- ))} -
-
- ); - - case "brands": - return ( -
-
-

Brands Management

- -
-
- {["Nike", "Adidas", "Supreme", "Carhartt WIP", "The North Face", "Stüssy"].map( - (brand, i) => ( -
-

{brand}

-
- - -
-
- ) - )} -
-
- ); - - case "categories": - return ( -
-
-

Categories Management

- -
-
- {["Sneakers", "Hoodies", "Jackets", "T-Shirts", "Pants", "Accessories"].map( - (category, i) => ( -
- {category} -
- - -
-
- ) - )} -
-
- ); - - case "prices": - return ( -
-
-

Prices Management

-
-
- - - - - - - - - - - - {products.map((product) => ( - - - - - - - - ))} - -
ProductCurrent PriceCostMarginActions
{product.name}${product.price.toFixed(2)}${(product.price * 0.6).toFixed(2)}40% - -
-
-
- ); - - case "stock": - return ( -
-
-

Stock Management

- -
-
- - - - - - - - - - - - {products.map((product) => ( - - - - - - - - ))} - -
ProductCurrent StockReorder LevelStatusActions
{product.name}{product.stock} units10 units - - In Stock - - - -
-
-
- ); - - case "content": - return ( -
-
-

Content Management

- -
-
- {[ - { id: 1, title: "Home Page Hero", type: "Hero Section", status: "Published" }, - { id: 2, title: "About Us", type: "Text Page", status: "Draft" }, - { id: 3, title: "FAQs", type: "FAQ Section", status: "Published" }, - ].map((content) => ( -
-
-

{content.title}

-

{content.type}

-
-
- - {content.status} - - -
-
- ))} -
-
- ); - - case "banners": - return ( -
-
-

Banners Management

- -
-
- {[1, 2, 3, 4].map((i) => ( -
-
- Banner {i} -
-
-

Banner Title {i}

-
- - -
-
-
- ))} -
-
- ); + const filteredOrders = orders.filter( + (order) => + order.customer.toLowerCase().includes(searchTerm.toLowerCase()) || + order.id.toLowerCase().includes(searchTerm.toLowerCase()) + ); + const getStatusColor = (status: string) => { + switch (status) { + case "approved": + case "completed": + return "bg-green-100 text-green-800"; + case "pending": + return "bg-yellow-100 text-yellow-800"; + case "processing": + return "bg-blue-100 text-blue-800"; default: - return ( -
-

Dashboard Overview

-
-
-

Total Products

-

1,247

-
-
-

Total Orders

-

356

-
-
-

Total Customers

-

892

-
-
-

Revenue

-

$45,230

-
-
-
- ); + return "bg-gray-100 text-gray-800"; } }; + const getPaymentMethodIcon = (method: string) => { + const icons: { [key: string]: string } = { + stripe: "💳", paypal: "🅿️", "apple-pay": "🍎", "google-pay": "🔵", "credit-debit": "💰", bnpl: "📅"}; + return icons[method] || "💳"; + }; + return ( -
- {/* Sidebar */} -
-
-

Admin Panel

+
+
+ {/* Header */} +
+

+ Admin Dashboard +

+

+ Manage reviews and checkout processes +

+
+ + {/* Tab Navigation */} +
+
- -
+ {/* Search Bar */} +
+
+ + setSearchTerm(e.target.value)} + className="w-full pl-10 pr-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" + /> +
+
- {/* Main Content */} -
-
{renderContent()}
+ {/* Review Management Tab */} + {activeTab === "reviews" && ( +
+ {/* Review Statistics */} +
+
+
+
+

Total Reviews

+

+ {reviews.length} +

+
+ +
+
+
+
+
+

Approved

+

+ {reviews.filter((r) => r.status === "approved").length} +

+
+ +
+
+
+
+
+

Pending

+

+ {reviews.filter((r) => r.status === "pending").length} +

+
+ +
+
+
+
+
+

Avg Rating

+

+ {( + reviews.reduce((sum, r) => sum + r.rating, 0) / + reviews.length + ).toFixed(1)} +

+
+ +
+
+
+ + {/* Reviews Table */} +
+
+ + + + + + + + + + + + + {filteredReviews.map((review) => ( + + + + + + + + + ))} + +
+ Product + + Author + + Rating + + Status + + Date + + Actions +
+ {review.product} + + {review.author} + {review.verified && ( + + Verified + + )} + +
+ {[...Array(review.rating)].map((_, i) => ( + + ))} +
+ 		+ + {review.status.charAt(0).toUpperCase() + + review.status.slice(1)} + + + {new Date(review.date).toLocaleDateString()} + +
+ {review.status === "pending" && ( + <> + + + + )} + {review.status === "approved" && ( + + )} +
+
+
+
+
+ )} + + {/* Checkout & Payments Tab */} + {activeTab === "checkout" && ( +
+ {/* Payment Statistics */} +
+
+
+
+

Total Orders

+

+ {orders.length} +

+
+ +
+
+
+
+
+

Completed

+

+ {orders.filter((o) => o.status === "completed").length} +

+
+ +
+
+
+
+
+

Processing

+

+ {orders.filter((o) => o.status === "processing").length} +

+
+ +
+
+
+
+
+

Total Revenue

+

+ $ + {orders + .reduce( + (sum, o) => + sum + parseFloat(o.amount.replace(/[^0-9.-]+/g, "")), + 0 + ) + .toFixed(2)} +

+
+ +
+
+
+ + {/* Payment Methods Overview */} +
+

+ Supported Payment Methods +

+
+ {[ + { name: "Stripe", icon: "💳" }, + { name: "PayPal", icon: "🅿️" }, + { name: "Apple Pay", icon: "🍎" }, + { name: "Google Pay", icon: "🔵" }, + { name: "Credit/Debit", icon: "💰" }, + { name: "Buy Now Pay Later", icon: "📅" }, + ].map((method) => ( +
+
{method.icon}
+

+ {method.name} +

+
+ ))} +
+
+ + {/* Orders Table */} +
+
+ + + + + + + + + + + + + + {filteredOrders.map((order) => ( + + + + + + + + + + ))} + +
+ Order ID + + Customer + + Amount + + Payment Method + + Status + + Items + + Date +
+ {order.id} + + {order.customer} + + {order.amount} + + + {getPaymentMethodIcon(order.method)} + + + + {order.status.charAt(0).toUpperCase() + + order.status.slice(1)} + + + {order.items} + + {new Date(order.date).toLocaleDateString()} +
+
+
+
+ )}
- -
-
-
-

Shop All Products

-

Browse our curated collection of premium fashion items

-
- -
- {/* Sidebar Filters */} - - - {/* Products Grid */} -
-
- - {filteredProducts.length} products -
-
- {filteredProducts.length} products found -
- - {filteredProducts.length > 0 ? ( -
- {filteredProducts.map((product) => ( - - - - ))} -
- ) : ( -
-

No products found matching your filters.

- -
- )} -
-
-
-
+
+ +