Add typing state to PlaygroundForm component

This commit is contained in:
n4ze3m 2024-03-04 23:09:09 +05:30
parent 21ab18dd7d
commit faea2b2fa2
2 changed files with 9 additions and 6 deletions

View File

@ -1,7 +1,7 @@
{
"name": "pageassist",
"displayName": "Page Assist - A Web UI for Local AI Models",
"version": "1.0.5",
"version": "1.0.6",
"description": "Use your locally running AI models to assist you in your web browsing.",
"author": "n4ze3m",
"scripts": {

View File

@ -18,6 +18,7 @@ type Props = {
export const PlaygroundForm = ({ dropedFile }: Props) => {
const inputRef = React.useRef<HTMLInputElement>(null)
const [typing, setTyping] = React.useState<boolean>(false)
const {
onSubmit,
selectedModel,
@ -115,14 +116,14 @@ export const PlaygroundForm = ({ dropedFile }: Props) => {
}
})
const handleKeyDown = (e: KeyboardEvent) => {
const handleKeyDown = (e: React.KeyboardEvent) => {
if (e.key === "Process" || e.key === "229" ) return
if (
!typing &&
e.key === "Enter" &&
!e.shiftKey &&
!isSending &&
sendWhenEnter &&
!e.isComposing
sendWhenEnter
) {
e.preventDefault()
form.onSubmit(async (value) => {
@ -213,7 +214,9 @@ export const PlaygroundForm = ({ dropedFile }: Props) => {
/>
<div className="w-full border-x border-t flex flex-col dark:border-gray-600 rounded-t-xl p-2">
<textarea
onKeyDown={(e) => handleKeyDown(e as unknown as KeyboardEvent)}
onCompositionStart={() => setTyping(true)}
onCompositionEnd={() => setTyping(false)}
onKeyDown={(e) => handleKeyDown(e)}
ref={textareaRef}
className="px-2 py-2 w-full resize-none bg-transparent focus-within:outline-none focus:ring-0 focus-visible:ring-0 ring-0 dark:ring-0 border-0 dark:text-gray-100"
required