use textarea instead of chat input

app/src/assets/pages/home.less

@@ -678,14 +678,15 @@
       .chat-box {
         position: relative;
         flex-grow: 1;
-        margin-right: 4px;
       }
 
       .input-box {
+        resize: none;
         width: 100%;
         color: hsl(var(--text));
         white-space: pre-wrap;
-        padding-right: 0.25rem;
+        scrollbar-width: thin;
+        padding-right: 3rem;
 
         &.align {
           text-align: center;
@@ -719,7 +720,10 @@
       }
 
       .action-button {
+        position: absolute;
         padding: 0 6px;
+        right: 0.5rem;
+        bottom: 0.5rem;
 
         .send-icon {
           fill: hsl(var(--text));

app/src/components/home/assemblies/ChatInput.tsx

@@ -1,11 +1,11 @@
-import { Input } from "@/components/ui/input.tsx";
 import React from "react";
 import { setMemory } from "@/utils/memory.ts";
 import { useTranslation } from "react-i18next";
+import {Textarea} from "@/components/ui/textarea.tsx";
 
 type ChatInputProps = {
   className?: string;
-  target?: React.RefObject<HTMLInputElement>;
+  target?: React.RefObject<HTMLTextAreaElement>;
   value: string;
   onValueChange: (value: string) => void;
   onEnterPressed: () => void;
@@ -19,20 +19,29 @@ function ChatInput({
   onEnterPressed,
 }: ChatInputProps) {
   const { t } = useTranslation();
+  const [stamp, setStamp] = React.useState(0);
 
   return (
-    <Input
+    <Textarea
       id={`input`}
       className={`input-box ${className || ""}`}
       ref={target}
       value={value}
-      onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
+      rows={3}
+      onChange={(e) => {
         onValueChange(e.target.value);
         setMemory("history", e.target.value);
       }}
       placeholder={t("chat.placeholder")}
-      onKeyDown={async (e: React.KeyboardEvent<HTMLInputElement>) => {
-        if (e.key === "Enter") onEnterPressed();
+      onKeyDown={async (e) => {
+        if (e.key === "Control") {
+          setStamp(Date.now());
+        } else if (e.key === "Enter" && !e.shiftKey) {
+          if (stamp > 0 && Date.now() - stamp < 200) {
+            e.preventDefault();
+            onEnterPressed();
+          }
+        }
       }}
     />
   );

app/src/store/settings.ts

@@ -7,7 +7,7 @@ export const settingsSlice = createSlice({
   initialState: {
     dialog: false,
     context: getMemory("context") !== "false",
-    align: getMemory("align") !== "false",
+    align: getMemory("align") === "true",
   },
   reducers: {
     toggleDialog: (state) => {