interface GenerationControlsProps {
  composedVideoPath: string | null;
  isComposing: boolean;
  videoMultiplierLoaded: boolean;
  estimatedVideoPoints: number;
  isPreviewing: boolean;
  onGenerate: () => void;
  onPreview: () => void;
}

/**
 * 底部生成控制栏
 * - 已生成过视频：展示「重新生成」+「视频预览」
 * - 未生成过视频：展示「生成视频」
 */
const GenerationControls: React.FC<GenerationControlsProps> = ({
  composedVideoPath,
  isComposing,
  videoMultiplierLoaded,
  estimatedVideoPoints,
  isPreviewing,
  onGenerate,
  onPreview,
}) => {
  const isDisabled = isComposing || !videoMultiplierLoaded;

  if (composedVideoPath) {
    return (
      <div style={{ display: 'flex', gap: 'var(--spacing-md)', width: '100%' }}>
        <button
          className="btn btn-primary"
          style={{ flexGrow: 1, flexShrink: 0, flexBasis: '0%', marginTop: 0 }}
          onClick={onGenerate}
          disabled={isDisabled}
        >
          重新生成视频（{estimatedVideoPoints} 积分）
        </button>
        <button
          className="btn btn-secondary"
          style={{ flexGrow: 1, flexShrink: 0, flexBasis: '0%', marginTop: 0 }}
          onClick={onPreview}
        >
          {isPreviewing ? '视频预览中' : '视频预览'}
        </button>
      </div>
    );
  }

  return (
    <div style={{ display: 'flex', flexDirection: 'column', gap: 'var(--spacing-sm)', width: '100%' }}>
      <button
        className="btn btn-primary"
        style={{ width: '100%', marginTop: 0, flexShrink: 0 }}
        onClick={onGenerate}
        disabled={isDisabled}
      >
        生成视频（{estimatedVideoPoints} 积分）
      </button>
    </div>
  );
};

export default GenerationControls;
