10589112778

Committed 28 Aug 2024 02:27AM UTC coverage: 32.014% (-0.001%) from 32.015%

Build # 10589112778

Build Type

Pull #9645

github

Committed by

b0b3rt

Commit Message

fix llm conversations state management for new conversations

Pull Request Pull Request #9645: fix llm conversations state management for new conversations

Run Details

5020 of 40798 branches covered (12.3%)

Branch coverage included in aggregate %.

0 of 31 new or added lines in 2 files covered. (0.0%)

1 existing line in 1 file now uncovered.

29214 of 66138 relevant lines covered (44.17%)

189.31 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

5.96

/packages/lesswrong/components/languageModels/LlmChatWrapper.tsx

import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { registerComponent } from '../../lib/vulcan-lib';
import { useMulti } from '@/lib/crud/withMulti';
import { useCurrentUser } from '../common/withUser';
import sortBy from 'lodash/sortBy';
import { useSingle } from '@/lib/crud/withSingle';
import { useUpdate } from '@/lib/crud/withUpdate';
import keyBy from 'lodash/keyBy';
import { randomId } from '@/lib/random';

export interface ClientMessage {
  conversationId: string | null
  userId: string
  content: string
}

type LlmStreamContent = {
  conversationId: string;
  content: string;
  previousUserMessage?: {
    _id: string;
    content: string;
    userId: string;
    role: 'user';
    /** Stringified date */
    createdAt: string;
  };
};

type LlmStreamEnd = {
  conversationId: string;
};

export type LlmCreateConversationMessage = {
  eventType: 'llmCreateConversation';
  title: string;
  conversationId: string;
  /** Stringified date */
  createdAt: string;
  userId: string;
  channelId: string;
}

export type LlmStreamContentMessage = {
  eventType: 'llmStreamContent',
  data: LlmStreamContent
};

export type LlmStreamEndMessage = {
  eventType: 'llmStreamEnd',
  data: LlmStreamEnd
};

export type LlmStreamMessage = LlmCreateConversationMessage | LlmStreamContentMessage | LlmStreamEndMessage;

interface PromptContextOptions {
  postId?: string,
  useRag?: boolean
  includeComments?: boolean
}

type NewLlmMessage = Pick<LlmMessagesFragment, 'userId' | 'role' | 'content'> & { conversationId?: string };
type PreSaveLlmMessage = Omit<NewLlmMessage, 'role'>;
type NewLlmConversation = Pick<LlmConversationsWithMessagesFragment, 'userId'|'createdAt'|'lastUpdatedAt'> & { _id: string, title?: string, messages: NewLlmMessage[] };
type LlmConversationWithPartialMessages = LlmConversationsFragment & { messages: Array<LlmMessagesFragment | NewLlmMessage> };
type LlmConversation = NewLlmConversation | LlmConversationWithPartialMessages;
type LlmConversationsDict = Record<string, LlmConversation>;

interface LlmChatContextType {
  orderedConversations: LlmConversation[];
  currentConversation?: LlmConversation;
  currentConversationLoading: boolean;
  submitMessage: (query: string, currentPostId?: string) => void;
  setCurrentConversation: (conversationId?: string) => void;
  archiveConversation: (conversationId: string) => void;
}

export const LlmChatContext = React.createContext<LlmChatContextType|null>(null);

export const useLlmChat = (): LlmChatContextType => {
  const result = React.useContext(LlmChatContext);
  if (!result) throw new Error("useLlmChat called but not a descendent of LlmChatWrapper");
  return result;
}


