/**
 * ANNOTATED COPY — every line explained
 * Source: src/app/shop/layout.tsx
 * NOT used by the app — read this to learn how the real file works
 */
// Import React — core UI library (components, hooks, JSX)
import { Suspense } from 'react';
// (blank line — separates logical blocks for readability)
// Named export constant — shared config/data imported elsewhere
export const metadata = {
  // Property or array item — trailing comma allowed in TypeScript
  title: 'Shop',
  // Line 5: description:
  description:
    // Property or array item — trailing comma allowed in TypeScript
    'Browse premium halal chicken, beef, lamb, and fish. Customized cuts delivered fresh to your door.',
// Closing brace — end of block (function, if, object, JSX)
};
// (blank line — separates logical blocks for readability)
// Default export — main component/page Next.js or other files import
export default function ShopLayout({
  // Property or array item — trailing comma allowed in TypeScript
  children,
// Closing brace — end of block (function, if, object, JSX)
}: {
  // Line 12: children: React.ReactNode;
  children: React.ReactNode;
// Closing brace — end of block (function, if, object, JSX)
}) {
  // Return value from function
  return <Suspense fallback={<ShopLoading />}>{children}</Suspense>;
// Closing brace — end of block (function, if, object, JSX)
}
// (blank line — separates logical blocks for readability)
// Function declaration — reusable logic in this file
function ShopLoading() {
  // Return JSX — describes UI tree React renders to the DOM
  return (
    // JSX element — HTML-like tag becomes React component in browser
    <div className="flex min-h-[50vh] items-center justify-center">
      // JSX element — HTML-like tag becomes React component in browser
      <div className="h-8 w-8 animate-spin rounded-full border-4 border-brand-200 border-t-brand-700" />
    // JSX element — HTML-like tag becomes React component in browser
    </div>
  // Line 22: );
  );
// Closing brace — end of block (function, if, object, JSX)
}