// Renders stored blocks via their registry component. Used by the public page
// route, the draft preview, and (recursively) the two_column block. Kept
// separate from the registry so both the renderer and the builder can import it.
// Import the lookup from the registry directly (not ./index) to avoid a cycle:
// index → types/twoColumn → BlockRenderer. The page route/builder import ./index,
// which registers every block before anything renders.
import { getBlock } from './registry.js'

/**
 * Render one block. A block with `visible === false` renders nothing (admins
 * hide blocks without deleting them). An unknown type also renders nothing —
 * server validation prevents storing one, so this only guards a client/server
 * registry skew rather than crashing the whole page.
 */
export default function BlockRenderer({ block }) {
  if (!block || block.visible === false) return null
  const def = getBlock(block.type)
  if (!def || !def.component) return null
  const Component = def.component
  return <Component props={block.props || {}} block={block} />
}

/** Render an ordered array of blocks (array position = display order). */
export function BlockList({ blocks }) {
  return (blocks || []).map((block) => <BlockRenderer key={block.id} block={block} />)
}