/**
 * Forum React Island Entry Point
 *
 * Auto-detects which forum page mount-point is present in the DOM
 * and renders the corresponding React component with server-provided props.
 */

import React from 'react'
import { createRoot } from 'react-dom/client'

const MOUNTS = [
  { rootId: 'forum-index-root',       propsId: 'forum-index-props',       loader: () => import('./Pages/Forum/ForumIndex') },
  { rootId: 'forum-section-root',     propsId: 'forum-section-props',     loader: () => import('./Pages/Forum/ForumSection') },
  { rootId: 'forum-category-root',    propsId: 'forum-category-props',    loader: () => import('./Pages/Forum/ForumCategory') },
  { rootId: 'forum-thread-root',      propsId: 'forum-thread-props',      loader: () => import('./Pages/Forum/ForumThread') },
  { rootId: 'forum-new-thread-root',  propsId: 'forum-new-thread-props',  loader: () => import('./Pages/Forum/ForumNewThread') },
  { rootId: 'forum-edit-post-root',   propsId: 'forum-edit-post-props',   loader: () => import('./Pages/Forum/ForumEditPost') },
]

for (const { rootId, propsId, loader } of MOUNTS) {
  const el = document.getElementById(rootId)
  if (!el) continue

  let props = {}
  try {
    const propsEl = document.getElementById(propsId)
    props = propsEl ? JSON.parse(propsEl.textContent || '{}') : {}
  } catch {
    props = {}
  }

  loader().then((mod) => {
    const Component = mod.default
    createRoot(el).render(<Component {...props} />)
  })

  break // Only one forum page per request
}