"use client";

import dynamic from "next/dynamic";

const WhiteboardCanvas = dynamic(
  () => import("@/components/whiteboard/canvas").then((m) => m.WhiteboardCanvas),
  { ssr: false, loading: () => <div className="flex h-full items-center justify-center text-muted-foreground">Loading whiteboard...</div> },
);

export default function WhiteboardsPage() {
  return (
    <div className="flex h-full flex-col">
      <div className="shrink-0 border-b border-border px-6 py-3">
        <h1 className="text-lg font-semibold">Whiteboard</h1>
      </div>
      <div className="flex-1">
        <WhiteboardCanvas className="h-full" />
      </div>
    </div>
  );
}