'use client';

// 글 상세용 예측 배지 — /api/posts/{id}/prediction 을 클라이언트에서 조회해 렌더.
// 예측이 없는 글(비종목글 포함)은 404 → 아무것도 렌더하지 않음(모든 게시판에서 안전).
import '@/app/styles/community.scss';
import { useEffect, useState } from 'react';
import { fetchApi } from '@/lib/utils/client';
import { PostPredictionResponse } from '@/types/community';
import PredictionBadge from './PredictionBadge';

interface Props {
	postID: number;
}

export default function PostPredictionBadge({ postID }: Props)
{
	const [prediction, setPrediction] = useState<PostPredictionResponse|null>(null);

	useEffect(() => {
		let active = true;

		(async () => {
			try {
				const res = await fetchApi<PostPredictionResponse>(`/api/posts/${postID}/prediction`, { silent: true });
				if (active && res.success && res.data) {
					setPrediction(res.data);
				}
			} catch {
				// 예측 없음/조회 실패는 무시 (배지 미표시)
			}
		})();

		return () => {
			active = false;
		};
	}, [postID]);

	if (!prediction) {
		return null;
	}

	return (
		<div className='post-prediction'>
			<PredictionBadge prediction={prediction} variant='detail' />
		</div>
	);
}