37 lines
1.2 KiB
TypeScript
37 lines
1.2 KiB
TypeScript
'use client';
|
|
import { useRouter } from '@/shared/config/i18n/navigation';
|
|
import { categoryList, CategoryType } from '@/widgets/welcome/lib/data';
|
|
import { ChevronRight } from 'lucide-react';
|
|
|
|
const Category = () => {
|
|
const router = useRouter();
|
|
const handleCategoryClick = (category: CategoryType) => {
|
|
router.push(`/category/${category.name}`);
|
|
};
|
|
|
|
return (
|
|
<div className="min-h-screen bg-gray-50 p-4">
|
|
<div className="max-w-6xl mx-auto">
|
|
<h1 className="text-2xl font-semibold text-gray-900 mb-6">
|
|
Kategoriyalar
|
|
</h1>
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-3">
|
|
{categoryList.map((category, index) => (
|
|
<button
|
|
key={index}
|
|
onClick={() => handleCategoryClick(category)}
|
|
className="bg-white border border-gray-200 rounded-lg p-4 flex items-center justify-between hover:border-gray-300 transition-colors"
|
|
>
|
|
<span className="text-gray-900 font-medium">{category.name}</span>
|
|
<ChevronRight className="w-5 h-5 text-gray-400" />
|
|
</button>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Category;
|