forked from minzeyaphyo/burmddit
40 lines
1.8 KiB
TypeScript
40 lines
1.8 KiB
TypeScript
import Link from 'next/link'
|
|
|
|
interface TrendingArticle {
|
|
id: number
|
|
title_burmese: string
|
|
slug: string
|
|
view_count: number
|
|
category_name_burmese: string
|
|
}
|
|
|
|
export default function TrendingSection({ articles }: { articles: TrendingArticle[] }) {
|
|
if (articles.length === 0) return null
|
|
|
|
return (
|
|
<div className="bg-white rounded-lg shadow p-6">
|
|
<h3 className="text-lg font-bold text-gray-900 mb-4 font-burmese flex items-center">
|
|
<svg className="w-5 h-5 text-red-500 mr-2" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fillRule="evenodd" d="M12.395 2.553a1 1 0 00-1.45-.385c-.345.23-.614.558-.822.88-.214.33-.403.713-.57 1.116-.334.804-.614 1.768-.84 2.734a31.365 31.365 0 00-.613 3.58 2.64 2.64 0 01-.945-1.067c-.328-.68-.398-1.534-.398-2.654A1 1 0 005.05 6.05 6.981 6.981 0 003 11a7 7 0 1011.95-4.95c-.592-.591-.98-.985-1.348-1.467-.363-.476-.724-1.063-1.207-2.03zM12.12 15.12A3 3 0 017 13s.879.5 2.5.5c0-1 .5-4 1.25-4.5.5 1 .786 1.293 1.371 1.879A2.99 2.99 0 0113 13a2.99 2.99 0 01-.879 2.121z" clipRule="evenodd" />
|
|
</svg>
|
|
လူကြိုက်များသော
|
|
</h3>
|
|
<ol className="space-y-3">
|
|
{articles.map((article, index) => (
|
|
<li key={article.id} className="flex items-start space-x-3">
|
|
<span className="flex-shrink-0 w-6 h-6 bg-primary-100 text-primary-700 rounded-full flex items-center justify-center text-sm font-bold">
|
|
{index + 1}
|
|
</span>
|
|
<Link
|
|
href={`/article/${article.slug}`}
|
|
className="flex-1 text-gray-700 hover:text-primary-600 font-burmese text-sm line-clamp-2 leading-snug"
|
|
>
|
|
{article.title_burmese}
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ol>
|
|
</div>
|
|
)
|
|
}
|