{isUser ? (
{message.content}
@@ -22,12 +23,21 @@ function MessageBubble({ message }) {
}
export default function ChatWindow({ messages }) {
+ const bottomRef = useRef(null);
+
+ useEffect(() => {
+ if (bottomRef.current) {
+ bottomRef.current.scrollIntoView({ behavior: "smooth" });
+ }
+ }, [messages]);
+
return (
{messages.map((m, i) => (
-
+
))}
+
);
diff --git a/web-app/src/components/ui/chat/message-input.jsx b/web-app/src/components/ui/chat/message-input.jsx
index 8e48f34..07751a3 100644
--- a/web-app/src/components/ui/chat/message-input.jsx
+++ b/web-app/src/components/ui/chat/message-input.jsx
@@ -1,10 +1,9 @@
import React, { useState, useRef, useEffect } from "react";
-import DeleteButton from "src/components/ui/button/delete-button";
import DownButton from "src/components/ui/button/down-button";
import { motion } from "motion/react";
import { BotMessageSquare } from "lucide-react";
-export default function MessageInput({ onSend }) {
+export default function MessageInput({ onSend, disabled = false }) {
const [text, setText] = useState("");
const textareaRef = useRef(null);
@@ -15,7 +14,7 @@ export default function MessageInput({ onSend }) {
function handleSubmit(e) {
e.preventDefault();
- if (!text.trim()) return;
+ if (!text.trim() || disabled) return;
onSend(text.trim());
setText("");
}
@@ -38,6 +37,7 @@ export default function MessageInput({ onSend }) {
ref={textareaRef}
value={text}
onChange={(e) => {
+ if (disabled) return;
setText(e.target.value);
// auto-resize
const ta = textareaRef.current;
@@ -49,12 +49,17 @@ export default function MessageInput({ onSend }) {
placeholder="Type a message..."
rows={1}
className="flex-1 mx-2 rounded-md shadow-2sx border-none focus:border-none focus:outline-none resize-none overflow-auto max-h-40"
+ disabled={disabled}
/>
diff --git a/web-app/src/lib/api.js b/web-app/src/lib/api.js
new file mode 100644
index 0000000..76dce1e
--- /dev/null
+++ b/web-app/src/lib/api.js
@@ -0,0 +1,75 @@
+const JSON_HEADERS = {
+ Accept: "application/json",
+};
+
+async function parseJsonResponse(response) {
+ const text = await response.text();
+ const hasBody = text !== "";
+ let data;
+ if (hasBody) {
+ try {
+ data = JSON.parse(text);
+ } catch (error) {
+ data = { raw: text };
+ }
+ }
+
+ if (!response.ok) {
+ const message = data?.error || response.statusText || "Request failed";
+ const err = new Error(message);
+ err.status = response.status;
+ err.body = data;
+ throw err;
+ }
+
+ return data ?? {};
+}
+
+export async function listFiles() {
+ const response = await fetch("/api/files/list", {
+ method: "GET",
+ headers: JSON_HEADERS,
+ });
+ const data = await parseJsonResponse(response);
+ return Array.isArray(data.files) ? data.files : [];
+}
+
+export async function createQuery(payload) {
+ const response = await fetch("/api/query/create", {
+ method: "POST",
+ headers: {
+ ...JSON_HEADERS,
+ "Content-Type": "application/json",
+ },
+ body: JSON.stringify(payload),
+ });
+ const data = await parseJsonResponse(response);
+ if (!data.id) {
+ throw new Error("Query creation did not return an id");
+ }
+ return data;
+}
+
+export async function getQueryStatus(id) {
+ const response = await fetch(`/api/query/status?id=${encodeURIComponent(id)}`, {
+ method: "GET",
+ headers: JSON_HEADERS,
+ });
+ return parseJsonResponse(response);
+}
+
+export async function getQueryResult(id) {
+ const response = await fetch(`/api/query/result?id=${encodeURIComponent(id)}`, {
+ method: "GET",
+ headers: JSON_HEADERS,
+ });
+ return parseJsonResponse(response);
+}
+
+export async function cancelQuery(id) {
+ const response = await fetch(`/api/query/cancel?id=${encodeURIComponent(id)}`, {
+ method: "GET",
+ headers: JSON_HEADERS,
+ });
+ return parseJsonResponse(response);
+}