86 lines · 2.6 KB · TypeScript
RawDownload
import { createFileRoute, useNavigate } from "@tanstack/react-router";import { useEffect, useMemo } from "react";import ChatView from "../components/ChatView";import { threadHasStarted } from "../components/ChatView.logic";import { useComposerDraftStore, DraftId } from "../composerDraftStore";import { SidebarInset } from "../components/ui/sidebar";import { createThreadSelectorAcrossEnvironments } from "../storeSelectors";import { useStore } from "../store";import { buildThreadRouteParams } from "../threadRoutes"; function DraftChatThreadRouteView() {  const navigate = useNavigate();  const { draftId: rawDraftId } = Route.useParams();  const draftId = DraftId.make(rawDraftId);  const draftSession = useComposerDraftStore((store) => store.getDraftSession(draftId));  const serverThread = useStore(    useMemo(      () => createThreadSelectorAcrossEnvironments(draftSession?.threadId ?? null),      [draftSession?.threadId],    ),  );  const serverThreadStarted = threadHasStarted(serverThread);  const canonicalThreadRef = useMemo(    () =>      draftSession?.promotedTo        ? serverThreadStarted          ? draftSession.promotedTo          : null        : serverThread          ? {              environmentId: serverThread.environmentId,              threadId: serverThread.id,            }          : null,    [draftSession?.promotedTo, serverThread, serverThreadStarted],  );   useEffect(() => {    if (!canonicalThreadRef) {      return;    }    void navigate({      to: "/$environmentId/$threadId",      params: buildThreadRouteParams(canonicalThreadRef),      replace: true,    });  }, [canonicalThreadRef, navigate]);   useEffect(() => {    if (draftSession || canonicalThreadRef) {      return;    }    void navigate({ to: "/", replace: true });  }, [canonicalThreadRef, draftSession, navigate]);   if (canonicalThreadRef) {    return (      <SidebarInset className="h-svh min-h-0 overflow-hidden overscroll-y-none bg-background text-foreground md:h-dvh">        <ChatView          environmentId={canonicalThreadRef.environmentId}          threadId={canonicalThreadRef.threadId}          routeKind="server"        />      </SidebarInset>    );  }   if (!draftSession) {    return null;  }   return (    <SidebarInset className="h-svh min-h-0 overflow-hidden overscroll-y-none bg-background text-foreground md:h-dvh">      <ChatView        draftId={draftId}        environmentId={draftSession.environmentId}        threadId={draftSession.threadId}        routeKind="draft"      />    </SidebarInset>  );} export const Route = createFileRoute("/_chat/draft/$draftId")({  component: DraftChatThreadRouteView,});