Enable regenerating Khoj messages on web app

- Replace Delete button with Regenerate button in chatMessage component
- Update chat API to delete previous conversation with turn id, if exists
This commit is contained in:
Debanjum (aider) 2024-11-07 15:14:02 -08:00 committed by Debanjum
parent adc8a764bb
commit 27137f1cdd

View file

@ -30,6 +30,7 @@ import {
Code, Code,
Shapes, Shapes,
Trash, Trash,
ArrowClockwise,
} from "@phosphor-icons/react"; } from "@phosphor-icons/react";
import DOMPurify from "dompurify"; import DOMPurify from "dompurify";
@ -682,6 +683,32 @@ const ChatMessage = forwardRef<HTMLDivElement, ChatMessageProps>((props, ref) =>
} }
}; };
const regenerateMessage = async (message: SingleChatMessage) => {
const turnId = message.turnId || props.turnId;
if (!message.rawQuery) return;
const response = await fetch("/api/chat", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
q: message.rawQuery,
conversation_id: props.conversationId,
turn_id: turnId,
stream: false,
}),
});
if (response.ok) {
const result = await response.json();
// Update the UI after successful regeneration
props.onDeleteMessage(turnId);
} else {
console.error("Failed to regenerate message");
}
};
const allReferences = constructAllReferences( const allReferences = constructAllReferences(
props.chatMessage.context, props.chatMessage.context,
props.chatMessage.onlineContext, props.chatMessage.onlineContext,
@ -744,7 +771,7 @@ const ChatMessage = forwardRef<HTMLDivElement, ChatMessageProps>((props, ref) =>
/> />
</button> </button>
))} ))}
{props.chatMessage.turnId && ( {props.chatMessage.by === "you" && props.chatMessage.turnId && (
<button <button
title="Delete" title="Delete"
className={`${styles.deleteButton}`} className={`${styles.deleteButton}`}
@ -756,6 +783,18 @@ const ChatMessage = forwardRef<HTMLDivElement, ChatMessageProps>((props, ref) =>
/> />
</button> </button>
)} )}
{props.chatMessage.by === "khoj" && props.chatMessage.turnId && (
<button
title="Regenerate"
className={`${styles.regenerateButton}`}
onClick={() => regenerateMessage(props.chatMessage)}
>
<ArrowClockwise
alt="Regenerate Message"
className="hsl(var(--muted-foreground)) hover:text-blue-500"
/>
</button>
)}
<button <button
title="Copy" title="Copy"
className={`${styles.copyButton}`} className={`${styles.copyButton}`}