import { fetchJson } from '../../../lib/api';
import type { Product } from '../../../features/inventory/types';
import MergePreviewForm from './MergePreviewForm';
import AdminProductList from './AdminProductList';
import Navigation from '../../Navigation';

export default async function AdminProductsPage() {
  const products = await fetchJson<Product[]>('/api/products');

  return (
    <main style={{ padding: '1rem', maxWidth: '1100px', margin: '0 auto' }}>
      <Navigation />
      <h1 style={{ marginBottom: '1.5rem' }}>Admin: Produkter</h1>
      <p>Här kan du granska och standardisera produktnamn.</p>

      <MergePreviewForm products={products} />

      <AdminProductList products={products} />
    </main>
  );
}