const LlmChatWrapper = ({children}: {
  children: React.ReactNode
}) => {

  const currentUser = useCurrentUser();

  const { mutate: updateConversation } = useUpdate({
    collectionName: "LlmConversations",
    fragmentName: "LlmConversationsFragment"
  })

  const { results: userLlmConversations } = useMulti({
    collectionName: "LlmConversations",
    fragmentName: "LlmConversationsFragment",
    terms: { view: "llmConversationsWithUser", userId: currentUser?._id },
    skip: !currentUser,
    enableTotal: false,
  });

  const userLlmConversationsDict = useMemo(() => {
    const conversationsWithMessagesArray = userLlmConversations?.map((conversation) => ({...conversation, messages: []})) 
    return keyBy(conversationsWithMessagesArray, '_id');
  }, [userLlmConversations]);

  const [loadingConversationIds, setLoadingConversationIds] = useState<string[]>([]);
  const [conversations, setConversations] = useState<LlmConversationsDict>(userLlmConversationsDict);

  const sortedConversations = useMemo(() => {
    const llmConversationsList = conversations ? Object.values(conversations) : [];
    return sortBy(llmConversationsList, (conversation) => -(conversation.lastUpdatedAt ?? conversation.createdAt));
  }, [conversations]);

  const [currentConversationId, setCurrentConversationId] = useState<string | undefined>(sortedConversations[0]?._id);

  const { document: currentConversationWithMessages } = useSingle({
    collectionName: "LlmConversations",
    fragmentName: "LlmConversationsWithMessagesFragment",
    documentId: currentConversationId,
    skip: !currentConversationId,
  });

  const currentConversationLoading = useMemo(() => (
    !!currentConversationId && loadingConversationIds.includes(currentConversationId)
  ), [currentConversationId, loadingConversationIds]);

  const currentConversation = useMemo(() => (
    currentConversationId ? conversations[currentConversationId] : undefined
  ), [conversations, currentConversationId]);

  const setConversationLoadingState = useCallback((conversationId: string, loading: boolean) => {
    setLoadingConversationIds((loadingConversationIds) => {
      const conversationInLoadingState = loadingConversationIds.includes(conversationId);
      let updatedLoadingConversationIds: string[] | undefined = undefined;
      if (loading && !conversationInLoadingState) {
        updatedLoadingConversationIds = [...loadingConversationIds, conversationId];
      } else if (!loading && conversationInLoadingState) {
        updatedLoadingConversationIds = loadingConversationIds.filter(id => conversationId !== id);
      }
  
      if (updatedLoadingConversationIds) {
        return updatedLoadingConversationIds;
      } else {
        return loadingConversationIds;
      }
    });
  }, []);

  // TODO: maybe break this out into separate update operations
  const updateConversationById = useCallback((updatedConversation: LlmConversation | LlmConversationsWithMessagesFragment) => {
    setConversations((conversations) => ({ ...conversations, [updatedConversation._id]: updatedConversation }));
  }, []);

  const hydrateNewConversation = useCallback((newConversationEvent: LlmCreateConversationMessage) => {
    const { title, conversationId, createdAt, userId, channelId } = newConversationEvent;
    setConversations((conversations) => {
      const { [channelId]: { messages }, ...rest } = conversations;

      const hydratedConversation: LlmConversationWithPartialMessages = {
        _id: conversationId,
        title,
        messages,
        createdAt: new Date(createdAt),
        deleted: false,
        lastUpdatedAt: new Date(createdAt),
        userId
      };
  
      return { [conversationId]: hydratedConversation, ...rest };
    });

    setCurrentConversationId(conversationId);
    setConversationLoadingState(conversationId, true);
  }, [setConversationLoadingState]);
  
  const handleLlmStreamContent = useCallback((message: LlmStreamContentMessage) => {
    if (!currentUser) {
      return;
    }

    const { conversationId, content, previousUserMessage } = message.data;

    setConversations((conversations) => {
      const streamConversation = conversations[conversationId];
      const updatedMessages = [...streamConversation.messages];
      const lastMessageInConversation = updatedMessages.slice(-1)[0];
      const lastClientMessageIsAssistant = lastMessageInConversation?.role === 'assistant';
  
      const newMessage: NewLlmMessage = { 
        conversationId,
        userId: currentUser._id,
        // TODO: pass back role through stream, maybe even the whole message object?
        role: "assistant", 
        content,
      };
      
      // previousUserMessage only gets sent with the first stream event for any given message response
      if (previousUserMessage && lastClientMessageIsAssistant) {
        updatedMessages.push(previousUserMessage, newMessage);
      } else {
        // Since we're sending an aggregate buffer rather than diffs, we need to replace the last message in the conversation each time we get one (after the first time)
        if (lastClientMessageIsAssistant) {
          updatedMessages.pop();
        }
        updatedMessages.push(newMessage);
      }
  
      const updatedConversation = { ...streamConversation, messages: updatedMessages };
      
      return { ...conversations, [updatedConversation._id]: updatedConversation };
    });

    setConversationLoadingState(conversationId, false);
  }, [currentUser, setConversationLoadingState]);

  const handleClaudeResponseMesage = useCallback((message: LlmStreamMessage) => {
    switch (message.eventType) {
      case "llmCreateConversation":
        hydrateNewConversation(message);
        break;
      case "llmStreamContent":
        handleLlmStreamContent(message);
        break;
      case "llmStreamEnd":
        setConversationLoadingState(message.data.conversationId, false);
        break;
    }
  }, [hydrateNewConversation, handleLlmStreamContent, setConversationLoadingState]);
  
  const sendClaudeMessage = useCallback(async ({newMessage, promptContextOptions, newConversationChannelId}: {
    newMessage: ClientMessage,
    promptContextOptions: PromptContextOptions,
    newConversationChannelId?: string
  }) => {
    const response = await fetch("/api/sendLlmChat", {
      method: "POST",
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({ newMessage, promptContextOptions, newConversationChannelId }),
    });
    if (!response.body) {
      return; // TODO better error handling
    }
    const reader = response.body.getReader();
    const decoder = new TextDecoder();
    let buffer = '';

    // eslint-disable-next-line no-constant-condition
    while (true) {
      const { done, value } = await reader.read();
      if (done) break;

      buffer += decoder.decode(value, { stream: true });

      let boundary;
      while ((boundary = buffer.indexOf('\n\n')) !== -1) {
        const line = buffer.slice(0, boundary);
        buffer = buffer.slice(boundary + 2);

        if (line.startsWith('data: ')) {
          let message: LlmStreamMessage|null = null
          try {
            message = JSON.parse(line.slice("data: ".length));
          } catch (error) {
            // eslint-disable-next-line no-console
            console.error('Error parsing JSON:', error);
          }
          if (message) {
            handleClaudeResponseMesage(message);
          }
        }
      }
    }
    // Handle any remaining data in the buffer
    if (buffer.startsWith('data: ')) {
      let message: LlmStreamMessage|null = null
      try {
        message = JSON.parse(buffer.slice("data: ".length));
      } catch (error) {
        // eslint-disable-next-line no-console
        console.error('Error parsing JSON:', error);
      }
      if (message) {
        handleClaudeResponseMesage(message);
      }
    }
    
  }, [handleClaudeResponseMesage]);

  // TODO: Ensure code is sanitized against injection attacks
  const submitMessage = useCallback(async (query: string, currentPostId?: string) => {
    if (!currentUser) {
      return;
    }

    const newConversationChannelId = randomId();
    const isExistingConversation = !!currentConversation;

    const preSaveConversation = {
      _id: newConversationChannelId,
      userId: currentUser._id,
      messages: [],
      createdAt: new Date(),
      lastUpdatedAt: new Date()
    };

    const displayedConversation = isExistingConversation
      ? currentConversation
      : preSaveConversation;

    // Sent to the server to create a new message
    const preSaveMessage: PreSaveLlmMessage = {
      conversationId: currentConversation?._id,
      userId: currentUser._id,
      content: query
    };

    setConversations((conversations) => {
      // We don't send the role to the server
      const newClientMessage: NewLlmMessage = { ...preSaveMessage, role: 'user' };
      const updatedMessages = [...displayedConversation.messages ?? [], newClientMessage];
      const conversationWithNewUserMessage: LlmConversation = { ...displayedConversation, messages: updatedMessages };

      return { ...conversations, [conversationWithNewUserMessage._id]: conversationWithNewUserMessage };
    });


    // Update Client Display
    setConversationLoadingState(displayedConversation._id, true);

    if (!isExistingConversation) {
      setCurrentConversationId(newConversationChannelId);
    }

    const promptContextOptions: PromptContextOptions = { postId: currentPostId, includeComments: true /* TODO: this currently doesn't do anything; it's hardcoded on the server */ };

    void sendClaudeMessage({
      newMessage: {
        ...preSaveMessage,
        conversationId: preSaveMessage.conversationId ?? null,
      },
      promptContextOptions,
      ...(isExistingConversation ? {} : { newConversationChannelId }),
    });
  }, [currentUser, currentConversation, sendClaudeMessage, setConversationLoadingState]);

  const setCurrentConversation = useCallback(setCurrentConversationId, [setCurrentConversationId]);

  const archiveConversation = useCallback(async (conversationId: string) => {
    if (!currentUser) {
      return;
    }

    if (currentConversationId === conversationId) {
      setCurrentConversationId(undefined);
    }

    // remove conversation with this id from conversations object
    setConversations((conversations) => {
      const { [conversationId]: _, ...rest } = conversations;
      return rest;
    });

    void updateConversation({
      selector: { _id: conversationId },
      data: {
        deleted: true
      }
    })
  }, [currentUser, currentConversationId, updateConversation]);

  useEffect(() => {
    if (currentConversationWithMessages) {
      setConversations((conversations) => {
        const clientSideConversationState = conversations[currentConversationWithMessages._id];
        if (currentConversationWithMessages.messages.length > clientSideConversationState.messages.length) {
          return { ...conversations, [currentConversationWithMessages._id]: currentConversationWithMessages };
        }

        return conversations;
      });
    }
  }, [currentConversationWithMessages]);

  const llmChatContext = useMemo((): LlmChatContextType => ({
    currentConversation,
    currentConversationLoading,
    orderedConversations: sortedConversations,
    submitMessage,
    setCurrentConversation,
    archiveConversation,
  }), [submitMessage, setCurrentConversation, archiveConversation, currentConversationLoading, currentConversation, sortedConversations]);

  return <LlmChatContext.Provider value={llmChatContext}>
    {children}
  </LlmChatContext.Provider>
}

