From 25235a0d1148a18360b58801f9e15657e959fca8 Mon Sep 17 00:00:00 2001
From: Cristhian Zanforlin Lousa <cristhian.lousa@gmail.com>
Date: Thu, 20 Jul 2023 18:40:24 -0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20chore(textarea.tsx):=20refactor?=
 =?UTF-8?q?=20textarea=20component=20class=20names=20for=20improved=20read?=
 =?UTF-8?q?ability=20and=20maintainability=20=F0=9F=94=A7=20chore(index.cs?=
 =?UTF-8?q?s):=20refactor=20input-primary=20class=20to=20remove=20unnecess?=
 =?UTF-8?q?ary=20styles=20and=20improve=20readability=20=F0=9F=94=A7=20cho?=
 =?UTF-8?q?re(index.css):=20add=20new=20textarea-primary=20class=20for=20t?=
 =?UTF-8?q?extarea=20component=20with=20similar=20styles=20as=20input-prim?=
 =?UTF-8?q?ary=20but=20without=20truncation=20=F0=9F=94=A7=20chore(chatInp?=
 =?UTF-8?q?ut/index.tsx):=20replace=20textarea=20element=20with=20Textarea?=
 =?UTF-8?q?=20component=20for=20consistency=20and=20reusability?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/components/ui/textarea.tsx           |  2 +-
 src/frontend/src/index.css                            | 10 +++++++---
 src/frontend/src/modals/formModal/chatInput/index.tsx |  3 ++-
 3 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/frontend/src/components/ui/textarea.tsx b/src/frontend/src/components/ui/textarea.tsx
index 64aec41a1..2dcafa1f9 100644
--- a/src/frontend/src/components/ui/textarea.tsx
+++ b/src/frontend/src/components/ui/textarea.tsx
@@ -9,7 +9,7 @@ const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
     return (
       <textarea
         className={cn(
-          "flex min-h-[80px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+          "textarea-primary nopan nodrag noundo nocopy",
           className
         )}
         ref={ref}
diff --git a/src/frontend/src/index.css b/src/frontend/src/index.css
index ca1a4a207..a7e04d3da 100644
--- a/src/frontend/src/index.css
+++ b/src/frontend/src/index.css
@@ -239,11 +239,15 @@ The cursor: default; property value restores the browser's default cursor style
   .button-div-style {
     @apply gap-2 flex
   }
- 
   .input-primary{
-    @apply placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 focus:placeholder-transparent focus:ring-ring focus:border-ring bg-background block text-left border-border form-input px-3 placeholder:text-muted-foreground rounded-md shadow-sm sm:text-sm truncate w-full
+    @apply disabled:cursor-not-allowed disabled:opacity-50 focus:placeholder-transparent focus:ring-ring focus:border-ring bg-background block text-left border-border form-input px-3 placeholder:text-muted-foreground rounded-md shadow-sm sm:text-sm w-full truncate
   }
-
+  
+/* The same as input-primary but no-truncate*/
+  .textarea-primary{
+    @apply disabled:cursor-not-allowed disabled:opacity-50 focus:placeholder-transparent focus:ring-ring focus:border-ring bg-background block text-left border-border form-input px-3 placeholder:text-muted-foreground rounded-md shadow-sm sm:text-sm w-full
+  }
+  
   .input-edit-node{
     @apply input-primary border-border pt-0.5 pb-0.5 text-left w-full
   }
diff --git a/src/frontend/src/modals/formModal/chatInput/index.tsx b/src/frontend/src/modals/formModal/chatInput/index.tsx
index 63f224e92..e03078a10 100644
--- a/src/frontend/src/modals/formModal/chatInput/index.tsx
+++ b/src/frontend/src/modals/formModal/chatInput/index.tsx
@@ -1,6 +1,7 @@
 import { useEffect } from "react";
 import IconComponent from "../../../components/genericIconComponent";
 import { classNames } from "../../../utils/utils";
+import { Textarea } from "../../../components/ui/textarea";
 
 export default function ChatInput({
   lockChat,
@@ -25,7 +26,7 @@ export default function ChatInput({
 
   return (
     <div className="relative">
-      <textarea
+      <Textarea 
         onKeyDown={(event) => {
           if (event.key === "Enter" && !lockChat && !event.shiftKey) {
             sendMessage();