From 4e4f23dd83b5fe960ac17f1d795faffe8f6e8c37 Mon Sep 17 00:00:00 2001 From: jabrock Date: Tue, 13 Aug 2024 17:34:24 -0700 Subject: [PATCH] updating conversationId and other cleanup --- app/src/components/app.tsx | 11 +++++-- app/src/components/content/index.tsx | 31 +++++++++++-------- app/src/components/content/settings.tsx | 8 +++-- .../components/content/stomp-interface.tsx | 13 +++++--- app/src/components/content/summary.tsx | 22 +++++++------ 5 files changed, 52 insertions(+), 33 deletions(-) diff --git a/app/src/components/app.tsx b/app/src/components/app.tsx index cf8f46e5..1a9ffa6c 100644 --- a/app/src/components/app.tsx +++ b/app/src/components/app.tsx @@ -1,19 +1,24 @@ import { Header } from "./header"; import Content from "./content/index"; import { registerCustomElement } from "ojs/ojvcomponent"; -import "preact"; +import { createContext } from "preact"; type Props = { appName: string; }; +const convoUUID = window.crypto.randomUUID(); +export const ConvoCtx = createContext(convoUUID); export const App = registerCustomElement("app-root", (props: Props) => { props.appName = "Generative AI JET UI"; return (
-
- + + {console.log("UUID: ", convoUUID)} +
+ +
); }); diff --git a/app/src/components/content/index.tsx b/app/src/components/content/index.tsx index 465712e7..84df4f33 100644 --- a/app/src/components/content/index.tsx +++ b/app/src/components/content/index.tsx @@ -9,12 +9,13 @@ import "oj-c/drawer-popup"; import MutableArrayDataProvider = require("ojs/ojmutablearraydataprovider"); import { MessageToastItem } from "oj-c/message-toast"; import { InputSearchElement } from "ojs/ojinputsearch"; -import { useState, useEffect, useRef } from "preact/hooks"; +import { useState, useEffect, useRef, useContext } from "preact/hooks"; import * as Questions from "text!./data/questions.json"; import * as Answers from "text!./data/answers.json"; import { initWebSocket } from "./websocket-interface"; import { InitStomp, sendPrompt } from "./stomp-interface"; import { Client } from "@stomp/stompjs"; +import { ConvoCtx } from "../app"; type ServiceTypes = "text" | "summary" | "sim"; type BackendTypes = "java" | "python"; @@ -26,12 +27,14 @@ type Chat = { }; const defaultServiceType: string = localStorage.getItem("service") || "text"; -const defaultBackendType: String = localStorage.getItem("backend") || "java"; +const defaultBackendType: string = localStorage.getItem("backend") || "java"; const Content = () => { + const conversationId = useContext(ConvoCtx); const [update, setUpdate] = useState>([]); const [busy, setBusy] = useState(false); const [summaryResults, setSummaryResults] = useState(""); + const [modelId, setModelId] = useState(null); const [summaryPrompt, setSummaryPrompt] = useState(); const [serviceType, setServiceType] = useState( defaultServiceType as ServiceTypes @@ -76,6 +79,7 @@ const Content = () => { await sleep(2000); } }; + useEffect(() => { switch (serviceType) { case "text": @@ -158,16 +162,13 @@ const Content = () => { setUpdate(chatData.current); setBusy(true); - // simulating the delay for now just to show what the animation looks like. - setTimeout(() => { - if (backendType === "python") { - socket.current?.send( - JSON.stringify({ msgType: "question", data: question.current }) - ); - } else { - sendPrompt(client, question.current!); - } - }, 300); + if (backendType === "python") { + socket.current?.send( + JSON.stringify({ msgType: "question", data: question.current }) + ); + } else { + sendPrompt(client, question.current!, modelId!, conversationId!); + } } }; @@ -198,7 +199,10 @@ const Content = () => { localStorage.setItem("backend", backend); location.reload(); }; - + const modelIdChangeHandler = (event: CustomEvent) => { + console.log("model Id: ", event.detail.value); + if (event.detail.value != null) setModelId(event.detail.value); + }; const clearSummary = () => { setSummaryResults(""); }; @@ -223,6 +227,7 @@ const Content = () => { backendType={backendType} aiServiceChange={serviceTypeChangeHandler} backendChange={backendTypeChangeHandler} + modelIdChange={modelIdChangeHandler} />
diff --git a/app/src/components/content/settings.tsx b/app/src/components/content/settings.tsx index 70004977..3863b301 100644 --- a/app/src/components/content/settings.tsx +++ b/app/src/components/content/settings.tsx @@ -1,4 +1,4 @@ -import "preact"; +import { ComponentProps } from "preact"; import { useEffect, useRef } from "preact/hooks"; import "oj-c/radioset"; import "oj-c/form-layout"; @@ -17,13 +17,14 @@ type Props = { backendType: BackendTypeVal; aiServiceChange: (service: ServiceTypeVal) => void; backendChange: (backend: BackendTypeVal) => void; + modelIdChange: (modelName: any) => void; }; const serviceTypes = [ { value: "text", label: "Generative Text" }, { value: "summary", label: "Summarize" }, - { value: "sim", label: "Simulation" }, ]; +// { value: "sim", label: "Simulation" }, const backendTypes = [ { value: "java", label: "Java" }, @@ -93,7 +94,7 @@ export const Settings = (props: Props) => { onvalueChanged={handleBackendTypeChange} > - {props.aiServiceType == "summary" && props.backendType == "java" && ( + {props.aiServiceType == "text" && props.backendType == "java" && ( <>

Model options

@@ -101,6 +102,7 @@ export const Settings = (props: Props) => { data={modelDP.current} labelHint={"Model"} itemText={"name"} + onvalueChanged={props.modelIdChange} > diff --git a/app/src/components/content/stomp-interface.tsx b/app/src/components/content/stomp-interface.tsx index 5932a7e0..cd77256a 100644 --- a/app/src/components/content/stomp-interface.tsx +++ b/app/src/components/content/stomp-interface.tsx @@ -65,15 +65,20 @@ export const InitStomp = ( return client; }; -export const sendPrompt = (client: Client | null, prompt: string) => { +export const sendPrompt = ( + client: Client | null, + prompt: string, + modelId: string, + convoId: string +) => { if (client?.connected) { console.log("Sending prompt: ", prompt); client.publish({ destination: "/genai/prompt", body: JSON.stringify({ - conversationId: "something", - content: prompt, //"Show me code for a websocket service using JavaScript", - modelId: "notapply", + conversationId: convoId, + content: prompt, + modelId: modelId, }), }); } else { diff --git a/app/src/components/content/summary.tsx b/app/src/components/content/summary.tsx index 774029df..960bd67e 100644 --- a/app/src/components/content/summary.tsx +++ b/app/src/components/content/summary.tsx @@ -282,16 +282,18 @@ export const Summary = ({ FILE_SIZE / 1000 }KB per PDF file.`} > - + {backendType === "python" && ( + + )} {invalidFiles.current.length !== 1 && fileNames && ( <>