Skip to content

Commit 0b84c93

Browse files
vid277skeptrunedev
vid277
authored and
skeptrunedev
committed
cleanup: fix state race condition when setting image url
1 parent d107c1f commit 0b84c93

3 files changed

Lines changed: 29 additions & 25 deletions

File tree

‎clients/search-component/src/TrieveModal/Chat/SuggestedQuestions.tsx‎

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -22,15 +22,15 @@ export const SuggestedQuestions = ({
2222
const { suggestedQuestions, isLoadingSuggestedQueries, getQuestions } =
2323
useSuggestedQuestions();
2424

25-
const { props, trieveSDK, fingerprint, abTreatment, imageUrl, setImageUrl } =
25+
const { props, trieveSDK, fingerprint, abTreatment } =
2626
useModalState();
2727
const [parent] = useAutoAnimate({ duration: 100 });
2828
const [selectedQuestion, setSelectedQuestion] = useState<
2929
AiQuestion | DefaultSearchQuery | null
3030
>(null);
3131

3232
useEffect(() => {
33-
if (selectedQuestion && imageUrl) {
33+
if (selectedQuestion) {
3434
askQuestion(
3535
isAiQuestion(selectedQuestion)
3636
? selectedQuestion.questionText
@@ -42,9 +42,11 @@ export const SuggestedQuestions = ({
4242
isAiQuestion(selectedQuestion) && selectedQuestion.promptForAI !== ""
4343
? selectedQuestion.promptForAI
4444
: undefined,
45+
undefined,
46+
isDefaultSearchQuery(selectedQuestion) ? selectedQuestion.imageUrl ?? undefined : "",
4547
);
4648
}
47-
}, [imageUrl, selectedQuestion]);
49+
}, [selectedQuestion]);
4850

4951
if (messages.length) {
5052
return null;
@@ -55,12 +57,8 @@ export const SuggestedQuestions = ({
5557
) => {
5658
console.log("q", q);
5759
setCurrentQuestion(isAiQuestion(q) ? q.questionText : (q.query ?? ""));
58-
59-
if (isDefaultSearchQuery(q) && q.imageUrl) {
60-
setSelectedQuestion(q);
61-
setImageUrl(q.imageUrl);
62-
}
63-
60+
setSelectedQuestion(q);
61+
6462
const requestId =
6563
messages[messages.length - 1]?.queryId ??
6664
"00000000-0000-0000-0000-000000000000";
@@ -83,7 +81,6 @@ export const SuggestedQuestions = ({
8381
});
8482
if (onMessageSend) {
8583
onMessageSend();
86-
setImageUrl("");
8784
}
8885
};
8986

‎clients/search-component/src/TrieveModal/index.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -182,11 +182,10 @@ const Modal = () => {
182182
if (props.inline) return;
183183

184184
if (defaultMode === "chat") {
185-
setOpen(true);
186185
setMode("chat");
187186
cancelGroupChat();
188-
setImageUrl(customEvent.detail.imageUrl ?? "");
189-
askQuestion(customEvent.detail.text);
187+
setOpen(true);
188+
askQuestion(customEvent.detail.text, undefined, undefined, "", true, customEvent.detail.imageUrl);
190189
} else {
191190
setOpen(true);
192191
setMode("search");

‎clients/search-component/src/utils/hooks/chat-context.tsx‎

Lines changed: 20 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,7 @@ const ChatContext = createContext<{
7575
groupIds?: string[],
7676
systemPrompt?: string,
7777
displayUserMessage?: boolean,
78+
imageUrl?: string,
7879
) => Promise<void>;
7980
isLoading: boolean;
8081
loadingText: string;
@@ -139,6 +140,8 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
139140
const [productsWithClicks, setProductsWithClicks] = useState<
140141
ChunkIdWithIndex[]
141142
>([]);
143+
let localImageUrl = imageUrl;
144+
142145

143146
const createTopic = async ({
144147
question,
@@ -520,7 +523,6 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
520523
let referenceImageUrls: string[] = [];
521524
let referenceChunks: Chunk[] = [];
522525

523-
524526
if (!groupIds || groupIds.length === 0) {
525527
chatMessageAbortController.current = new AbortController();
526528
const toolCallTimeout = setTimeout(
@@ -540,7 +542,7 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
540542
if (props.type === "ecommerce" && !curGroup) {
541543
return await trieveSDK.getToolCallFunctionParams({
542544
user_message_text: questionProp || currentQuestion,
543-
image_url: imageUrl ? imageUrl : null,
545+
image_url: localImageUrl ? localImageUrl : null,
544546
audio_input: curAudioBase64 ? curAudioBase64 : null,
545547
tool_function: {
546548
name: "get_price_filters",
@@ -600,7 +602,7 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
600602
}
601603
},
602604
)} \n\n${props.searchToolCallOptions?.userMessageTextPrefix ?? defaultSearchToolCallOptions.userMessageTextPrefix}: ${questionProp || currentQuestion}.`,
603-
image_url: imageUrl ? imageUrl : null,
605+
image_url: localImageUrl ? localImageUrl : null,
604606
audio_input: curAudioBase64 ? curAudioBase64 : null,
605607
tool_function: {
606608
name: "skip_search",
@@ -621,10 +623,10 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
621623
})
622624

623625
const imageFiltersPromise = retryOperation(async () => {
624-
if (imageUrl) {
626+
if (localImageUrl) {
625627
return await trieveSDK.getToolCallFunctionParams({
626628
user_message_text: questionProp || currentQuestion,
627-
image_url: imageUrl ? imageUrl : null,
629+
image_url: localImageUrl ? localImageUrl : null,
628630
tool_function: {
629631
name: "get_image_filters",
630632
description:
@@ -665,7 +667,7 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
665667
(message) => `\n\n${message.text}`,
666668
)} \n\n ${questionProp || currentQuestion}`
667669
: null,
668-
image_url: imageUrl ? imageUrl : null,
670+
image_url: localImageUrl ? localImageUrl : null,
669671
audio_input: curAudioBase64 ? curAudioBase64 : null,
670672
tool_function: {
671673
name: "get_filters",
@@ -715,7 +717,7 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
715717
text: transcribedQuery ?? "",
716718
additional: null,
717719
queryId: null,
718-
imageUrl: imageUrl ? imageUrl : null,
720+
imageUrl: localImageUrl ? localImageUrl : null,
719721
},
720722
{
721723
type: "system",
@@ -728,7 +730,7 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
728730
}
729731

730732
useImage = (imageFiltersResp?.parameters &&
731-
(imageFiltersResp.parameters as any)["image"] === true && imageUrl) as boolean;
733+
(imageFiltersResp.parameters as any)["image"] === true && localImageUrl) as boolean;
732734

733735
const match_any_tags = [];
734736
if (tagFiltersResp?.parameters) {
@@ -1057,7 +1059,6 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
10571059
}
10581060

10591061
const handleImageEdit = async () => {
1060-
console.log("REFERENCE IMAGE URLS", referenceImageUrls);
10611062
if (useImage) {
10621063
setLoadingText("Editing image...");
10631064

@@ -1066,7 +1067,7 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
10661067
input_images: [
10671068
{
10681069
image_src: {
1069-
url: imageUrl,
1070+
url: localImageUrl,
10701071
},
10711072
file_name: "input_image",
10721073
},
@@ -1302,7 +1303,13 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
13021303
groupIds?: string[],
13031304
systemPrompt?: string,
13041305
displayUserMessage?: boolean,
1306+
imageUrl?: string,
13051307
) => {
1308+
if (imageUrl) {
1309+
localImageUrl = imageUrl;
1310+
setImageUrl(imageUrl);
1311+
}
1312+
13061313
const questionProp = question;
13071314
setIsDoneReading(false);
13081315
setCurrentQuestion("");
@@ -1356,7 +1363,7 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
13561363
(displayUserMessage ?? true) ? questionProp || currentQuestion : "",
13571364
additional: null,
13581365
queryId: null,
1359-
imageUrl: imageUrl ? imageUrl : null,
1366+
imageUrl: localImageUrl ? localImageUrl : null,
13601367
},
13611368
{
13621369
type: "system",
@@ -1373,7 +1380,7 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
13731380
text: "Loading...",
13741381
additional: null,
13751382
queryId: null,
1376-
imageUrl: imageUrl ? imageUrl : null,
1383+
imageUrl: localImageUrl ? localImageUrl : null,
13771384
},
13781385
{
13791386
type: "system",
@@ -1399,6 +1406,7 @@ function ChatProvider({ children }: { children: React.ReactNode }) {
13991406
systemPrompt,
14001407
});
14011408
}
1409+
setImageUrl("");
14021410
};
14031411

14041412
const switchToChatAndAskQuestion = async (query: string) => {

0 commit comments

Comments
 (0)