import React from 'react';
import type { ReportData } from '../types';
import { ReportDisplay } from './ReportDisplay';

interface PrintableReportProps {
  reports: ReportData[];
}

export const PrintableReport: React.FC<PrintableReportProps> = ({ reports }) => {
  return (
    <div 
      id="printable-report-container" 
      data-report={JSON.stringify(reports)}
      className="light bg-white text-slate-900 flex flex-col gap-8"
    >
      {reports.map((report, idx) => (
        <div key={idx} className="report-page bg-white w-full h-auto">
          <ReportDisplay report={report} />
        </div>
      ))}
    </div>
  );
};