"use client";

import { useSearchParams } from "next/navigation";
import { Suspense } from "react";
import { ChatPanel } from "@/components/ChatPanel";

function ChatContent() {
  const searchParams = useSearchParams();
  const userId = searchParams.get("user");

  return (
    <div className="h-[calc(100dvh-7rem)] md:h-[calc(100dvh-3.5rem)]">
      <ChatPanel dmUserId={userId} />
    </div>
  );
}

export default function ChatPage() {
  return (
    <Suspense fallback={<div className="p-4 text-muted-foreground">Loading chat...</div>}>
      <ChatContent />
    </Suspense>
  );
}