10602730789

Committed 28 Aug 2024 06:55PM UTC coverage: 32.003% (-0.01%) from 32.015%

Build # 10602730789

Build Type

Pull #9645

github

Committed by

darkruby501

Commit Message

remove console log

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%)

2 existing lines in 1 file now uncovered.

29214 of 66174 relevant lines covered (44.15%)

189.23 hits per line

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

6.19

/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;
};

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

ForumMagnum / ForumMagnum / 10602730789

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