// src/pages/HomePage.tsx
import React from 'react';
import { FlyerDisplay } from '../features/flyer/FlyerDisplay';
import { ExtractedDataTable } from '../features/flyer/ExtractedDataTable';
import { AnalysisPanel } from '../features/flyer/AnalysisPanel';
import type { Flyer, FlyerItem } from '../types';

interface HomePageProps {
  selectedFlyer: Flyer | null;
  flyerItems: FlyerItem[];
  onOpenCorrectionTool: () => void;
}

export const HomePage: React.FC<HomePageProps> = ({ selectedFlyer, flyerItems, onOpenCorrectionTool }) => {
    const hasData = flyerItems.length > 0;

  if (!selectedFlyer) {
    return (
      <div className="text-center p-8 bg-white dark:bg-gray-800 rounded-lg border border-gray-200 dark:border-gray-700 h-full flex flex-col justify-center min-h-[400px]">
        <h2 className="text-xl font-semibold text-gray-700 dark:text-gray-200">Welcome to Flyer Crawler!</h2>
        <p className="mt-2 text-gray-500 dark:text-gray-400">Upload a new grocery flyer to begin, or select a previously processed flyer from the list on the left.</p>
      </div>
    );
  }

  return (
    <>
      <FlyerDisplay
        imageUrl={selectedFlyer.image_url}
        store={selectedFlyer.store}
        validFrom={selectedFlyer.valid_from}
        validTo={selectedFlyer.valid_to}
        storeAddress={selectedFlyer.store_address}
        onOpenCorrectionTool={onOpenCorrectionTool}
      />
      {hasData && (
        <>
          <ExtractedDataTable
            items={flyerItems}
            unitSystem={'imperial'} // Sourced from context/props
          />
          <AnalysisPanel selectedFlyer={selectedFlyer} />
        </>
      )}
    </>
  );
};