/**
 * 우측 패널 — 매매 / 호가 탭 (알림목록·모의투자·실시간 차트 공용)
 */
import React from 'react';

export type TradeRightPanelTab = 'trade' | 'orderbook';

interface Props {
  activeTab: TradeRightPanelTab;
  onTabChange: (tab: TradeRightPanelTab) => void;
  className?: string;
}

const TradeRightPanelTabs: React.FC<Props> = ({ activeTab, onTabChange, className = '' }) => (
  <div className={`bps-right-tabs${className ? ` ${className}` : ''}`}>
    <button
      type="button"
      className={`bps-right-tab${activeTab === 'trade' ? ' bps-right-tab--on' : ''}`}
      onClick={() => onTabChange('trade')}
    >
      매매
    </button>
    <button
      type="button"
      className={`bps-right-tab${activeTab === 'orderbook' ? ' bps-right-tab--on' : ''}`}
      onClick={() => onTabChange('orderbook')}
    >
      호가
    </button>
  </div>
);

export default TradeRightPanelTabs;