From ae415fef4e90b914295c23df0287abf261a7b085 Mon Sep 17 00:00:00 2001 From: NolbertoChagala Date: Wed, 26 Aug 2026 11:26:30 -0500 Subject: [PATCH] =?UTF-8?q?feat:=20reorganizaci=C3=B3n=20de=20categor?= =?UTF-8?q?=C3=ADas=20y=20refactorizaci=C3=B3n=20de=20CourseGrid?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 13 + src/components/buyer/CourseGrid.tsx | 727 +++++++++++++++++++++------- src/components/layout/Footer.tsx | 16 +- src/components/layout/Navbar.tsx | 44 +- src/data/mockCourses.ts | 61 ++- src/types/course.ts | 2 +- src/views/BuyerView.tsx | 15 +- src/views/HomeView.tsx | 1 + 8 files changed, 626 insertions(+), 253 deletions(-) diff --git a/package-lock.json b/package-lock.json index 5d91103..573d8c4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -62,6 +62,7 @@ "integrity": "sha512-RgHBCvtjbOK2gXSNBNIkNoEc9qoVEtau3hj8gEqKQuL3HZAibKarWFEI3Lfm6EYKkLalOh8eSrj9b+ch9H/VBA==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "@babel/code-frame": "^7.29.7", "@babel/generator": "^7.29.7", @@ -1324,6 +1325,7 @@ "integrity": "sha512-Dh8vAsV36ig5wa9OX4pXvMc9D3Veibfw2wix0CUwYODLD8nkj9UsLjASr49nPg+2eKzxhBV+v7L8pXvT4e639Q==", "devOptional": true, "license": "MIT", + "peer": true, "dependencies": { "undici-types": "~7.18.0" } @@ -1334,6 +1336,7 @@ "integrity": "sha512-AnzbBERsrLKtk2XSfTbYRLjQPdy116Sty4q+T+Bp3IC4l6jNBvreVPAHmpq9qhXQM7CXZPjLVmGMw9sy+hxQ3w==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "csstype": "^3.2.2" } @@ -1393,6 +1396,7 @@ "integrity": "sha512-fUBfTuuEulWqX6V8+O3PtScV01tzYYRUDTAirHFKoRAt7nOzoGiPt0M/bB47wWNy0coOOcgEwAMUtBpykMxl6w==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "@typescript-eslint/scope-manager": "8.67.0", "@typescript-eslint/types": "8.67.0", @@ -1627,6 +1631,7 @@ "integrity": "sha512-lGq+9yr1/GuAWaVYIHRjvvySG5/4VfKIvC8EWxStPdcDh/Ka7FG3twP6v4d5BkravUilhIAsG4Qj83t02LWUPQ==", "dev": true, "license": "MIT", + "peer": true, "bin": { "acorn": "bin/acorn" }, @@ -1717,6 +1722,7 @@ } ], "license": "MIT", + "peer": true, "dependencies": { "baseline-browser-mapping": "^2.11.12", "caniuse-lite": "^1.0.30001809", @@ -1877,6 +1883,7 @@ "integrity": "sha512-5KeEOJZBfEVA47boFiBsf+6MmmJpffM7qEBg4pLla2e4nlKgdKlqCW0oSLOGsT8Wl5uCGJptLV1bkaiShj90Gw==", "dev": true, "license": "MIT", + "peer": true, "workspaces": [ "packages/*" ], @@ -2778,6 +2785,7 @@ "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.5.tgz", "integrity": "sha512-RvwwcruNjI1ncT5xRakeyS9Lf8lcItv34KD+aif+VH9kduAyfYBipGh12274xtenIPZ119/R9BdTBa8gAwSh0A==", "license": "MIT", + "peer": true, "engines": { "node": ">=12" }, @@ -2838,6 +2846,7 @@ "resolved": "https://registry.npmjs.org/react/-/react-19.2.8.tgz", "integrity": "sha512-PWaYA1L/q9u2u7xYQi+Y3L3Yfnie7XyLeaJICV1MGD6LprsBxcAqGjYyr0eY3p+QdsA+x/Irkt4Qif8D63+Sbw==", "license": "MIT", + "peer": true, "engines": { "node": ">=0.10.0" } @@ -2847,6 +2856,7 @@ "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.8.tgz", "integrity": "sha512-rVprimfGBG3DR+Tq0IQG2DT5PxKth1WIGDmj5yPmlzr4YBe7uyE+Du4oVqTDXZSHGGGXRtTJEGSSePyQCMBglQ==", "license": "MIT", + "peer": true, "dependencies": { "scheduler": "^0.27.0" }, @@ -3039,6 +3049,7 @@ "integrity": "sha512-y2TvuxSZPDyQakkFRPZHKFm+KKVqIisdg9/CZwm9ftvKXLP8NRWj38/ODjNbr43SsoXqNuAisEf1GdCxqWcdBw==", "dev": true, "license": "Apache-2.0", + "peer": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" @@ -3124,6 +3135,7 @@ "resolved": "https://registry.npmjs.org/vite/-/vite-8.2.2.tgz", "integrity": "sha512-cFKLV/PRgAUlIRm5WjMjJ86jrftzpqcgH+Us+DS8mI3CDNiH30Whrz8uHL3+MOLPAgqbMBAqWdAHAphOAM+z/Q==", "license": "MIT", + "peer": true, "dependencies": { "lightningcss": "^1.33.0", "picomatch": "^4.0.5", @@ -3248,6 +3260,7 @@ "integrity": "sha512-ytENFjIJFl2UwYglde2jchW2Hwm4GJFLDiSXWdTrJQBIN9Fcyp7n4DhxJEiWNAJMV1/BqWfW/kkg71UDcHJyTQ==", "dev": true, "license": "MIT", + "peer": true, "funding": { "url": "https://github.com/sponsors/colinhacks" } diff --git a/src/components/buyer/CourseGrid.tsx b/src/components/buyer/CourseGrid.tsx index 3d3e390..ec7f85d 100644 --- a/src/components/buyer/CourseGrid.tsx +++ b/src/components/buyer/CourseGrid.tsx @@ -1,16 +1,23 @@ -import { useState, useMemo } from 'react'; -import { - FiFilter, - FiFlag, - FiStar, - FiPercent, - FiSpeaker, - FiLayers, - FiRefreshCw +import { useState, useMemo, useEffect } from 'react'; +import { + FiFilter, + FiLayers, + FiSearch, + FiCode, + FiShield, + FiTrendingUp, + FiChevronRight, + FiGlobe, + FiFeather, + FiActivity, + FiUsers, + FiZap, + FiBriefcase, + FiMonitor, + FiGrid } from 'react-icons/fi'; -import type { Course, ActiveTabFilter } from '../../types/course'; +import type { Course } from '../../types/course'; import { CourseCard } from './CourseCard'; -import { CategoryPills } from './CategoryPills'; interface CourseGridProps { courses: Course[]; @@ -19,6 +26,7 @@ interface CourseGridProps { onAddToCart: (course: Course) => void; onOpenDetails: (course: Course) => void; onClearSearch: () => void; + showBanners?: boolean; } export const CourseGrid: React.FC = ({ @@ -29,18 +37,139 @@ export const CourseGrid: React.FC = ({ onOpenDetails, onClearSearch, }) => { - const [activeTab, setActiveTab] = useState('all'); const [selectedCategory, setSelectedCategory] = useState('Todos'); + const [selectedSubcategory, setSelectedSubcategory] = useState('Todos'); + const [selectedPopularArea, setSelectedPopularArea] = useState('Todos'); const [selectedLevel, setSelectedLevel] = useState('Todos'); + const [categorySearch, setCategorySearch] = useState(''); const [sortBy, setSortBy] = useState<'rating' | 'price-asc' | 'price-desc' | 'students'>('students'); + const [localSearch, setLocalSearch] = useState(''); + const [showAll, setShowAll] = useState(false); + + // Sync local search when global searchQuery prop changes (e.g. from navbar or clear button) + useEffect(() => { + setLocalSearch(searchQuery); + }, [searchQuery]); + + // Reset subcategory and level when selected category changes + useEffect(() => { + setSelectedSubcategory('Todos'); + setSelectedLevel('Todos'); + }, [selectedCategory]); + + // Reset popular area when category changes (avoid conflicts) + useEffect(() => { + if (selectedCategory !== 'Todos') { + setSelectedPopularArea('Todos'); + setShowAll(false); + } + }, [selectedCategory]); + + // Reset showAll when search is entered + useEffect(() => { + if (localSearch.trim() !== '') { + setShowAll(false); + } + }, [localSearch]); + + // Helper to map and sanitize category names for flexible database mapping + const getCourseCategory = (course: Course) => { + const cat = course.category; + if (cat === 'Desarrollo Web') return 'Informática'; + if (cat === 'Diseño UI/UX') return 'Informática'; // UI/UX maps to Informática + if (cat === 'Inteligencia Artificial') return 'Ciencia de datos'; + if (cat === 'Ciberseguridad') return 'Tecnologías de la información'; + if (cat === 'Marketing Digital') return 'Empresas'; + if (cat === 'Fotografía') return 'Artes y Humanidades'; + return cat; + }; + + // Helper to map subcategory topic names dynamically + const getCourseSubcategory = (course: Course) => { + if (course.subcategory) return course.subcategory; + + // Fallback topic mappings based on keywords in title + const title = course.title.toLowerCase(); + const cat = course.category; + if (cat === 'Desarrollo Web') { + if (title.includes('react') || title.includes('next.js') || title.includes('typescript')) return 'Desarrollo Web'; + if (title.includes('aws') || title.includes('cloud') || title.includes('devops') || title.includes('docker')) return 'DevOps & Cloud'; + return 'Desarrollo Web'; + } + if (cat === 'Diseño UI/UX') { + if (title.includes('ux') || title.includes('figma')) return 'Diseño UX/UI'; + return 'Sistemas de diseño'; + } + if (cat === 'Fotografía') return 'Fotografía Digital'; + if (cat === 'Inteligencia Artificial') return 'IA Generativa & LLMs'; + if (cat === 'Ciberseguridad') return 'Ethical Hacking'; + if (cat === 'Marketing Digital') return 'Embudos de venta'; + return 'General'; + }; + + // Compute subcategory list dynamically based on selected category + const subcategories = useMemo(() => { + if (selectedCategory === 'Todos') return []; + + const subcats = courses + .filter((c) => getCourseCategory(c) === selectedCategory) + .map((c) => getCourseSubcategory(c)); + + return ['Todos', ...Array.from(new Set(subcats))]; + }, [courses, selectedCategory]); + + // Category information for dedicated page headers (description and metrics) + const categoryDetails = useMemo(() => { + if (selectedCategory === 'Todos') return null; + + switch (selectedCategory) { + case 'Informática': + return { + description: 'Domina la programación web, algoritmos avanzados, TypeScript, frameworks modernos como React y Next.js, y el desarrollo estructurado de software.', + credentials: 53, + totalCourses: 310 + }; + case 'Ciencia de datos': + return { + description: 'Conviértete en experto en analizar grandes conjuntos de datos, modelado de Machine Learning, visualización científica e integración de Inteligencia Artificial.', + credentials: 35, + totalCourses: 182 + }; + case 'Tecnologías de la información': + return { + description: 'Capacítate en administración de redes, infraestructura cloud en AWS, automatización DevOps y auditorías avanzadas de ciberseguridad ofensiva.', + credentials: 29, + totalCourses: 150 + }; + case 'Empresas': + return { + description: 'Desarrolla habilidades comerciales estratégicas, administración ágil de proyectos (Scrum/Kanban) y embudos de marketing digital de alta conversión.', + credentials: 42, + totalCourses: 220 + }; + case 'Artes y Humanidades': + return { + description: 'Explora tu potencial creativo y artístico mediante cursos de fotografía digital profesional, composición visual y edición avanzada de imágenes.', + credentials: 18, + totalCourses: 94 + }; + default: + return { + description: 'Explora cursos líderes en esta disciplina, obtén credenciales de nivel profesional y acelera tu inserción en el mercado laboral.', + credentials: 12, + totalCourses: 60 + }; + } + }, [selectedCategory]); // Filtered & Sorted courses computation const filteredCourses = useMemo(() => { return courses .filter((course) => { // Search query filter - if (searchQuery.trim()) { - const q = searchQuery.toLowerCase(); + const activeSearch = localSearch.trim() || searchQuery.trim(); + if (activeSearch) { + const q = activeSearch.toLowerCase(); const matchTitle = course.title.toLowerCase().includes(q); const matchSub = course.subtitle.toLowerCase().includes(q); const matchCat = course.category.toLowerCase().includes(q); @@ -48,21 +177,28 @@ export const CourseGrid: React.FC = ({ if (!matchTitle && !matchSub && !matchCat && !matchInst) return false; } - // Category filter + // Category Page Filter (active only when selectedCategory !== 'Todos') if (selectedCategory !== 'Todos') { - if (course.category !== selectedCategory) return false; - } + const cat = getCourseCategory(course); + if (cat !== selectedCategory) return false; - // Level filter - if (selectedLevel !== 'Todos') { - if (course.level !== selectedLevel && course.level !== 'Todos los niveles') return false; - } + // Level Filter (inside category page level pills) + if (selectedLevel !== 'Todos') { + if (course.level !== selectedLevel && course.level !== 'Todos los niveles') return false; + } - // Tab filter - if (activeTab === 'popular' && course.studentsCount < 6000) return false; - if (activeTab === 'top-rated' && course.rating < 4.9) return false; - if (activeTab === 'offers' && !course.badge?.includes('Oferta') && course.originalPrice <= course.price) return false; - if (activeTab === 'new' && course.badge !== 'Nuevo') return false; + // Subcategory filter + if (selectedSubcategory !== 'Todos') { + const sub = getCourseSubcategory(course); + if (sub !== selectedSubcategory) return false; + } + } else { + // Main Page Popular Area Filter (active only when selectedCategory === 'Todos') + if (selectedPopularArea !== 'Todos') { + const cat = getCourseCategory(course); + if (cat !== selectedPopularArea) return false; + } + } return true; }) @@ -72,188 +208,407 @@ export const CourseGrid: React.FC = ({ if (sortBy === 'price-desc') return b.price - a.price; return b.studentsCount - a.studentsCount; // default: popular }); - }, [courses, searchQuery, selectedCategory, selectedLevel, activeTab, sortBy]); + }, [courses, searchQuery, localSearch, selectedCategory, selectedSubcategory, selectedPopularArea, selectedLevel, sortBy]); + + // Filtered courses for general list when selectedCategory === 'Todos' + const generalCourses = useMemo(() => { + return courses + .filter((course) => { + // Search query filter + const activeSearch = localSearch.trim() || searchQuery.trim(); + if (activeSearch) { + const q = activeSearch.toLowerCase(); + const matchTitle = course.title.toLowerCase().includes(q); + const matchSub = course.subtitle.toLowerCase().includes(q); + const matchCat = course.category.toLowerCase().includes(q); + const matchInst = course.instructor.name.toLowerCase().includes(q); + if (!matchTitle && !matchSub && !matchCat && !matchInst) return false; + } + + // Popular area filter + if (selectedPopularArea !== 'Todos') { + const cat = getCourseCategory(course); + if (cat !== selectedPopularArea) return false; + } + + return true; + }) + .sort((a, b) => b.studentsCount - a.studentsCount); + }, [courses, searchQuery, localSearch, selectedPopularArea]); const resetAllFilters = () => { - setActiveTab('all'); setSelectedCategory('Todos'); + setSelectedSubcategory('Todos'); + setSelectedPopularArea('Todos'); setSelectedLevel('Todos'); setSortBy('students'); + setLocalSearch(''); + setShowAll(false); onClearSearch(); }; + // Dynamic Icon Mapper Helper for category pills + const getCategoryIcon = (catName: string) => { + const name = catName.toLowerCase(); + if (name.includes('informática') || name.includes('computación') || name.includes('programación') || name.includes('código')) { + return ; + } + if (name.includes('tecnolog') || name.includes('redes') || name.includes('sistemas') || name.includes('monitor')) { + return ; + } + if (name.includes('datos') || name.includes('inteligencia') || name.includes('ia') || name.includes('analytics') || name.includes('trending')) { + return ; + } + if (name.includes('ingenier') || name.includes('física') || name.includes('química') || name.includes('actividad')) { + return ; + } + if (name.includes('matemát') || name.includes('lógica') || name.includes('cálculo') || name.includes('grid')) { + return ; + } + if (name.includes('empresa') || name.includes('negocio') || name.includes('finanzas') || name.includes('briefcase')) { + return ; + } + if (name.includes('arte') || name.includes('humanidad') || name.includes('diseño') || name.includes('feather') || name.includes('fotografía')) { + return ; + } + if (name.includes('idioma') || name.includes('lengua') || name.includes('globe') || name.includes('inglés')) { + return ; + } + if (name.includes('social') || name.includes('comunidad') || name.includes('users') || name.includes('psicología')) { + return ; + } + if (name.includes('personal') || name.includes('liderazgo') || name.includes('zap') || name.includes('crecimiento')) { + return ; + } + if (name.includes('salud') || name.includes('shield') || name.includes('medicina') || name.includes('bienestar')) { + return ; + } + return ; // generic fallback + }; + + // Get all unique category names + const allCategories = useMemo(() => { + return Array.from(new Set(courses.map(getCourseCategory))).sort(); + }, [courses]); + + // Filter categories by categorySearch query + const filteredCategories = useMemo(() => { + const query = categorySearch.trim().toLowerCase(); + return allCategories.filter(cat => cat.toLowerCase().includes(query)); + }, [allCategories, categorySearch]); + + // Popular Areas matching "Más populares" pills from Coursera screenshot + const popularAreasList = [ + { name: 'Empresas' }, + { name: 'Ciencia de datos' }, + { name: 'Tecnologías de la información' }, + { name: 'Informática' }, + ]; + return ( -
-
- - {/* Section Header */} -
-
-
- - Catálogo Completo +
+
+ + {/* VIEW TYPE A: GENERAL EXPLORE PAGE */} + {selectedCategory === 'Todos' ? ( +
+ + {/* Section Header & Search Bar (Side-by-Side) */} +
+
+
+ + Catálogo de recursos +
+

+ Explorar por categoría +

+

+ Selecciona una categoría para ver los cursos y certificaciones disponibles. +

+
+ + {/* Search Bar compact on the right */} +
+ + setLocalSearch(e.target.value)} + placeholder="Buscar cursos..." + className="w-full pl-11 pr-4 py-3 bg-slate-900 border border-slate-800 rounded-2xl text-sm text-slate-200 placeholder-slate-500 focus:outline-none focus:border-cyan-500 transition-colors" + /> +
-

- Explora Cursos Destacados -

-

- Filtra por tu área de interés, nivel o aprovecha promociones de temporada. -

-
- {/* Quick Tabs */} -
- - + {/* Explore Categories Directory */} +
+ {/* Category Search Filter Input */} + {allCategories.length > 5 && ( +
+
+ + setCategorySearch(e.target.value)} + placeholder="Filtrar categorías por nombre..." + className="w-full pl-9 pr-4 py-2 bg-slate-900 border border-slate-800 rounded-full text-xs text-slate-200 placeholder-slate-505 focus:outline-none focus:border-cyan-500 transition-colors" + /> +
+
+ )} - - - - - -
-
- - {/* Categories Bar */} -
- -
- - {/* Secondary Filter & Sorting Controls */} -
- -
- - Filtros: - - - {/* Level Filter */} - - - {/* Clear Filters if active */} - {(selectedCategory !== 'Todos' || selectedLevel !== 'Todos' || activeTab !== 'all' || searchQuery.trim()) && ( - - )} -
- - {/* Sort By Dropdown & Results Counter */} -
- - Mostrando {filteredCourses.length} cursos - - -
- Ordenar por: - + {filteredCategories.length > 0 ? ( +
+ {filteredCategories.map((catName) => ( + + ))} +
+ ) : ( +
+

+ No se encontraron categorías que coincidan con "{categorySearch}". +

+
+ )}
-
-
- {/* Courses Grid */} - {filteredCourses.length > 0 ? ( -
- {filteredCourses.map((course) => ( - - ))} + + {/* 2. Áreas más populares (Sentence case, descriptive subtitle) */} +
+

+ Áreas más populares +

+

+ Descubre los temas de mayor demanda laboral en la actualidad. +

+
+ {/* Todos Pill */} + + + {/* Popular Area Pills */} + {popularAreasList.map((area) => { + const isSelected = selectedPopularArea === area.name; + return ( + + ); + })} +
+
+ + {/* General Courses Grid */} +
+
+

+ Listado de cursos +

+

+ Todos los cursos incluyen material de aprendizaje de alta calidad y acceso permanente. +

+
+ + {generalCourses.length > 0 ? ( +
+ {generalCourses.map((course) => ( + + ))} +
+ ) : ( +
+
+ +
+

No se encontraron cursos

+ +
+ )} +
+
) : ( -
-
- + /* VIEW TYPE B: DEDICATED CATEGORY PAGE */ +
+ + {/* Breadcrumbs Navigation */} +
+ + Categorías + + + + {selectedCategory} + +
+ + {/* Category Page Header Block (Title, Description, and Metrics side-by-side) */} +
+
+

+ {selectedCategory} +

+ {categoryDetails && ( +

+ {categoryDetails.description} +

+ )} +
+ + {/* Metrics block on the right */} + {categoryDetails && ( +
+
+
{categoryDetails.credentials}
+
credenciales
+
+
+
cursos
+
de {categoryDetails.totalCourses}
+
+
+ )} +
+ + {/* Subcategories - visible only when category has multiple topics */} + {subcategories.length > 2 && ( +
+
Temas de {selectedCategory}
+
+ {subcategories.map((sub) => { + const isSubSelected = selectedSubcategory === sub; + return ( + + ); + })} +
+
+ )} + + {/* "Filtrar por nivel" (Sentence case, descriptive subtitle, capsules format) */} +
+

+ Filtrar por nivel +

+

+ Selecciona la dificultad adecuada para tu ritmo de aprendizaje. +

+ +
+ {['Todos', 'Principiante', 'Intermedio', 'Avanzado'].map((lvl) => { + const isLvlSelected = selectedLevel === lvl; + return ( + + ); + })} +
+
+ + {/* Section: Listado de cursos (Descriptive title & subtitle) */} +
+
+

+ Listado de cursos de {selectedCategory} +

+

+ Encuentra el material didáctico necesario para avanzar en tu formación profesional. +

+
+ + {filteredCourses.length > 0 ? ( +
+ {filteredCourses.map((course) => ( + + ))} +
+ ) : ( +
+
+ +
+

No se encontraron cursos en este nivel

+ +
+ )}
-

No se encontraron cursos con estos filtros

-

- Intenta cambiar los términos de búsqueda, la categoría o restablecer los filtros para ver todos los cursos disponibles. -

-
)}
); -}; +}; \ No newline at end of file diff --git a/src/components/layout/Footer.tsx b/src/components/layout/Footer.tsx index 3513fa7..2bc164b 100644 --- a/src/components/layout/Footer.tsx +++ b/src/components/layout/Footer.tsx @@ -1,10 +1,7 @@ -import React, { useState } from 'react'; +import React from 'react'; import { - FiMail, - FiCheckCircle, FiGlobe, FiShield, - FiAward, FiHeart } from 'react-icons/fi'; import { FaTwitter, FaYoutube, FaGithub, FaLinkedin, FaDiscord } from 'react-icons/fa'; @@ -12,17 +9,6 @@ import { FaTwitter, FaYoutube, FaGithub, FaLinkedin, FaDiscord } from 'react-ico import { BrandLogo } from '../common/BrandLogo'; export const Footer: React.FC = () => { - const [email, setEmail] = useState(''); - const [subscribed, setSubscribed] = useState(false); - - const handleSubscribe = (e: React.FormEvent) => { - e.preventDefault(); - if (email.trim()) { - setSubscribed(true); - setTimeout(() => setSubscribed(false), 4000); - setEmail(''); - } - }; return (
diff --git a/src/components/layout/Navbar.tsx b/src/components/layout/Navbar.tsx index 31e30ae..f0d9831 100644 --- a/src/components/layout/Navbar.tsx +++ b/src/components/layout/Navbar.tsx @@ -1,3 +1,4 @@ + import React, { useState, useEffect } from 'react'; import { useNavigate, useLocation } from 'react-router'; import { @@ -88,8 +89,8 @@ export const Navbar: React.FC = ({
- {/* 2. Spacious Center Search Bar */} - {!isSellerMode && ( -
-
-
- -
- -
- - ⌘K - -
-
-
- )} - {/* 3. Right Actions & Role Switcher */}
@@ -151,8 +129,8 @@ export const Navbar: React.FC = ({