import { Eye } from 'lucide-react';
import type { WalkthroughSummaryWorkflow } from '@/components/walkthrough-summary/types';

interface WalkthroughAutoSummaryProps {
  readonly summary: WalkthroughSummaryWorkflow;
}

export function WalkthroughAutoSummary({ summary }: WalkthroughAutoSummaryProps) {
  if (!summary.autoSummary) {
    return null;
  }

  return (
    <div className="bg-indigo-500/10 border border-indigo-500/20 rounded-2xl p-5">
      <h3 className="text-sm font-semibold text-indigo-300 mb-2 flex items-center gap-2">
        <Eye size={14} /> Auto-Generated Summary
      </h3>
      <p className="text-sm text-slate-300 italic leading-relaxed">{summary.autoSummary}</p>
    </div>
  );
}
