Update package.json version and fix text area focus bug

This commit is contained in:
n4ze3m 2024-02-28 18:36:17 +05:30
parent 40a6f0d1b3
commit bfc8c5c8fa
3 changed files with 26 additions and 18 deletions

View File

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

View File

@ -19,23 +19,21 @@ export const PlaygroundForm = ({ dropedFile }: Props) => {
const textareaRef = React.useRef<HTMLTextAreaElement>(null) const textareaRef = React.useRef<HTMLTextAreaElement>(null)
const inputRef = React.useRef<HTMLInputElement>(null) const inputRef = React.useRef<HTMLInputElement>(null)
const resetHeight = () => { const textAreaFocus = () => {
const textarea = textareaRef.current if (textareaRef.current) {
if (textarea) { textareaRef.current.focus()
textarea.style.height = "auto"
} }
} }
const form = useForm({ const form = useForm({
initialValues: { initialValues: {
message: "", message: "",
image: "" image: ""
} },
}) })
React.useEffect(() => { React.useEffect(() => {
if (textareaRef.current) { textAreaFocus()
textareaRef.current.focus()
}
}, []) }, [])
const onInputChange = async ( const onInputChange = async (
@ -85,9 +83,13 @@ export const PlaygroundForm = ({ dropedFile }: Props) => {
const { mutateAsync: sendMessage } = useMutation({ const { mutateAsync: sendMessage } = useMutation({
mutationFn: onSubmit, mutationFn: onSubmit,
onSuccess: () => { onSuccess: () => {
textAreaFocus()
queryClient.invalidateQueries({ queryClient.invalidateQueries({
queryKey: ["fetchChatHistory"] queryKey: ["fetchChatHistory"]
}) })
},
onError: (error) => {
textAreaFocus()
} }
}) })
@ -133,11 +135,12 @@ export const PlaygroundForm = ({ dropedFile }: Props) => {
} }
} }
form.reset() form.reset()
resetHeight() textAreaFocus()
await sendMessage({ await sendMessage({
image: value.image, image: value.image,
message: value.message.trim() message: value.message.trim()
}) })
})} })}
className="shrink-0 flex-grow flex flex-col items-center "> className="shrink-0 flex-grow flex flex-col items-center ">
<input <input
@ -179,7 +182,7 @@ export const PlaygroundForm = ({ dropedFile }: Props) => {
} }
} }
form.reset() form.reset()
resetHeight() textAreaFocus()
await sendMessage({ await sendMessage({
image: value.image, image: value.image,
message: value.message.trim() message: value.message.trim()

View File

@ -19,10 +19,9 @@ export const SidepanelForm = ({ dropedFile }: Props) => {
const inputRef = React.useRef<HTMLInputElement>(null) const inputRef = React.useRef<HTMLInputElement>(null)
const { sendWhenEnter, setSendWhenEnter } = useWebUI() const { sendWhenEnter, setSendWhenEnter } = useWebUI()
const resetHeight = () => { const textAreaFocus = () => {
const textarea = textareaRef.current if (textareaRef.current) {
if (textarea) { textareaRef.current.focus()
textarea.style.height = "auto"
} }
} }
const form = useForm({ const form = useForm({
@ -64,7 +63,13 @@ export const SidepanelForm = ({ dropedFile }: Props) => {
} }
}, [transcript]) }, [transcript])
const { mutateAsync: sendMessage, isPending: isSending } = useMutation({ const { mutateAsync: sendMessage, isPending: isSending } = useMutation({
mutationFn: onSubmit mutationFn: onSubmit,
onSuccess: () => {
textAreaFocus()
},
onError: (error) => {
textAreaFocus()
}
}) })
return ( return (
@ -109,7 +114,7 @@ export const SidepanelForm = ({ dropedFile }: Props) => {
} }
} }
form.reset() form.reset()
resetHeight() textAreaFocus()
await sendMessage({ await sendMessage({
image: value.image, image: value.image,
message: value.message.trim() message: value.message.trim()
@ -155,7 +160,7 @@ export const SidepanelForm = ({ dropedFile }: Props) => {
} }
} }
form.reset() form.reset()
resetHeight() textAreaFocus()
await sendMessage({ await sendMessage({
image: value.image, image: value.image,
message: value.message.trim() message: value.message.trim()