fix rest of the forms

src/app/_components/AutoGrowTextarea.tsx

@@ -1,6 +1,6 @@
-export const AutoGrowTextarea = ({ class: className = "", ...props }) => (
+export const AutoGrowTextarea = ({ class: className = "", value, onChange, ...props }) => (
   <div class="vstack relative">
-    <textarea class={`!absolute !inset-0 ${className}`} {...props} />
+    <textarea class={`!absolute !inset-0 ${className}`} value={value} onInput={e => onChange(e.target!.value)} {...props} />
     <div
       // render to invisible pseudo element, used to measure the height
       class={`form-control ${className} invisible whitespace-pre-wrap max-h-[30vh] overflow-y-hidden after:content-[attr(data-value)_"_"]`}

src/app/chat/ChatInput.tsx

@@ -35,7 +35,7 @@ export const ChatInput = ({ value, onChange, onSend, abort }) => {
         rows={1}
         placeholder="Ask anything..."
         value={value}
-        onInput={e => onChange(e.target.value)}
+        onChange={onChange}
         onKeyDown={handleKeyDown}
       />
       <IconButton class="absolute bottom-[9px] right-2" title="Send" icon={SendHorizontal} abort={abort} submit />

src/app/chat/ChatPrompt.tsx

@@ -21,7 +21,7 @@ export const ChatPrompt = ({ chat, onSave }) => {
           </div>
         </Form>
       ) : (
-        <div class="text-neutral-9">{chat.prompt ?? defaultPrompt}</div>
+        <div class="text-neutral-9 whitespace-pre-wrap">{chat.prompt ?? defaultPrompt}</div>
       )}
     </div>
   )