diff --git a/frontend/src/app/[locale]/projetos/page.tsx b/frontend/src/app/[locale]/projetos/page.tsx index c3b7196..e7dbfa9 100644 --- a/frontend/src/app/[locale]/projetos/page.tsx +++ b/frontend/src/app/[locale]/projetos/page.tsx @@ -25,6 +25,9 @@ export default function ProjetosPage() { const [projects, setProjects] = useState([]); const [loading, setLoading] = useState(true); const [selectedCategory, setSelectedCategory] = useState('todos'); + const [searchTerm, setSearchTerm] = useState(""); + + const searchPlaceholder = locale === 'pt' ? 'Pesquisar projetos...' : locale === 'es' ? 'Buscar proyectos...' : 'Search projects...'; useEffect(() => { let isMounted = true; @@ -86,11 +89,17 @@ export default function ProjetosPage() { }, [projects]); const filteredProjects = useMemo(() => { - if (selectedCategory === 'todos') { - return projects; - } - return projects.filter((project) => project.category === selectedCategory); - }, [projects, selectedCategory]); + return projects.filter((project) => { + const matchesCategory = selectedCategory === 'todos' || project.category === selectedCategory; + const matchesSearch = + !searchTerm || + project.title.toLowerCase().includes(searchTerm.toLowerCase()) || + project.description?.toLowerCase().includes(searchTerm.toLowerCase()) || + project.category?.toLowerCase().includes(searchTerm.toLowerCase()) || + project.client?.toLowerCase().includes(searchTerm.toLowerCase()); + return matchesCategory && matchesSearch; + }); + }, [projects, selectedCategory, searchTerm]); return (
@@ -109,6 +118,28 @@ export default function ProjetosPage() { {/* Projects Grid */}
+ {/* Search Bar */} +
+
+ setSearchTerm(e.target.value)} + className="w-full px-5 py-3 pl-12 rounded-full border border-gray-200 dark:border-white/20 bg-white dark:bg-white/5 text-secondary dark:text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent transition-all" + /> + + {searchTerm && ( + + )} +
+
+ {/* Filters */}
+ )}
) : (
@@ -172,6 +221,13 @@ export default function ProjetosPage() { })}
)} + + {/* Results Count */} + {!loading && filteredProjects.length > 0 && ( +
+ {locale === 'pt' ? 'Exibindo' : locale === 'es' ? 'Mostrando' : 'Showing'} {filteredProjects.length} {locale === 'pt' ? 'de' : locale === 'es' ? 'de' : 'of'} {projects.length} {locale === 'pt' ? 'projetos' : locale === 'es' ? 'proyectos' : 'projects'} +
+ )}