Function Chat

src/frontend/src/pages/chat/Chat.tsx:18–355

()

import { VectorSettings } from "../../components/VectorSettings";

const Chat = () => {
    const [isConfigPanelOpen, setIsConfigPanelOpen] = useState(false);
    const [promptTemplate, setPromptTemplate] = useState<string>("");
    const [temperature, setTemperature] = useState<number>(0.3);
    const [retrieveCount, setRetrieveCount] = useState<number>(3);
    const [retrievalMode, setRetrievalMode] = useState<RetrievalMode>(RetrievalMode.Hybrid);
    const [useAdvancedFlow, setUseAdvancedFlow] = useState<boolean>(true);
    const [shouldStream, setShouldStream] = useState<boolean>(true);

    const lastQuestionRef = useRef<string>("");
    const chatMessageStreamEnd = useRef<HTMLDivElement | null>(null);

    const [isLoading, setIsLoading] = useState<boolean>(false);
    const [isStreaming, setIsStreaming] = useState<boolean>(false);
    const [error, setError] = useState<unknown>();

    const [activeCitation, setActiveCitation] = useState<string>();
    const [activeAnalysisPanelTab, setActiveAnalysisPanelTab] = useState<AnalysisPanelTabs | undefined>(undefined);

    const [selectedAnswer, setSelectedAnswer] = useState<number>(0);
    const [answers, setAnswers] = useState<[user: string, response: RAGChatCompletion][]>([]);
    const [streamedAnswers, setStreamedAnswers] = useState<[user: string, response: RAGChatCompletion][]>([]);

    const handleAsyncRequest = async (question: string, answers: [string, RAGChatCompletion][], responseBody: ReadableStream<Uint8Array>) => {
        let answer = "";
        let chatCompletion: RAGChatCompletion = {
            context: {
                data_points: {},
                thoughts: []
            },
            output_text: ""
        };
        const updateState = (newContent: string) => {
            return new Promise(resolve => {
                setTimeout(() => {
                    answer += newContent;
                    const latestCompletion: RAGChatCompletion = {
                        ...chatCompletion,
                        output_text: answer
                    };
                    setStreamedAnswers([...answers, [question, latestCompletion]]);
                    resolve(null);
                }, 33);
            });
        };
        try {
            setIsStreaming(true);
            for await (const event of readNDJSONStream<RAGChatCompletionDelta>(responseBody)) {
                if (event.error) {
                    throw new Error(event.error);
                }
                if (event.type === "response.context" && event.context) {
                    chatCompletion.context = { ...chatCompletion.context, ...event.context };
                } else if (event.type === "response.output_text.delta" && event.delta !== undefined) {
                    setIsLoading(false);
                    await updateState(event.delta);
                }
            }