/**
 * 타임라인 카드 — 매매 시그널일 때 상세 버튼 포함 래퍼
 */
import React from 'react';
import type { LiveTimelineEvent } from '../../utils/liveTradeTimeline';
import TimelineSignalDetailButton from './TimelineSignalDetailButton';

interface Props {
  ev: LiveTimelineEvent;
  className: string;
  onSignalDetail?: (ev: LiveTimelineEvent) => void;
  children: React.ReactNode;
  tag?: 'article' | 'div';
}

const TimelineSignalCardShell: React.FC<Props> = ({
  ev,
  className,
  onSignalDetail,
  children,
  tag = 'article',
}) => {
  const Tag = tag;
  const showDetail = ev.kind === 'SIGNAL' && ev.signalMeta && onSignalDetail;

  return (
    <Tag
      className={[
        className,
        showDetail ? 'arp-timeline-signal-card-wrap' : '',
      ].filter(Boolean).join(' ')}
    >
      {showDetail && (
        <TimelineSignalDetailButton
          onClick={e => {
            e.stopPropagation();
            onSignalDetail(ev);
          }}
        />
      )}
      {children}
    </Tag>
  );
};

export default TimelineSignalCardShell;