"use client";

import { Suspense } from "react";

import { MobileShell } from "@/app/_components/core";
import { ChatScreen } from "@/app/chat/chat-screen";

export default function ChatPage() {
  return (
    <Suspense fallback={<ChatFallback />}>
      <ChatScreen />
    </Suspense>
  );
}

function ChatFallback() {
  return (
    <MobileShell background="#111111">
      <div
        style={{
          minHeight: "60vh",
          display: "grid",
          placeItems: "center",
          color: "rgba(255, 255, 255, 0.72)",
        }}
      >
        Loading chat...
      </div>
    </MobileShell>
  );
}
