"use client"

import dynamic from "next/dynamic"
import type { Manual, ManualGroup } from "@/lib/manuals-types"

const ManualsPageClient = dynamic(
  () => import("@/components/manuals-page-client").then((mod) => mod.ManualsPageClient),
  {
    ssr: false,
    loading: () => (
      <div className="rounded-lg border border-border bg-card p-6 text-sm text-muted-foreground">
        Loading manual browser...
      </div>
    ),
  }
)

interface ManualsPageShellProps {
  manuals: Manual[]
  groupedManuals: ManualGroup[]
  manufacturers: string[]
  categories: string[]
}

export function ManualsPageShell(props: ManualsPageShellProps) {
  return <ManualsPageClient {...props} />
}