import { notFound } from 'next/navigation';
import { fetchByTag } from '@/lib/api/feed/feed';
import FeedList from '../../_component/FeedList';

type Props = {
	params: Promise<{ slug: string }>;
};

export default async function FeedTagPage({ params }: Props) {
	const { slug } = await params;
	const res = await fetchByTag(slug, 1, 20);

	if (!res.data) {
		notFound();
	}

	const data = res.data;

	return (
		<>
			<header className="feed__header feed__header--tag">
				<h1 className="feed__tag-title">
					<span className="feed__tag-hash">#</span>
					{data.tagName}
				</h1>
				<p className="feed__tag-meta">{data.total.toLocaleString()}개의 게시물</p>
			</header>

			<FeedList
				initialCards={data.list}
				initialTotal={data.total}
				endpoint={`/api/feed/tag/${encodeURIComponent(data.tagSlug)}`}
				emptyMessage="이 태그의 게시물이 없습니다."
			/>
		</>
	);
}