const LlmChatWrapperComponent = registerComponent("LlmChatWrapper", LlmChatWrapper);

declare global {
  interface ComponentTypes {
    LlmChatWrapper: typeof LlmChatWrapperComponent
  }
}

1	import React, { useCallback, useEffect, useMemo, useState } from 'react';	3✔
2	import { registerComponent } from '../../lib/vulcan-lib';	1✔
3	import { useMulti } from '@/lib/crud/withMulti';	1✔
4	import { useCurrentUser } from '../common/withUser';	1✔
5	import sortBy from 'lodash/sortBy';	1✔
6	import { useSingle } from '@/lib/crud/withSingle';	1✔
7	import { useUpdate } from '@/lib/crud/withUpdate';	1✔
8	import keyBy from 'lodash/keyBy';	1✔
9	import { randomId } from '@/lib/random';	1✔
10
11	export interface ClientMessage {
12	conversationId: string \| null
13	userId: string
14	content: string
15	}
16
17	type LlmStreamContent = {
18	conversationId: string;
19	content: string;
20	previousUserMessage?: {
21	_id: string;
22	content: string;
23	userId: string;
24	role: 'user';
25	/** Stringified date */
26	createdAt: string;
27	};
28	};
29
30	type LlmStreamEnd = {
31	conversationId: string;
32	};
33
34	export type LlmCreateConversationMessage = {
35	eventType: 'llmCreateConversation';
36	title: string;
37	conversationId: string;
38	/** Stringified date */
39	createdAt: string;
40	userId: string;
41	channelId: string;
42	}
43
44	export type LlmStreamContentMessage = {
45	eventType: 'llmStreamContent',
46	data: LlmStreamContent
47	};
48
49	export type LlmStreamEndMessage = {
50	eventType: 'llmStreamEnd',
51	data: LlmStreamEnd
52	};
53
54	export type LlmStreamMessage = LlmCreateConversationMessage \| LlmStreamContentMessage \| LlmStreamEndMessage;
55
56	interface PromptContextOptions {
57	postId?: string,
58	useRag?: boolean
59	includeComments?: boolean
60	}
61
62	type NewLlmMessage = Pick<LlmMessagesFragment, 'userId' \| 'role' \| 'content'> & { conversationId?: string };
63	type PreSaveLlmMessage = Omit<NewLlmMessage, 'role'>;
64	type NewLlmConversation = Pick<LlmConversationsWithMessagesFragment, 'userId'\|'createdAt'\|'lastUpdatedAt'> & { _id: string, title?: string, messages: NewLlmMessage[] };
65	type LlmConversationWithPartialMessages = LlmConversationsFragment & { messages: Array<LlmMessagesFragment \| NewLlmMessage> };
66	type LlmConversation = NewLlmConversation \| LlmConversationWithPartialMessages;
67	type LlmConversationsDict = Record<string, LlmConversation>;
68
69	interface LlmChatContextType {
70	orderedConversations: LlmConversation[];
71	currentConversation?: LlmConversation;
72	currentConversationLoading: boolean;
73	submitMessage: (query: string, currentPostId?: string) => void;
74	setCurrentConversation: (conversationId?: string) => void;
75	archiveConversation: (conversationId: string) => void;
76	}
77
78	export const LlmChatContext = React.createContext<LlmChatContextType\|null>(null);	1✔
79
80	export const useLlmChat = (): LlmChatContextType => {	1✔
81	const result = React.useContext(LlmChatContext);	×
82	if (!result) throw new Error("useLlmChat called but not a descendent of LlmChatWrapper");	×
83	return result;	×
84	}
85
86
87	const LlmChatWrapper = ({children}: {	1✔
88	children: React.ReactNode
89	}) => {
90
91	const currentUser = useCurrentUser();	×
92
93	const { mutate: updateConversation } = useUpdate({	×
94	collectionName: "LlmConversations",
95	fragmentName: "LlmConversationsFragment"
96	})
97
98	const { results: userLlmConversations } = useMulti({	×
99	collectionName: "LlmConversations",
100	fragmentName: "LlmConversationsFragment",
101	terms: { view: "llmConversationsWithUser", userId: currentUser?._id },	×
102	skip: !currentUser,
103	enableTotal: false,
104	});
105
106	const userLlmConversationsDict = useMemo(() => {	×
107	const conversationsWithMessagesArray = userLlmConversations?.map((conversation) => ({...conversation, messages: []}))	×
108	return keyBy(conversationsWithMessagesArray, '_id');	×
109	}, [userLlmConversations]);
110
111	const [loadingConversationIds, setLoadingConversationIds] = useState<string[]>([]);	×
112	const [conversations, setConversations] = useState<LlmConversationsDict>(userLlmConversationsDict);	×
113
114	const sortedConversations = useMemo(() => {	×
115	const llmConversationsList = conversations ? Object.values(conversations) : [];	×
116	return sortBy(llmConversationsList, (conversation) => -(conversation.lastUpdatedAt ?? conversation.createdAt));	×
117	}, [conversations]);
118
119	const [currentConversationId, setCurrentConversationId] = useState<string \| undefined>(sortedConversations[0]?._id);	×
120
121	const { document: currentConversationWithMessages } = useSingle({	×
122	collectionName: "LlmConversations",
123	fragmentName: "LlmConversationsWithMessagesFragment",
124	documentId: currentConversationId,
125	skip: !currentConversationId,
126	});
127
128	const currentConversationLoading = useMemo(() => (	×
129	!!currentConversationId && loadingConversationIds.includes(currentConversationId)	×
130	), [currentConversationId, loadingConversationIds]);
131
132	const currentConversation = useMemo(() => (	×
133	currentConversationId ? conversations[currentConversationId] : undefined	×
134	), [conversations, currentConversationId]);
135
136	const setConversationLoadingState = useCallback((conversationId: string, loading: boolean) => {	×
137	setLoadingConversationIds((loadingConversationIds) => {	×
138	const conversationInLoadingState = loadingConversationIds.includes(conversationId);	×
139	let updatedLoadingConversationIds: string[] \| undefined = undefined;	×
140	if (loading && !conversationInLoadingState) {	×
141	updatedLoadingConversationIds = [...loadingConversationIds, conversationId];	×
142	} else if (!loading && conversationInLoadingState) {	×
143	updatedLoadingConversationIds = loadingConversationIds.filter(id => conversationId !== id);	×
144	}
145
146	if (updatedLoadingConversationIds) {	×
147	return updatedLoadingConversationIds;	×
148	} else {
149	return loadingConversationIds;	×
150	}
151	});
152	}, []);
153
154	// TODO: maybe break this out into separate update operations
155	const updateConversationById = useCallback((updatedConversation: LlmConversation \| LlmConversationsWithMessagesFragment) => {	×
156	setConversations((conversations) => ({ ...conversations, [updatedConversation._id]: updatedConversation }));	×
157	}, []);
158
159	const hydrateNewConversation = useCallback((newConversationEvent: LlmCreateConversationMessage) => {	×
160	const { title, conversationId, createdAt, userId, channelId } = newConversationEvent;	×
NEW 161	setConversations((conversations) => {	×
NEW 162	const { [channelId]: { messages }, ...rest } = conversations;	×
163
NEW 164	const hydratedConversation: LlmConversationWithPartialMessages = {	×
165	_id: conversationId,
166	title,
167	messages,
168	createdAt: new Date(createdAt),
169	deleted: false,
170	lastUpdatedAt: new Date(createdAt),
171	userId
172	};
173
NEW 174	return { [conversationId]: hydratedConversation, ...rest };	×
175	});
176
177	setCurrentConversationId(conversationId);	×
178	setConversationLoadingState(conversationId, true);	×
179	}, [setConversationLoadingState]);
180
181	const handleLlmStreamContent = useCallback((message: LlmStreamContentMessage) => {	×
182	if (!currentUser) {	×
183	return;	×
184	}
185
186	const { conversationId, content, previousUserMessage } = message.data;	×
187
NEW 188	setConversations((conversations) => {	×
NEW 189	const streamConversation = conversations[conversationId];	×
NEW 190	const updatedMessages = [...streamConversation.messages];	×
NEW 191	const lastMessageInConversation = updatedMessages.slice(-1)[0];	×
NEW 192	const lastClientMessageIsAssistant = lastMessageInConversation?.role === 'assistant';	×
193
NEW 194	const newMessage: NewLlmMessage = {	×
195	conversationId,
196	userId: currentUser._id,
197	// TODO: pass back role through stream, maybe even the whole message object?
198	role: "assistant",
199	content,
200	};
201
202	// previousUserMessage only gets sent with the first stream event for any given message response
NEW 203	if (previousUserMessage && lastClientMessageIsAssistant) {	×
NEW 204	updatedMessages.push(previousUserMessage, newMessage);	×
205	} else {
206	// Since we're sending an aggregate buffer rather than diffs, we need to replace the last message in the conversation each time we get one (after the first time)
NEW 207	if (lastClientMessageIsAssistant) {	×
NEW 208	updatedMessages.pop();	×
209	}
NEW 210	updatedMessages.push(newMessage);	×
211	}
212
NEW 213	const updatedConversation = { ...streamConversation, messages: updatedMessages };	×
214
NEW 215	return { ...conversations, [updatedConversation._id]: updatedConversation };	×
216	});
217
218	setConversationLoadingState(conversationId, false);	×
219	}, [currentUser, setConversationLoadingState]);
220
221	const handleClaudeResponseMesage = useCallback((message: LlmStreamMessage) => {	×
222	switch (message.eventType) {	×
223	case "llmCreateConversation":
224	hydrateNewConversation(message);	×
225	break;	×
226	case "llmStreamContent":
227	handleLlmStreamContent(message);	×
228	break;	×
229	case "llmStreamEnd":
230	setConversationLoadingState(message.data.conversationId, false);	×
231	break;	×
232	}
233	}, [hydrateNewConversation, handleLlmStreamContent, setConversationLoadingState]);
234
235	const sendClaudeMessage = useCallback(async ({newMessage, promptContextOptions, newConversationChannelId}: {	×
236	newMessage: ClientMessage,
237	promptContextOptions: PromptContextOptions,
238	newConversationChannelId?: string
239	}) => {
240	const response = await fetch("/api/sendLlmChat", {	×
241	method: "POST",
242	headers: {
243	'Content-Type': 'application/json',
244	},
245	body: JSON.stringify({ newMessage, promptContextOptions, newConversationChannelId }),
246	});
247	if (!response.body) {	×
248	return; // TODO better error handling	×
249	}
250	const reader = response.body.getReader();	×
251	const decoder = new TextDecoder();	×
252	let buffer = '';	×
253
254	// eslint-disable-next-line no-constant-condition
255	while (true) {	×
256	const { done, value } = await reader.read();	×
257	if (done) break;	×
258
259	buffer += decoder.decode(value, { stream: true });	×
260
261	let boundary;
262	while ((boundary = buffer.indexOf('\n\n')) !== -1) {	×
263	const line = buffer.slice(0, boundary);	×
264	buffer = buffer.slice(boundary + 2);	×
265
266	if (line.startsWith('data: ')) {	×
267	let message: LlmStreamMessage\|null = null	×
268	try {	×
269	message = JSON.parse(line.slice("data: ".length));	×
270	} catch (error) {
271	// eslint-disable-next-line no-console
272	console.error('Error parsing JSON:', error);	×
273	}
274	if (message) {	×
275	handleClaudeResponseMesage(message);	×
276	}
277	}
278	}
279	}
280	// Handle any remaining data in the buffer
281	if (buffer.startsWith('data: ')) {	×
282	let message: LlmStreamMessage\|null = null	×
283	try {	×
284	message = JSON.parse(buffer.slice("data: ".length));	×
285	} catch (error) {
286	// eslint-disable-next-line no-console
287	console.error('Error parsing JSON:', error);	×
288	}
289	if (message) {	×
290	handleClaudeResponseMesage(message);	×
291	}
292	}
293
294	}, [handleClaudeResponseMesage]);
295
296	// TODO: Ensure code is sanitized against injection attacks
297	const submitMessage = useCallback(async (query: string, currentPostId?: string) => {	×
298	if (!currentUser) {	×
299	return;	×
300	}
301
302	const newConversationChannelId = randomId();	×
303	const isExistingConversation = !!currentConversation;	×
304
305	const preSaveConversation = {	×
306	_id: newConversationChannelId,
307	userId: currentUser._id,
308	messages: [],
309	createdAt: new Date(),
310	lastUpdatedAt: new Date()
311	};
312
313	const displayedConversation = isExistingConversation	×
314	? currentConversation	×
315	: preSaveConversation;
316
317	// Sent to the server to create a new message
318	const preSaveMessage: PreSaveLlmMessage = {	×
319	conversationId: currentConversation?._id,	×
320	userId: currentUser._id,
321	content: query
322	};
323
NEW 324	setConversations((conversations) => {	×
325	// We don't send the role to the server
NEW 326	const newClientMessage: NewLlmMessage = { ...preSaveMessage, role: 'user' };	×
NEW 327	const updatedMessages = [...displayedConversation.messages ?? [], newClientMessage];	×
NEW 328	const conversationWithNewUserMessage: LlmConversation = { ...displayedConversation, messages: updatedMessages };	×
329
NEW 330	return { ...conversations, [conversationWithNewUserMessage._id]: conversationWithNewUserMessage };	×
331	});
332
333
334	// Update Client Display
335	setConversationLoadingState(displayedConversation._id, true);	×
336
UNCOV 337	if (!isExistingConversation) {	×
338	setCurrentConversationId(newConversationChannelId);	×
339	}
340
341	const promptContextOptions: PromptContextOptions = { postId: currentPostId, includeComments: true /* TODO: this currently doesn't do anything; it's hardcoded on the server */ };	×
342
343	void sendClaudeMessage({	×
344	newMessage: {
345	...preSaveMessage,
346	conversationId: preSaveMessage.conversationId ?? null,	×
347	},
348	promptContextOptions,
349	...(isExistingConversation ? {} : { newConversationChannelId }),	×
350	});
351	}, [currentUser, currentConversation, sendClaudeMessage, setConversationLoadingState]);
352
353	const setCurrentConversation = useCallback(setCurrentConversationId, [setCurrentConversationId]);	×
354
355	const archiveConversation = useCallback(async (conversationId: string) => {	×
356	if (!currentUser) {	×
357	return;	×
358	}
359
360	if (currentConversationId === conversationId) {	×
361	setCurrentConversationId(undefined);	×
362	}
363
364	// remove conversation with this id from conversations object
NEW 365	setConversations((conversations) => {	×
NEW 366	const { [conversationId]: _, ...rest } = conversations;	×
NEW 367	return rest;	×
368	});
369
370	void updateConversation({	×
371	selector: { _id: conversationId },
372	data: {
373	deleted: true
374	}
375	})
376	}, [currentUser, currentConversationId, updateConversation]);
377
378	useEffect(() => {	×
379	if (currentConversationWithMessages) {	×
NEW 380	setConversations((conversations) => {	×
NEW 381	const clientSideConversationState = conversations[currentConversationWithMessages._id];	×
NEW 382	if (currentConversationWithMessages.messages.length > clientSideConversationState.messages.length) {	×
NEW 383	return { ...conversations, [currentConversationWithMessages._id]: currentConversationWithMessages };	×
384	}
385
NEW 386	return conversations;	×
387	});
388	}
389	}, [currentConversationWithMessages]);
390
391	const llmChatContext = useMemo((): LlmChatContextType => ({	×
392	currentConversation,
393	currentConversationLoading,
394	orderedConversations: sortedConversations,
395	submitMessage,
396	setCurrentConversation,
397	archiveConversation,
398	}), [submitMessage, setCurrentConversation, archiveConversation, currentConversationLoading, currentConversation, sortedConversations]);
399
400	return <LlmChatContext.Provider value={llmChatContext}>	×
401	{children}
402	</LlmChatContext.Provider>
403	}
404
405	const LlmChatWrapperComponent = registerComponent("LlmChatWrapper", LlmChatWrapper);	1✔
406
407	declare global {
408	interface ComponentTypes {
409	LlmChatWrapper: typeof LlmChatWrapperComponent
410	}
411	}

ForumMagnum / ForumMagnum / 10589112778

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous