Import source: app/src/pages/TagPage
Import the existing local project snapshot. This commit organizes existing files; it does not represent newly developed functionality.
This commit is contained in:
@@ -0,0 +1,28 @@
|
|||||||
|
import { useState, useEffect } from 'react';
|
||||||
|
import { EmptyState } from '../../teknav-ui.jsx';
|
||||||
|
import { ArticleRow } from '../../teknav-articles.jsx';
|
||||||
|
import { contentApi } from '../../src/lib/content-api.js';
|
||||||
|
|
||||||
|
export function TagPage({ tag }) {
|
||||||
|
const decoded = decodeURIComponent(tag);
|
||||||
|
const [articles, setArticles] = useState(() => contentApi.fallbackArticles().filter((item) => item.tags?.includes(decoded)));
|
||||||
|
useEffect(() => {
|
||||||
|
let cancelled = false;
|
||||||
|
setArticles(contentApi.fallbackArticles().filter((item) => item.tags?.includes(decoded)));
|
||||||
|
contentApi.listArticles({ tag: decoded, limit: 100 })
|
||||||
|
.then((res) => { if (!cancelled) setArticles(res.items ?? []); })
|
||||||
|
.catch(() => {});
|
||||||
|
return () => { cancelled = true; };
|
||||||
|
}, [decoded]);
|
||||||
|
return (
|
||||||
|
<div style={{ paddingTop: 80, background: '#FAF7F0', minHeight: '100vh', fontFamily: 'Vazirmatn,sans-serif', direction: 'rtl' }}>
|
||||||
|
<div style={{ maxWidth: 960, margin: '0 auto', padding: '40px 24px' }}>
|
||||||
|
<h1 style={{ fontSize: 30, fontWeight: 900, color: '#263238', margin: '0 0 10px' }}>برچسب {decoded}</h1>
|
||||||
|
<p style={{ color: '#5F6B6D', lineHeight: 1.9, margin: '0 0 28px' }}>همه مقالههایی که با این برچسب منتشر شدهاند.</p>
|
||||||
|
{articles.length === 0 ? <EmptyState title="مقالهای برای این برچسب پیدا نشد" /> : articles.map((article, index) => (
|
||||||
|
<ArticleRow key={article.id} article={article} idx={index} />
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user