fix(frontend): text areas for prompt editing are now autosizing

frontend/src/components/ChatSuggestionInputCard.tsx

@@ -23,6 +23,9 @@ export const ChatSuggestionInputCard = ({
       label={texts.common.text}
       placeholder={texts.common.text}
       resize="vertical"
+      autosize
+      minRows={3}
+      maxRows={15}
       {...suggestionProps}
     />
     <ActionIcon

frontend/src/components/ChatSuggestionsInput.tsx

@@ -35,7 +35,7 @@ export function ChatSuggestionsInput<T extends ChatSuggestionsFormValues>({ form
           {description}
         </Text>
       )}
-      <SimpleGrid cols={2}>
+      <SimpleGrid cols={1}>
         {values.chatSuggestions?.map((_, index) => (
           <ChatSuggestionInputCard
             key={index}

frontend/src/components/Forms.tsx

@@ -7,6 +7,7 @@ import {
   MultiSelect as MantineMultiSelect,
   Select as MantineSingleSelect,
   TagsInput,
+  Textarea,
 } from '@mantine/core';
 import { IconRefresh } from '@tabler/icons-react';
 import { HTMLProps, PropsWithChildren, ReactNode, useEffect, useState } from 'react';
@@ -551,8 +552,11 @@ const InputTextarea = ({ className, name, ...other }: FormEditorProps<string>) =
   const { field, fieldState, formState } = useController({ name });
 
   return (
-    <textarea
+    <Textarea
       id={name}
+      autosize
+      maxRows={15}
+      minRows={3}
       {...field}
       {...other}
       className={cn('textarea textarea-bordered w-full', className, {

frontend/src/pages/admin/extensions/UpsertConfigurationDialog.tsx

@@ -113,7 +113,7 @@ export function UpsertConfigurationDialog(props: UpsertConfigurationDialogProps)
             />
             <ChatSuggestionsInput form={form} description={texts.theme.suggestionsHints(MAX_SUGGESTIONS)} />
           </fieldset>
-          <Flex gap="sm" justify={'end'}>
+          <Flex gap="sm" pt="sm" justify={'end'}>
             <Button onClick={onClose} variant="subtle">
               {texts.common.cancel}
             </Button>