From 428f3825ae75416c0aa766c5ee62a547569cbdb5 Mon Sep 17 00:00:00 2001 From: bender Date: Fri, 6 Mar 2026 07:03:28 +0000 Subject: [PATCH] Update src/app/page.tsx --- src/app/page.tsx | 351 +++++++++++++++++++++++------------------------ 1 file changed, 174 insertions(+), 177 deletions(-) diff --git a/src/app/page.tsx b/src/app/page.tsx index be186b5..fbb23c7 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -12,7 +12,7 @@ import FaqSplitText from "@/components/sections/faq/FaqSplitText"; import ContactSplit from "@/components/sections/contact/ContactSplit"; import FooterCard from "@/components/sections/footer/FooterCard"; import { Zap, Package, Star, Shield, Headphones, CreditCard, Check, Award, Sparkles, Heart, Trophy, Mail, Facebook, Instagram, Linkedin, Twitter, ShoppingCart } from "lucide-react"; -import { useState } from "react"; +import { useState, useEffect } from "react"; interface CartItem { id: string; @@ -23,9 +23,129 @@ interface CartItem { variant: string; } +interface ProductCategory { + id: string; + name: string; + products: any[]; +} + export default function LandingPage() { const [cart, setCart] = useState([]); const [showCart, setShowCart] = useState(false); + const [productCategories, setProductCategories] = useState([]); + const [selectedCategoryId, setSelectedCategoryId] = useState(null); + const [isLoadingCategories, setIsLoadingCategories] = useState(true); + + // All 60 products organized by category + const allProducts = [ + // Laptops & Desktops (5 items) + { id: "1", name: "Gaming Laptop Pro", price: "450000 ₸", variant: "Black RTX 4060", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=1", imageAlt: "Gaming Laptop", category: "Laptops & Desktops", isFavorited: false }, + { id: "2", name: "Desktop Workstation", price: "850000 ₸", variant: "RTX 4090 Build", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=1", imageAlt: "Workstation", category: "Laptops & Desktops", isFavorited: false }, + { id: "3", name: "Budget Gaming Laptop", price: "320000 ₸", variant: "RTX 3060", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=1", imageAlt: "Budget Laptop", category: "Laptops & Desktops", isFavorited: false }, + { id: "4", name: "Ultrabook Premium", price: "580000 ₸", variant: "13" Ultra Thin", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=1", imageAlt: "Ultrabook", category: "Laptops & Desktops", isFavorited: false }, + { id: "5", name: "Mini PC", price: "145000 ₸", variant: "Compact i7", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=2", imageAlt: "Mini PC", category: "Laptops & Desktops", isFavorited: false }, + // Peripherals - Input (8 items) + { id: "6", name: "Mechanical Keyboard RGB", price: "35000 ₸", variant: "Red Switches 4 Colors", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=2", imageAlt: "Mechanical Keyboard", category: "Peripherals - Input", isFavorited: false }, + { id: "7", name: "Wireless Gaming Mouse", price: "28000 ₸", variant: "White Optical", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=2", imageAlt: "Gaming Mouse", category: "Peripherals - Input", isFavorited: false }, + { id: "8", name: "Gaming Mousepad XL", price: "12000 ₸", variant: "Cloth Surface", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=2", imageAlt: "Mousepad", category: "Peripherals - Input", isFavorited: false }, + { id: "9", name: "Wireless Keyboard Set", price: "19000 ₸", variant: "2.4GHz USB", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=3", imageAlt: "Keyboard", category: "Peripherals - Input", isFavorited: false }, + { id: "10", name: "Keyboard Wrist Rest", price: "6500 ₸", variant: "Memory Foam", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=3", imageAlt: "Wrist Rest", category: "Peripherals - Input", isFavorited: false }, + { id: "11", name: "Gaming Mouse Pad Pro", price: "8900 ₸", variant: "Hard Surface", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=3", imageAlt: "Mouse Pad Pro", category: "Peripherals - Input", isFavorited: false }, + { id: "12", name: "Mechanical Keyboard Compact", price: "32000 ₸", variant: "75% Layout", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=3", imageAlt: "Compact Keyboard", category: "Peripherals - Input", isFavorited: false }, + { id: "13", name: "Ergonomic Mouse Vertical", price: "22000 ₸", variant: "USB Wired", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=4", imageAlt: "Vertical Mouse", category: "Peripherals - Input", isFavorited: false }, + // Displays & Monitors (7 items) + { id: "14", name: "4K Ultra Monitor", price: "185000 ₸", variant: "27 inch 144Hz", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=4", imageAlt: "4K Monitor", category: "Displays & Monitors", isFavorited: false }, + { id: "15", name: "Gaming Monitor 240Hz", price: "125000 ₸", variant: "27" 1440p", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=4", imageAlt: "Gaming Monitor", category: "Displays & Monitors", isFavorited: false }, + { id: "16", name: "Ultrawide Monitor", price: "165000 ₸", variant: "34" 3440x1440", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=4", imageAlt: "Ultrawide", category: "Displays & Monitors", isFavorited: false }, + { id: "17", name: "Portable Monitor USB-C", price: "95000 ₸", variant: "15.6 Inch FHD", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=5", imageAlt: "Portable Monitor", category: "Displays & Monitors", isFavorited: false }, + { id: "18", name: "Budget IPS Monitor", price: "65000 ₸", variant: "24" 1080p", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=5", imageAlt: "Budget Monitor", category: "Displays & Monitors", isFavorited: false }, + { id: "19", name: "Curved Gaming Monitor", price: "145000 ₸", variant: "32" 1440p Curved", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=5", imageAlt: "Curved Monitor", category: "Displays & Monitors", isFavorited: false }, + { id: "20", name: "Touch Screen Monitor", price: "210000 ₸", variant: "27" 4K Touch", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=5", imageAlt: "Touch Monitor", category: "Displays & Monitors", isFavorited: false }, + // Computer Components (15 items) + { id: "21", name: "RTX 4070 Graphics Card", price: "380000 ₸", variant: "12GB GDDR6", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=6", imageAlt: "Graphics Card", category: "Computer Components", isFavorited: false }, + { id: "22", name: "Intel Core i9 Processor", price: "280000 ₸", variant: "13th Gen", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=6", imageAlt: "CPU", category: "Computer Components", isFavorited: false }, + { id: "23", name: "32GB RAM Kit", price: "45000 ₸", variant: "DDR5 5600MHz", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=6", imageAlt: "RAM", category: "Computer Components", isFavorited: false }, + { id: "24", name: "1TB SSD NVMe", price: "42000 ₸", variant: "PCIe 4.0", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=6", imageAlt: "SSD", category: "Computer Components", isFavorited: false }, + { id: "25", name: "750W Power Supply", price: "55000 ₸", variant: "80+ Gold Certified", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=7", imageAlt: "PSU", category: "Computer Components", isFavorited: false }, + { id: "26", name: "CPU Cooler Tower", price: "18000 ₸", variant: "RGB LED", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=7", imageAlt: "Cooler", category: "Computer Components", isFavorited: false }, + { id: "27", name: "Motherboard B850", price: "68000 ₸", variant: "Socket AM5", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=7", imageAlt: "Motherboard", category: "Computer Components", isFavorited: false }, + { id: "28", name: "Liquid Cooler AIO", price: "65000 ₸", variant: "240mm", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=7", imageAlt: "AIO", category: "Computer Components", isFavorited: false }, + { id: "29", name: "Case ATX Mid Tower", price: "35000 ₸", variant: "Tempered Glass", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=8", imageAlt: "Case", category: "Computer Components", isFavorited: false }, + { id: "30", name: "CPU Cooler Air", price: "12000 ₸", variant: "2 Fan Tower", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=8", imageAlt: "Air Cooler", category: "Computer Components", isFavorited: false }, + { id: "31", name: "2TB HDD Storage", price: "25000 ₸", variant: "3.5 Inch 7200RPM", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=8", imageAlt: "HDD", category: "Computer Components", isFavorited: false }, + { id: "32", name: "RTX 4060 Graphics Card", price: "220000 ₸", variant: "8GB GDDR6", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=8", imageAlt: "GPU Budget", category: "Computer Components", isFavorited: false }, + { id: "33", name: "AMD Ryzen 7 CPU", price: "195000 ₸", variant: "5700X3D", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=9", imageAlt: "CPU AMD", category: "Computer Components", isFavorited: false }, + { id: "34", name: "16GB RAM DDR4", price: "28000 ₸", variant: "3200MHz", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=9", imageAlt: "RAM DDR4", category: "Computer Components", isFavorited: false }, + { id: "35", name: "500W Power Supply", price: "32000 ₸", variant: "80+ Bronze", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=9", imageAlt: "PSU Budget", category: "Computer Components", isFavorited: false }, + // Audio & Video (8 items) + { id: "36", name: "Gaming Headset", price: "29000 ₸", variant: "Wireless 2.4GHz", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=9", imageAlt: "Headset", category: "Audio & Video", isFavorited: false }, + { id: "37", name: "USB Microphone", price: "16000 ₸", variant: "Condenser", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=10", imageAlt: "Mic", category: "Audio & Video", isFavorited: false }, + { id: "38", name: "Webcam 1080p Full HD", price: "9500 ₸", variant: "Auto Focus", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=10", imageAlt: "Webcam", category: "Audio & Video", isFavorited: false }, + { id: "39", name: "Bluetooth Speaker", price: "12500 ₸", variant: "Portable", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=10", imageAlt: "Speaker", category: "Audio & Video", isFavorited: false }, + { id: "40", name: "Studio Headphones", price: "45000 ₸", variant: "Professional", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=10", imageAlt: "Studio Headphones", category: "Audio & Video", isFavorited: false }, + { id: "41", name: "USB-C Webcam 4K", price: "28000 ₸", variant: "4K Resolution", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=11", imageAlt: "4K Webcam", category: "Audio & Video", isFavorited: false }, + { id: "42", name: "Wireless Earbuds", price: "8500 ₸", variant: "TWS Bluetooth", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=11", imageAlt: "Earbuds", category: "Audio & Video", isFavorited: false }, + { id: "43", name: "Streaming Microphone", price: "18000 ₸", variant: "XLR", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=11", imageAlt: "XLR Mic", category: "Audio & Video", isFavorited: false }, + // Connectivity & Cables (8 items) + { id: "44", name: "HDMI 2.1 Cable", price: "4500 ₸", variant: "2M Length", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=11", imageAlt: "Cable", category: "Connectivity & Cables", isFavorited: false }, + { id: "45", name: "DisplayPort Cable Premium", price: "6000 ₸", variant: "1.4 Spec", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=12", imageAlt: "Cable", category: "Connectivity & Cables", isFavorited: false }, + { id: "46", name: "USB-C Hub Docking", price: "16000 ₸", variant: "7-in-1 Port", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=12", imageAlt: "Hub", category: "Connectivity & Cables", isFavorited: false }, + { id: "47", name: "USB 3.0 Hub 7-Port", price: "11500 ₸", variant: "High Speed", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=12", imageAlt: "Hub", category: "Connectivity & Cables", isFavorited: false }, + { id: "48", name: "Network Card Gigabit", price: "6500 ₸", variant: "PCIe", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=12", imageAlt: "Network Card", category: "Connectivity & Cables", isFavorited: false }, + { id: "49", name: "WiFi 6 Card PCIe", price: "18000 ₸", variant: "AX200", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=13", imageAlt: "WiFi Card", category: "Connectivity & Cables", isFavorited: false }, + { id: "50", name: "USB-C to HDMI Adapter", price: "5500 ₸", variant: "4K Support", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=13", imageAlt: "Adapter", category: "Connectivity & Cables", isFavorited: false }, + { id: "51", name: "Thunderbolt 3 Cable", price: "7500 ₸", variant: "Premium Build", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=13", imageAlt: "Thunderbolt", category: "Connectivity & Cables", isFavorited: false }, + // Storage & Backup (7 items) + { id: "52", name: "External HDD 4TB", price: "35000 ₸", variant: "USB 3.0", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=13", imageAlt: "External HDD", category: "Storage & Backup", isFavorited: false }, + { id: "53", name: "NAS Storage 2 Bay", price: "125000 ₸", variant: "Network Attached", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=14", imageAlt: "NAS", category: "Storage & Backup", isFavorited: false }, + { id: "54", name: "2TB SSD External", price: "78000 ₸", variant: "Portable Fast", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=14", imageAlt: "External SSD", category: "Storage & Backup", isFavorited: false }, + { id: "55", name: "USB Flash Drive 256GB", price: "8000 ₸", variant: "High Speed", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=14", imageAlt: "USB Drive", category: "Storage & Backup", isFavorited: false }, + { id: "56", name: "Memory Card 512GB", price: "12000 ₸", variant: "UHS-II", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=14", imageAlt: "Memory Card", category: "Storage & Backup", isFavorited: false }, + { id: "57", name: "Portable SSD 1TB", price: "45000 ₸", variant: "T7 Style", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=15", imageAlt: "Portable SSD", category: "Storage & Backup", isFavorited: false }, + { id: "58", name: "Optical Drive Blu-ray", price: "15000 ₸", variant: "Internal", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=15", imageAlt: "Drive", category: "Storage & Backup", isFavorited: false }, + // Furniture & Accessories (6 items) + { id: "59", name: "Gaming Chair Premium", price: "185000 ₸", variant: "Ergonomic Design", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=15", imageAlt: "Chair", category: "Furniture & Accessories", isFavorited: false }, + { id: "60", name: "Gaming Desk", price: "95000 ₸", variant: "Carbon Fiber", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=15", imageAlt: "Desk", category: "Furniture & Accessories", isFavorited: false } + ]; + + // Initialize categories on mount + useEffect(() => { + setIsLoadingCategories(true); + // Simulate category loading delay + const timer = setTimeout(() => { + const categories = [ + { + id: "laptops", name: "Laptops & Desktops", products: allProducts.filter(p => p.category === "Laptops & Desktops") + }, + { + id: "peripherals-input", name: "Peripherals - Input", products: allProducts.filter(p => p.category === "Peripherals - Input") + }, + { + id: "displays", name: "Displays & Monitors", products: allProducts.filter(p => p.category === "Displays & Monitors") + }, + { + id: "components", name: "Computer Components", products: allProducts.filter(p => p.category === "Computer Components") + }, + { + id: "audio-video", name: "Audio & Video", products: allProducts.filter(p => p.category === "Audio & Video") + }, + { + id: "connectivity", name: "Connectivity & Cables", products: allProducts.filter(p => p.category === "Connectivity & Cables") + }, + { + id: "storage", name: "Storage & Backup", products: allProducts.filter(p => p.category === "Storage & Backup") + }, + { + id: "furniture", name: "Furniture & Accessories", products: allProducts.filter(p => p.category === "Furniture & Accessories") + } + ]; + setProductCategories(categories); + setIsLoadingCategories(false); + // Set first category as default + setSelectedCategoryId(categories[0].id); + }, 500); + return () => clearTimeout(timer); + }, []); const addToCart = (product: any) => { const existingItem = cart.find(item => item.id === product.id); @@ -61,164 +181,11 @@ export default function LandingPage() { }, 0); }; - const allProducts = [ - { - id: "1", name: "Gaming Laptop Pro", price: "450000 ₸", variant: "Black RTX 4060", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=1", imageAlt: "Gaming Laptop", isFavorited: false - }, - { - id: "2", name: "Mechanical Keyboard RGB", price: "35000 ₸", variant: "Red Switches 4 Colors", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=1", imageAlt: "Mechanical Keyboard", isFavorited: false - }, - { - id: "3", name: "4K Ultra Monitor", price: "185000 ₸", variant: "27 inch 144Hz", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=1", imageAlt: "4K Monitor", isFavorited: false - }, - { - id: "4", name: "Wireless Gaming Mouse", price: "28000 ₸", variant: "White Optical", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=1", imageAlt: "Gaming Mouse", isFavorited: false - }, - { - id: "5", name: "RTX 4070 Graphics Card", price: "380000 ₸", variant: "12GB GDDR6", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=2", imageAlt: "Graphics Card", isFavorited: false - }, - { - id: "6", name: "Intel Core i9 Processor", price: "280000 ₸", variant: "13th Gen", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=2", imageAlt: "CPU", isFavorited: false - }, - { - id: "7", name: "32GB RAM Kit", price: "45000 ₸", variant: "DDR5 5600MHz", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=2", imageAlt: "RAM", isFavorited: false - }, - { - id: "8", name: "1TB SSD NVMe", price: "42000 ₸", variant: "PCIe 4.0", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=2", imageAlt: "SSD", isFavorited: false - }, - { - id: "9", name: "750W Power Supply", price: "55000 ₸", variant: "80+ Gold Certified", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=3", imageAlt: "PSU", isFavorited: false - }, - { - id: "10", name: "CPU Cooler Tower", price: "18000 ₸", variant: "RGB LED", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=3", imageAlt: "Cooler", isFavorited: false - }, - { - id: "11", name: "Gaming Mousepad XL", price: "12000 ₸", variant: "Cloth Surface", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=3", imageAlt: "Mousepad", isFavorited: false - }, - { - id: "12", name: "Mechanical Headrest", price: "22000 ₸", variant: "Ergonomic Support", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=3", imageAlt: "Headrest", isFavorited: false - }, - { - id: "13", name: "USB-C Hub Docking", price: "16000 ₸", variant: "7-in-1 Port", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=4", imageAlt: "Hub", isFavorited: false - }, - { - id: "14", name: "Wireless Charger Pad", price: "8500 ₸", variant: "Fast Charging", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=4", imageAlt: "Charger", isFavorited: false - }, - { - id: "15", name: "Screen Protector Glass", price: "5000 ₸", variant: "27 inch", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=4", imageAlt: "Protector", isFavorited: false - }, - { - id: "16", name: "HDMI 2.1 Cable", price: "4500 ₸", variant: "2M Length", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=4", imageAlt: "Cable", isFavorited: false - }, - { - id: "17", name: "DisplayPort Cable Premium", price: "6000 ₸", variant: "1.4 Spec", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=5", imageAlt: "Cable", isFavorited: false - }, - { - id: "18", name: "RGB LED Strip Kit", price: "9000 ₸", variant: "5 Meters", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=5", imageAlt: "LED Strip", isFavorited: false - }, - { - id: "19", name: "Thermal Paste Premium", price: "3500 ₸", variant: "5G Tube", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=5", imageAlt: "Thermal Paste", isFavorited: false - }, - { - id: "20", name: "Cable Management Kit", price: "7000 ₸", variant: "Velcro Ties", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=5", imageAlt: "Cables", isFavorited: false - }, - { - id: "21", name: "M.2 SSD Holder Mount", price: "2500 ₸", variant: "Aluminum", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=6", imageAlt: "Mount", isFavorited: false - }, - { - id: "22", name: "RAM Heat Sink Coolers", price: "4000 ₸", variant: "4 Piece Set", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=6", imageAlt: "Heatsinks", isFavorited: false - }, - { - id: "23", name: "GPU Support Bracket", price: "3000 ₸", variant: "Adjustable", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=6", imageAlt: "Bracket", isFavorited: false - }, - { - id: "24", name: "Anti-Static Wrist Band", price: "2000 ₸", variant: "Grounding", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=6", imageAlt: "Wrist Band", isFavorited: false - }, - { - id: "25", name: "Magnetic Screwdriver Set", price: "8000 ₸", variant: "12 Piece", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=7", imageAlt: "Tools", isFavorited: false - }, - { - id: "26", name: "Laptop Stand Portable", price: "11000 ₸", variant: "Aluminum Alloy", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=7", imageAlt: "Stand", isFavorited: false - }, - { - id: "27", name: "Monitor Arm Dual", price: "28000 ₸", variant: "Gas Spring", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=7", imageAlt: "Arm", isFavorited: false - }, - { - id: "28", name: "Desk Organizer Set", price: "9500 ₸", variant: "Bamboo", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=7", imageAlt: "Organizer", isFavorited: false - }, - { - id: "29", name: "Keyboard Wrist Rest", price: "6500 ₸", variant: "Memory Foam", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=8", imageAlt: "Wrist Rest", isFavorited: false - }, - { - id: "30", name: "Monitor Light Bar", price: "32000 ₸", variant: "Adjustable", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=8", imageAlt: "Light", isFavorited: false - }, - { - id: "31", name: "Laptop Cooling Pad", price: "14000 ₸", variant: "5 Fans", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=8", imageAlt: "Pad", isFavorited: false - }, - { - id: "32", name: "Portable Monitor USB-C", price: "95000 ₸", variant: "15.6 Inch FHD", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=8", imageAlt: "Portable Monitor", isFavorited: false - }, - { - id: "33", name: "Wireless Keyboard Set", price: "19000 ₸", variant: "2.4GHz USB", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=9", imageAlt: "Keyboard", isFavorited: false - }, - { - id: "34", name: "USB 3.0 Hub 7-Port", price: "11500 ₸", variant: "High Speed", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=9", imageAlt: "Hub", isFavorited: false - }, - { - id: "35", name: "Network Card Gigabit", price: "6500 ₸", variant: "PCIe", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=9", imageAlt: "Network Card", isFavorited: false - }, - { - id: "36", name: "WiFi 6 Card PCIe", price: "18000 ₸", variant: "AX200", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=9", imageAlt: "WiFi Card", isFavorited: false - }, - { - id: "37", name: "Sound Card Audio", price: "8500 ₸", variant: "7.1 Surround", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=10", imageAlt: "Sound Card", isFavorited: false - }, - { - id: "38", name: "2TB HDD Storage", price: "25000 ₸", variant: "3.5 Inch 7200RPM", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=10", imageAlt: "HDD", isFavorited: false - }, - { - id: "39", name: "External HDD 4TB", price: "35000 ₸", variant: "USB 3.0", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=10", imageAlt: "External HDD", isFavorited: false - }, - { - id: "40", name: "NAS Storage 2 Bay", price: "125000 ₸", variant: "Network Attached", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=10", imageAlt: "NAS", isFavorited: false - }, - { - id: "41", name: "Case Fan 120mm RGB", price: "5500 ₸", variant: "Quiet", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=11", imageAlt: "Fan", isFavorited: false - }, - { - id: "42", name: "Liquid Cooler AIO", price: "65000 ₸", variant: "240mm", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=11", imageAlt: "AIO", isFavorited: false - }, - { - id: "43", name: "Case ATX Mid Tower", price: "35000 ₸", variant: "Tempered Glass", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=11", imageAlt: "Case", isFavorited: false - }, - { - id: "44", name: "Motherboard B850", price: "68000 ₸", variant: "Socket AM5", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=11", imageAlt: "Motherboard", isFavorited: false - }, - { - id: "45", name: "CPU Cooler Air", price: "12000 ₸", variant: "2 Fan Tower", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=12", imageAlt: "Air Cooler", isFavorited: false - }, - { - id: "46", name: "Optical Drive Blu-ray", price: "15000 ₸", variant: "Internal", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=12", imageAlt: "Drive", isFavorited: false - }, - { - id: "47", name: "Gaming Headset", price: "29000 ₸", variant: "Wireless 2.4GHz", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=12", imageAlt: "Headset", isFavorited: false - }, - { - id: "48", name: "USB Microphone", price: "16000 ₸", variant: "Condenser", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=12", imageAlt: "Mic", isFavorited: false - }, - { - id: "49", name: "Webcam 1080p Full HD", price: "9500 ₸", variant: "Auto Focus", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-keyboard-colorful-neon-illumination-backlit-keyboard_169016-29227.jpg?_wi=13", imageAlt: "Webcam", isFavorited: false - }, - { - id: "50", name: "Gaming Chair Premium", price: "185000 ₸", variant: "Ergonomic Design", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-black-keyboard-cropped-image-laptop-keyboard-computer-technology-gadget-concept_74855-24369.jpg?_wi=13", imageAlt: "Chair", isFavorited: false - }, - { - id: "51", name: "Gaming Desk", price: "95000 ₸", variant: "Carbon Fiber", imageSrc: "http://img.b2bpic.net/free-vector/glowing-search-radar-black-background_1284-18879.jpg?_wi=13", imageAlt: "Desk", isFavorited: false - }, - { - id: "52", name: "Power Bank 65W", price: "18500 ₸", variant: "Fast Charging", imageSrc: "http://img.b2bpic.net/free-psd/black-wired-computer-mouse-transparent-background_84443-65260.jpg?_wi=13", imageAlt: "Power Bank", isFavorited: false - } - ]; + const selectedCategory = productCategories.find(cat => cat.id === selectedCategoryId); + const productsToDisplay = selectedCategory ? selectedCategory.products.slice(0, 8).map(p => ({ + ...p, + onProductClick: () => addToCart(p) + })) : []; return (
- ({ - ...p, - onProductClick: () => addToCart(p) - }))} - buttons={[{ text: "Смотреть все товары", href: "#" }]} - buttonAnimation="slide-up" - carouselMode="buttons" - /> +
+ {/* Category Loading State */} + {isLoadingCategories ? ( +
+
+

Загрузка категорий товаров...

+
+ ) : ( + <> + {/* Category Navigation */} +
+

Категории товаров

+
+ {productCategories.map((category) => ( + + ))} +
+
+ + {/* Products Grid */} + + + )} +
-- 2.49.1