From 1a83cce2f049c0e28c867f65c61ab1d19a9e9399 Mon Sep 17 00:00:00 2001
From: Cristhian Zanforlin Lousa <cristhian.lousa@gmail.com>
Date: Fri, 7 Jul 2023 15:16:57 -0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20fix(genericModal/index.tsx):=20f?=
 =?UTF-8?q?ix=20CSS=20class=20name=20in=20DialogContent=20to=20include=20g?=
 =?UTF-8?q?ap-2=20to=20add=20gap=20between=20elements=20=F0=9F=94=A7=20fix?=
 =?UTF-8?q?(genericModal/index.tsx):=20fix=20CSS=20class=20name=20in=20fle?=
 =?UTF-8?q?x=20container=20to=20change=20height=20to=20h-[55vh]=20?=
 =?UTF-8?q?=F0=9F=94=A7=20fix(genericModal/index.tsx):=20fix=20CSS=20class?=
 =?UTF-8?q?=20name=20in=20div=20container=20to=20change=20height=20to=20h-?=
 =?UTF-8?q?[60px]=20and=20adjust=20width=20for=20different=20screen=20size?=
 =?UTF-8?q?s=20=F0=9F=94=A7=20fix(genericModal/index.tsx):=20fix=20CSS=20c?=
 =?UTF-8?q?lass=20name=20in=20Badge=20component=20to=20add=20max-width=20a?=
 =?UTF-8?q?nd=20truncate=20long=20text=20=F0=9F=94=A7=20fix(genericModal/i?=
 =?UTF-8?q?ndex.tsx):=20fix=20logic=20to=20handle=20long=20text=20in=20Too?=
 =?UTF-8?q?ltip=20component=20and=20truncate=20it=20if=20necessary=20?=
 =?UTF-8?q?=F0=9F=94=A7=20fix(genericModal/index.tsx):=20fix=20logic=20to?=
 =?UTF-8?q?=20handle=20button=20click=20in=20DialogFooter=20component=20an?=
 =?UTF-8?q?d=20close=20modal=20if=20input=20value=20is=20empty?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/modals/genericModal/index.tsx         | 70 ++++++++++---------
 1 file changed, 36 insertions(+), 34 deletions(-)

diff --git a/src/frontend/src/modals/genericModal/index.tsx b/src/frontend/src/modals/genericModal/index.tsx
index 826ccf310..0c8e9dcba 100644
--- a/src/frontend/src/modals/genericModal/index.tsx
+++ b/src/frontend/src/modals/genericModal/index.tsx
@@ -171,7 +171,7 @@ export default function GenericModal({
   return (
     <Dialog open={true} onOpenChange={setModalOpen}>
       <DialogTrigger></DialogTrigger>
-      <DialogContent className="min-w-[80vw]">
+      <DialogContent className="min-w-[80vw] gap-2">
         <DialogHeader>
           <DialogTitle className="flex items-center">
             <span className="pr-2">{myModalTitle}</span>
@@ -200,7 +200,7 @@ export default function GenericModal({
         <div
           className={classNames(
             !isEdit ? "rounded-lg border" : "",
-            "flex h-[60vh] w-full"
+            "flex h-[55vh] w-full"
           )}
         >
           {type == TypeModal.PROMPT && isEdit ? (
@@ -238,40 +238,40 @@ export default function GenericModal({
 
         {type == TypeModal.PROMPT && (
           <>
-            <div className="h-[6vh] overflow-y-auto custom-scroll">
-              <div className="flex flex-wrap items-center">
-                <Variable className=" -ml-px mr-1 flex h-4 w-4 text-primary"></Variable>
-                <span className="text-md font-semibold text-primary">
-                  Input Variables:{" "}
-                  {wordsHighlight && wordsHighlight.length == 0 ? "-" : ""}
-                </span>
+          <div className="h-[60px] overflow-y-auto custom-scroll md:w-5/6 sm:6/6 mt-3">
+            <div className="flex flex-wrap items-center">
+              <Variable className=" -ml-px mr-1 flex h-4 w-4 text-primary"></Variable>
+              <span className="text-md font-semibold text-primary">
+                Input Variables:{" "}
+                {wordsHighlight && wordsHighlight.length == 0 ? "-" : ""}
+              </span>
 
-                {wordsHighlight.map((word, index) => (
-                  <ShadTooltip
-                    key={getRandomKeyByssmm() + index}
-                    content={word.replace(/[{}]/g, "")}
-                    asChild={false}
-                    delayDuration={1500}
+              {wordsHighlight.map((word, index) => (
+                <ShadTooltip
+                  key={getRandomKeyByssmm() + index}
+                  content={word.replace(/[{}]/g, "")}
+                  asChild={false}
+                  delayDuration={1500}
+                >
+                  <Badge
+                    key={index}
+                    variant="gray"
+                    size="md"
+                    className="m-1 max-w-[40vw] cursor-default truncate p-2.5 text-sm"
                   >
-                    <Badge
-                      key={index}
-                      variant="gray"
-                      size="md"
-                      className="m-1 max-w-[40vw] cursor-default truncate p-2.5 text-sm"
-                    >
-                      <div className="relative bottom-[1px]">
-                        <span>
-                          {word.replace(/[{}]/g, "").length > 59
-                            ? word.replace(/[{}]/g, "").slice(0, 56) + "..."
-                            : word.replace(/[{}]/g, "")}
-                        </span>
-                      </div>
-                    </Badge>
-                  </ShadTooltip>
-                ))}
-              </div>
+                    <div className="relative bottom-[1px]">
+                      <span>
+                        {word.replace(/[{}]/g, "").length > 59
+                          ? word.replace(/[{}]/g, "").slice(0, 56) + "..."
+                          : word.replace(/[{}]/g, "")}
+                      </span>
+                    </div>
+                  </Badge>
+                </ShadTooltip>
+              ))}
             </div>
-          </>
+          </div>
+        </>
         )}
 
         <DialogFooter>
@@ -284,7 +284,9 @@ export default function GenericModal({
                   setModalOpen(false);
                   break;
                 case 2:
-                  validatePrompt(false);
+                  !inputValue || inputValue == ""
+                    ? setModalOpen(false)
+                    : validatePrompt(false);
                   break;
 
                 default: