import { Suspense } from 'react';

export const metadata = {
  title: 'Shop',
  description:
    'Browse premium halal chicken, beef, lamb, and frozen fish. Customized cuts delivered to your door.',
};

export default function ShopLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return <Suspense fallback={<ShopLoading />}>{children}</Suspense>;
}

function ShopLoading() {
  return (
    <div className="flex min-h-[50vh] items-center justify-center">
      <div className="h-8 w-8 animate-spin rounded-full border-4 border-brand-200 border-t-brand-700" />
    </div>
  );
}