Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 | 1x 5x 5x 1x 4x | // 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';
export 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} />
</>
)}
</>
);
};
|