ANTOOZA-FRONTEND/app/(main)/_components/Sparkline.tsx

'use client';

import './sparkline.scss';
import dynamic from 'next/dynamic';
import type { MoveDir } from '@/types/worldIndex';

// recharts(d3) 지연 로드(ssr:false) — 스파크라인 청크를 초기 번들에서 분리. 데이터 2개 미만이면 빈 placeholder.
const SparklineInner = dynamic(() => import('./SparklineInner'), {
	ssr: false,
	loading: () => <div className='spark spark--empty' aria-hidden='true' />
});

type Props = {
	data: number[];
	dir: MoveDir;
};

export default function Sparkline({ data, dir }: Props)
{
	if (!data || data.length < 2) {
		return <div className='spark spark--empty' aria-hidden='true' />;
	}

	return <SparklineInner data={data} dir={dir} />;
}