feat(web): Show user chat history

packages/web/src/app/[domain]/chat/page.tsx

@@ -1,6 +1,6 @@
 import { getRepos, getReposStats, getSearchContexts } from "@/actions";
 import { SourcebotLogo } from "@/app/components/sourcebotLogo";
-import { getConfiguredLanguageModelsInfo } from "@/features/chat/actions";
+import { getConfiguredLanguageModelsInfo, getUserChatHistory } from "@/features/chat/actions";
 import { CustomSlateEditor } from "@/features/chat/customSlateEditor";
 import { ServiceErrorException } from "@/lib/serviceError";
 import { isServiceError, measure } from "@/lib/utils";
@@ -12,6 +12,10 @@ import { DemoCards } from "./components/demoCards";
 import { env } from "@sourcebot/shared";
 import { loadJsonFile } from "@sourcebot/shared";
 import { DemoExamples, demoExamplesSchema } from "@/types";
+import { auth } from "@/auth";
+import { ResizablePanel, ResizablePanelGroup } from "@/components/ui/resizable";
+import { ChatSidePanel } from "./components/chatSidePanel";
+import { AnimatedResizableHandle } from "@/components/ui/animatedResizableHandle";
 
 interface PageProps {
     params: Promise<{
@@ -24,6 +28,8 @@ export default async function Page(props: PageProps) {
     const languageModels = await getConfiguredLanguageModelsInfo();
     const searchContexts = await getSearchContexts(params.domain);
     const allRepos = await getRepos();
+    const session = await auth();
+    const chatHistory = session ? await getUserChatHistory() : [];
 
     const carouselRepos = await getRepos({
         where: {
@@ -52,6 +58,10 @@ export default async function Page(props: PageProps) {
         throw new ServiceErrorException(repoStats);
     }
 
+    if (isServiceError(chatHistory)) {
+        throw new ServiceErrorException(chatHistory);
+    }
+
     const demoExamples = env.SOURCEBOT_DEMO_EXAMPLES_PATH ? await (async () => {
         try {
             return (await measure(() => loadJsonFile<DemoExamples>(env.SOURCEBOT_DEMO_EXAMPLES_PATH!, demoExamplesSchema), 'loadExamplesJsonFile')).data;
@@ -62,45 +72,60 @@ export default async function Page(props: PageProps) {
     })() : undefined;
 
     return (
-        <div className="flex flex-col items-center overflow-hidden min-h-screen">
+        <div className="flex flex-col items-center overflow-hidden h-screen">
             <NavigationMenu
                 domain={params.domain}
             />
+            <ResizablePanelGroup
+                direction="horizontal"
+            >
+                <ChatSidePanel
+                    order={1}
+                    chatHistory={chatHistory}
+                    isAuthenticated={!!session}
+                    isCollapsedInitially={true}
+                />
+                <AnimatedResizableHandle />
+                <ResizablePanel 
+                    order={2}
+                    id="chat-home-panel"
+                    defaultSize={85}
+                >
+                <div className="flex flex-col justify-center items-center mt-8 mb-8 md:mt-18 w-full px-5">
+                    <div className="max-h-44 w-auto">
+                        <SourcebotLogo
+                            className="h-18 md:h-40 w-auto"
+                        />
+                    </div>
+                    <CustomSlateEditor>
+                        <LandingPageChatBox
+                            languageModels={languageModels}
+                            repos={allRepos}
+                            searchContexts={searchContexts}
+                        />
+                    </CustomSlateEditor>
 
-            <div className="flex flex-col justify-center items-center mt-8 mb-8 md:mt-18 w-full px-5">
-                <div className="max-h-44 w-auto">
-                    <SourcebotLogo
-                        className="h-18 md:h-40 w-auto"
-                    />
-                </div>
-                <CustomSlateEditor>
-                    <LandingPageChatBox
-                        languageModels={languageModels}
-                        repos={allRepos}
-                        searchContexts={searchContexts}
-                    />
-                </CustomSlateEditor>
-
-                <div className="mt-8">
-                    <RepositoryCarousel
-                        numberOfReposWithIndex={repoStats.numberOfReposWithIndex}
-                        displayRepos={carouselRepos}
-                    />
-                </div>
-
-                {demoExamples && (
-                    <>
-                        <div className="flex flex-col items-center w-fit gap-6">
-                            <Separator className="mt-5 w-[700px]" />
-                        </div>
-
-                        <DemoCards
-                            demoExamples={demoExamples}
+                    <div className="mt-8">
+                        <RepositoryCarousel
+                            numberOfReposWithIndex={repoStats.numberOfReposWithIndex}
+                            displayRepos={carouselRepos}
                         />
-                    </>
-                )}
+                    </div>
 
-            </div>
+                    {demoExamples && (
+                        <>
+                            <div className="flex flex-col items-center w-fit gap-6">
+                                <Separator className="mt-5 w-[700px]" />
+                            </div>
+
+                            <DemoCards
+                                demoExamples={demoExamples}
+                            />
+                        </>
+                    )}
+                </div>
+                </ResizablePanel>
+            </ResizablePanelGroup>
         </div>
     )
 }