diff --git a/embed/src/components/ChatWindow/ChatContainer/PromptInput/index.jsx b/embed/src/components/ChatWindow/ChatContainer/PromptInput/index.jsx index 5231b0f548b6e532df8ddcbb955fb37d14132bf5..feddbc0d823a7a88e85f2f630a14ea5720e9bcbe 100644 --- a/embed/src/components/ChatWindow/ChatContainer/PromptInput/index.jsx +++ b/embed/src/components/ChatWindow/ChatContainer/PromptInput/index.jsx @@ -2,7 +2,6 @@ import { CircleNotch, PaperPlaneRight } from "@phosphor-icons/react"; import React, { useState, useRef } from "react"; export default function PromptInput({ - setttings, message, submit, onChange, diff --git a/embed/src/components/ChatWindow/ChatContainer/index.jsx b/embed/src/components/ChatWindow/ChatContainer/index.jsx index 9c1ffa3621722724c1da05d02d00a94880294ee2..505142de0b1c65b7eac52fe71a260bbe42a1a1c2 100644 --- a/embed/src/components/ChatWindow/ChatContainer/index.jsx +++ b/embed/src/components/ChatWindow/ChatContainer/index.jsx @@ -79,7 +79,6 @@ export default function ChatContainer({ <div className="h-full w-full relative"> <ChatHistory settings={settings} history={chatHistory} /> <PromptInput - settings={settings} message={message} submit={handleSubmit} onChange={handleMessageChange} diff --git a/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx b/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx index 45193df5722587f410ee22f69b8e54dd4d703259..2b9c5ca4f0b41bb6c0349c9c47ca4210d2e8b7d1 100644 --- a/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx +++ b/frontend/src/components/WorkspaceChat/ChatContainer/PromptInput/index.jsx @@ -5,6 +5,7 @@ import SlashCommandsButton, { useSlashCommands, } from "./SlashCommands"; import { isMobile } from "react-device-detect"; +import debounce from "lodash.debounce"; export default function PromptInput({ workspace, @@ -24,6 +25,13 @@ export default function PromptInput({ submit(e); }; + const checkForSlash = (e) => { + const input = e.target.value; + if (input === "/") setShowSlashCommand(true); + if (showSlashCommand) setShowSlashCommand(false); + return; + }; + const captureEnter = (event) => { if (event.keyCode == 13) { if (!event.shiftKey) { @@ -42,6 +50,7 @@ export default function PromptInput({ : "1px"; }; + const watchForSlash = debounce(checkForSlash, 300); return ( <div className="w-full fixed md:absolute bottom-0 left-0 z-10 md:z-0 flex justify-center items-center"> <SlashCommands @@ -59,7 +68,10 @@ export default function PromptInput({ <textarea onKeyUp={adjustTextArea} onKeyDown={captureEnter} - onChange={onChange} + onChange={(e) => { + onChange(e); + watchForSlash(e); + }} required={true} disabled={inputDisabled} onFocus={() => setFocused(true)}