From c62b540ce6cdb8cb1ed451e3a0754cf7fe63c8ac Mon Sep 17 00:00:00 2001 From: Krishav Raj Singh Date: Fri, 18 Jul 2025 03:27:23 +0530 Subject: [PATCH 01/17] fix: horizontal scroll --- frontend/src/components/ui/scroll-area.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/frontend/src/components/ui/scroll-area.tsx b/frontend/src/components/ui/scroll-area.tsx index cafa294f..e94be071 100644 --- a/frontend/src/components/ui/scroll-area.tsx +++ b/frontend/src/components/ui/scroll-area.tsx @@ -23,6 +23,7 @@ function ScrollArea({ {children} + ); From 21181fb8b940a783a8b001ed18151b843b6be952 Mon Sep 17 00:00:00 2001 From: Krishav Raj Singh Date: Tue, 1 Jul 2025 14:18:00 +0530 Subject: [PATCH 02/17] frontend prototype --- .../thread/content/ThreadContent.tsx | 17 ++++- .../src/components/thread/feedback-modal.tsx | 74 +++++++++++++++++++ 2 files changed, 90 insertions(+), 1 deletion(-) create mode 100644 frontend/src/components/thread/feedback-modal.tsx diff --git a/frontend/src/components/thread/content/ThreadContent.tsx b/frontend/src/components/thread/content/ThreadContent.tsx index c6c2589c..fb262946 100644 --- a/frontend/src/components/thread/content/ThreadContent.tsx +++ b/frontend/src/components/thread/content/ThreadContent.tsx @@ -18,6 +18,7 @@ import { KortixLogo } from '@/components/sidebar/kortix-logo'; import { AgentLoader } from './loader'; import { parseXmlToolCalls, isNewXmlFormat, extractToolNameFromStream } from '@/components/thread/tool-views/xml-parser'; import { parseToolResult } from '@/components/thread/tool-views/tool-result-parser'; +import Feedback from '@/components/thread/feedback-modal'; // Define the set of tags whose raw XML should be hidden during streaming const HIDE_STREAMING_XML_TAGS = new Set([ @@ -605,7 +606,7 @@ export const ThreadContent: React.FC = ({ } else if (group.type === 'assistant_group') { return (
-
+
{(() => { @@ -893,6 +894,20 @@ export const ThreadContent: React.FC = ({ )}
+ + {(() => { + const firstAssistant = group.messages.find(msg => msg.type === 'assistant'); + const messageId = firstAssistant?.message_id; + if (!messageId) return null; + + + + return ( +
+ +
+ ); + })()}
); diff --git a/frontend/src/components/thread/feedback-modal.tsx b/frontend/src/components/thread/feedback-modal.tsx new file mode 100644 index 00000000..ba9efdcf --- /dev/null +++ b/frontend/src/components/thread/feedback-modal.tsx @@ -0,0 +1,74 @@ +import { Dialog, DialogTitle, DialogHeader, DialogContent, DialogTrigger, DialogFooter, DialogClose } from "@/components/ui/dialog"; +import { Button } from "@/components/ui/button"; +import { ThumbsDown, ThumbsUp } from "lucide-react"; +import { useState } from "react"; +import { Textarea } from "../ui/textarea"; +import { toast } from "sonner"; + + +export default function Feedback({ messageId }: { messageId: string }) { + const [open, setOpen] = useState(false); + const [feedback, setFeedback] = useState<'positive' | 'negative' | null>(null); + const [comment, setComment] = useState(''); + + const handleClick = (feedback: 'positive' | 'negative') => { + setFeedback(feedback); + setOpen(true); + } + + const handleSubmit = () => { + if(!feedback) return; + console.log(messageId, feedback, comment); + setOpen(false); + setFeedback(null); + setComment(''); + toast.success('Feedback submitted'); + } + + return ( +
+ + + + + + + Feedback + + + {`What was ${feedback === 'negative' ? 'un' : ''}satisifying about this response?`} + +