quivr/frontend/app/chat/[chatId]/page.tsx

"use client";

import { useTranslation } from "react-i18next";
 
import PageHeading from "@/lib/components/ui/PageHeading";
import { useBrainContext } from "@/lib/context/BrainProvider/hooks/useBrainContext";
import { ChatProvider } from "@/lib/context/ChatProvider";

import { ChatInput, ChatMessages } from "./components";

const SelectedChatPage = (): JSX.Element => {
  const { currentBrain } = useBrainContext();
  const { t } = useTranslation(['chat']);

  return (
    <main className="flex flex-col w-full pt-10" data-testid="chat-page">
      <section className="flex flex-col flex-1 items-center w-full h-full min-h-[70vh]">
        <PageHeading
          title={t('title',{ brain: currentBrain?.name, ns: 'chat'})}
          subtitle= {t('subtitle',{ ns: 'chat'})}
        />
        <ChatProvider>
          <div className="relative w-full flex flex-col flex-1 items-center">
            <div className="flex-1 w-full flex flex-col items-center">
              <ChatMessages />
            </div>
            <ChatInput />
          </div>
        </ChatProvider>
      </section>
    </main>
  );
};

export default SelectedChatPage;