10602040344

Committed 28 Aug 2024 06:06PM UTC coverage: 31.996% (-0.02%) from 32.015%

Build # 10602040344

Build Type

Pull #9645

github

Committed by

b0b3rt

Commit Message

todo

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

Run Details

5020 of 40810 branches covered (12.3%)

Branch coverage included in aggregate %.

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

2 existing lines in 1 file now uncovered.

29214 of 66184 relevant lines covered (44.14%)

189.17 hits per line

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

6.02

/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;
      }
    });
  }, []);

  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
UNCOV 154	const hydrateNewConversation = useCallback((newConversationEvent: LlmCreateConversationMessage) => {	×
155	const { title, conversationId, createdAt, userId, channelId } = newConversationEvent;	×
NEW 156	setConversations((conversations) => {	×
NEW 157	const { [channelId]: { messages }, ...rest } = conversations;	×
158
NEW 159	const hydratedConversation: LlmConversationWithPartialMessages = {	×
160	_id: conversationId,
161	title,
162	messages,
163	createdAt: new Date(createdAt),
164	deleted: false,
165	lastUpdatedAt: new Date(createdAt),
166	userId
167	};
168
NEW 169	return { [conversationId]: hydratedConversation, ...rest };	×
170	});
171
172	setCurrentConversationId(conversationId);	×
173	setConversationLoadingState(conversationId, true);	×
174	}, [setConversationLoadingState]);
175
176	const handleLlmStreamContent = useCallback((message: LlmStreamContentMessage) => {	×
177	if (!currentUser) {	×
178	return;	×
179	}
180
181	const { conversationId, content, previousUserMessage } = message.data;	×
182
NEW 183	setConversations((conversations) => {	×
NEW 184	const streamConversation = conversations[conversationId];	×
NEW 185	const updatedMessages = [...streamConversation.messages];	×
NEW 186	const lastMessageInConversation = updatedMessages.slice(-1)[0];	×
NEW 187	const lastClientMessageIsAssistant = lastMessageInConversation?.role === 'assistant';	×
188
NEW 189	const newMessage: NewLlmMessage = {	×
190	conversationId,
191	userId: currentUser._id,
192	// TODO: pass back role through stream, maybe even the whole message object?
193	role: "assistant",
194	content,
195	};
196
197	// previousUserMessage only gets sent with the first stream event for any given message response
NEW 198	if (previousUserMessage && lastClientMessageIsAssistant) {	×
NEW 199	updatedMessages.push(previousUserMessage, newMessage);	×
200	} else {
201	// 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 202	if (lastClientMessageIsAssistant) {	×
NEW 203	updatedMessages.pop();	×
204	}
NEW 205	updatedMessages.push(newMessage);	×
206	}
207
NEW 208	const updatedConversation = { ...streamConversation, messages: updatedMessages };	×
209
NEW 210	return { ...conversations, [updatedConversation._id]: updatedConversation };	×
211	});
212
213	setConversationLoadingState(conversationId, false);	×
214	}, [currentUser, setConversationLoadingState]);
215
216	const handleClaudeResponseMesage = useCallback((message: LlmStreamMessage) => {	×
217	switch (message.eventType) {	×
218	case "llmCreateConversation":
219	hydrateNewConversation(message);	×
220	break;	×
221	case "llmStreamContent":
222	handleLlmStreamContent(message);	×
223	break;	×
224	case "llmStreamEnd":
225	setConversationLoadingState(message.data.conversationId, false);	×
226	break;	×
227	}
228	}, [hydrateNewConversation, handleLlmStreamContent, setConversationLoadingState]);
229
230	const sendClaudeMessage = useCallback(async ({newMessage, promptContextOptions, newConversationChannelId}: {	×
231	newMessage: ClientMessage,
232	promptContextOptions: PromptContextOptions,
233	newConversationChannelId?: string
234	}) => {
235	const response = await fetch("/api/sendLlmChat", {	×
236	method: "POST",
237	headers: {
238	'Content-Type': 'application/json',
239	},
240	body: JSON.stringify({ newMessage, promptContextOptions, newConversationChannelId }),
241	});
242	if (!response.body) {	×
243	return; // TODO better error handling	×
244	}
245	const reader = response.body.getReader();	×
246	const decoder = new TextDecoder();	×
247	let buffer = '';	×
248
249	// eslint-disable-next-line no-constant-condition
250	while (true) {	×
251	const { done, value } = await reader.read();	×
252	if (done) break;	×
253
254	buffer += decoder.decode(value, { stream: true });	×
255
256	let boundary;
257	while ((boundary = buffer.indexOf('\n\n')) !== -1) {	×
258	const line = buffer.slice(0, boundary);	×
259	buffer = buffer.slice(boundary + 2);	×
260
261	if (line.startsWith('data: ')) {	×
262	let message: LlmStreamMessage\|null = null	×
263	try {	×
264	message = JSON.parse(line.slice("data: ".length));	×
265	} catch (error) {
266	// eslint-disable-next-line no-console
267	console.error('Error parsing JSON:', error);	×
268	}
269	if (message) {	×
270	handleClaudeResponseMesage(message);	×
271	}
272	}
273	}
274	}
275	// Handle any remaining data in the buffer
276	if (buffer.startsWith('data: ')) {	×
277	let message: LlmStreamMessage\|null = null	×
278	try {	×
279	message = JSON.parse(buffer.slice("data: ".length));	×
280	} catch (error) {
281	// eslint-disable-next-line no-console
282	console.error('Error parsing JSON:', error);	×
283	}
284	if (message) {	×
285	handleClaudeResponseMesage(message);	×
286	}
287	}
288
289	}, [handleClaudeResponseMesage]);
290
291	// TODO: Ensure code is sanitized against injection attacks
292	const submitMessage = useCallback(async (query: string, currentPostId?: string) => {	×
293	if (!currentUser) {	×
294	return;	×
295	}
296
297	const newConversationChannelId = randomId();	×
298	const isExistingConversation = !!currentConversation;	×
299
300	const preSaveConversation = {	×
301	_id: newConversationChannelId,
302	userId: currentUser._id,
303	messages: [],
304	createdAt: new Date(),
305	lastUpdatedAt: new Date()
306	};
307
308	const displayedConversation = isExistingConversation	×
309	? currentConversation	×
310	: preSaveConversation;
311
312	// Sent to the server to create a new message
313	const preSaveMessage: PreSaveLlmMessage = {	×
314	conversationId: currentConversation?._id,	×
315	userId: currentUser._id,
316	content: query
317	};
318
NEW 319	setConversations((conversations) => {	×
320	// We don't send the role to the server
NEW 321	const newClientMessage: NewLlmMessage = { ...preSaveMessage, role: 'user' };	×
NEW 322	const updatedMessages = [...displayedConversation.messages ?? [], newClientMessage];	×
NEW 323	const conversationWithNewUserMessage: LlmConversation = { ...displayedConversation, messages: updatedMessages };	×
324
NEW 325	return { ...conversations, [conversationWithNewUserMessage._id]: conversationWithNewUserMessage };	×
326	});
327
328
329	// Update Client Display
330	setConversationLoadingState(displayedConversation._id, true);	×
331
UNCOV 332	if (!isExistingConversation) {	×
333	setCurrentConversationId(newConversationChannelId);	×
334	}
335
336	const promptContextOptions: PromptContextOptions = { postId: currentPostId, includeComments: true /* TODO: this currently doesn't do anything; it's hardcoded on the server */ };	×
337
338	void sendClaudeMessage({	×
339	newMessage: {
340	...preSaveMessage,
341	conversationId: preSaveMessage.conversationId ?? null,	×
342	},
343	promptContextOptions,
344	...(isExistingConversation ? {} : { newConversationChannelId }),	×
345	});
346	}, [currentUser, currentConversation, sendClaudeMessage, setConversationLoadingState]);
347
348	const setCurrentConversation = useCallback(setCurrentConversationId, [setCurrentConversationId]);	×
349
350	const archiveConversation = useCallback(async (conversationId: string) => {	×
351	if (!currentUser) {	×
352	return;	×
353	}
354
355	if (currentConversationId === conversationId) {	×
356	setCurrentConversationId(undefined);	×
357	}
358
359	// remove conversation with this id from conversations object
NEW 360	setConversations((conversations) => {	×
NEW 361	const { [conversationId]: _, ...rest } = conversations;	×
NEW 362	return rest;	×
363	});
364
365	void updateConversation({	×
366	selector: { _id: conversationId },
367	data: {
368	deleted: true
369	}
370	})
371	}, [currentUser, currentConversationId, updateConversation]);
372
373	useEffect(() => {	×
374	if (currentConversationWithMessages) {	×
NEW 375	setConversations((conversations) => {	×
NEW 376	const clientSideConversationState = conversations[currentConversationWithMessages._id];	×
NEW 377	if (currentConversationWithMessages.messages.length > clientSideConversationState.messages.length) {	×
NEW 378	return { ...conversations, [currentConversationWithMessages._id]: currentConversationWithMessages };	×
379	}
380
NEW 381	return conversations;	×
382	});
383	}
384	}, [currentConversationWithMessages]);
385
386	const llmChatContext = useMemo((): LlmChatContextType => ({	×
387	currentConversation,
388	currentConversationLoading,
389	orderedConversations: sortedConversations,
390	submitMessage,
391	setCurrentConversation,
392	archiveConversation,
393	}), [submitMessage, setCurrentConversation, archiveConversation, currentConversationLoading, currentConversation, sortedConversations]);
394
395	return <LlmChatContext.Provider value={llmChatContext}>	×
396	{children}
397	</LlmChatContext.Provider>
398	}
399
400	const LlmChatWrapperComponent = registerComponent("LlmChatWrapper", LlmChatWrapper);	1✔
401
402	declare global {
403	interface ComponentTypes {
404	LlmChatWrapper: typeof LlmChatWrapperComponent
405	}
406	}

ForumMagnum / ForumMagnum / 10602040344

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