From 5cae58dead51a793c34d67756d54da8b11edd701 Mon Sep 17 00:00:00 2001
From: igorrCarvalho <igorsilvabhz6@gmail.com>
Date: Wed, 6 Sep 2023 14:44:13 -0300
Subject: [PATCH 1/3] Refactor: Remove blank space when node has no description

---
 src/frontend/src/CustomNodes/GenericNode/index.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx
index 30dda4034..ded319457 100644
--- a/src/frontend/src/CustomNodes/GenericNode/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx
@@ -159,7 +159,9 @@ export default function GenericNode({
         </div>
 
         <div className="generic-node-desc">
-          <div className="generic-node-desc-text">{data.node?.description}</div>
+          {data.node?.description !== "" && (
+            <div className="generic-node-desc-text">{data.node?.description}</div>
+          )}
 
           <>
             {Object.keys(data.node!.template)

From c21583e13b9f48b5edb05b1c518b4da7412a172a Mon Sep 17 00:00:00 2001
From: igorrCarvalho <igorsilvabhz6@gmail.com>
Date: Fri, 8 Sep 2023 17:42:57 -0300
Subject: [PATCH 2/3] Refactor: Remove description space whem node does not
 have a space

---
 src/frontend/src/CustomNodes/GenericNode/index.tsx | 2 +-
 src/frontend/src/style/applies.css                 | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx
index ded319457..388020f22 100644
--- a/src/frontend/src/CustomNodes/GenericNode/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx
@@ -158,7 +158,7 @@ export default function GenericNode({
           </div>
         </div>
 
-        <div className="generic-node-desc">
+        <div className={"generic-node-desc " + (data.node?.description !== "" ? "py-5" : "pb-5")}>
           {data.node?.description !== "" && (
             <div className="generic-node-desc-text">{data.node?.description}</div>
           )}
diff --git a/src/frontend/src/style/applies.css b/src/frontend/src/style/applies.css
index 685d81b05..714a3bdcb 100644
--- a/src/frontend/src/style/applies.css
+++ b/src/frontend/src/style/applies.css
@@ -303,7 +303,7 @@
     @apply hover:text-accent-foreground hover:transition-all;
   }
   .generic-node-desc {
-    @apply h-full w-full py-5 text-foreground;
+    @apply h-full w-full  text-foreground;
   }
   .generic-node-desc-text {
     @apply w-full px-5 pb-3 text-sm text-muted-foreground;

From c18536d1ff6ed899f4e3014587fee796fbbb14a1 Mon Sep 17 00:00:00 2001
From: igorrCarvalho <igorsilvabhz6@gmail.com>
Date: Mon, 11 Sep 2023 15:50:18 -0300
Subject: [PATCH 3/3] Refactor: Add header to node tooltips

---
 .../components/parameterComponent/index.tsx   | 75 +++++++++++--------
 1 file changed, 42 insertions(+), 33 deletions(-)

diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
index 94cc939ff..3140c3b62 100644
--- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
@@ -118,45 +118,54 @@ export default function ParameterComponent({
           nodeIconsLucide[item.family] ?? nodeIconsLucide["unknown"];
 
         return (
-          <span
-            key={index}
-            className={classNames(
-              index > 0 ? "mt-2 flex items-center" : "flex items-center"
-            )}
-          >
-            <div
-              className="h-5 w-5"
-              style={{
-                color: nodeColors[item.family],
-              }}
-            >
-              <Icon
+          <>
+            {index === 0 && (
+                <span>
+                  {left ? "Components to connect into:" : "Components to connect to:"}
+                </span>
+              )
+            }
+            <span
+              key={index}
+              className={classNames(
+                index > 0 ? "mt-2 flex items-center" : "mt-3 flex items-center"
+              )}
+              >
+              <div
                 className="h-5 w-5"
-                strokeWidth={1.5}
                 style={{
-                  color: nodeColors[item.family] ?? nodeColors.unknown,
+                  color: nodeColors[item.family],
                 }}
-              />
-            </div>
-            <span className="ps-2 text-xs text-foreground">
-              {nodeNames[item.family] ?? "Other"}
-              <span className="text-xs">
+              >
+                <Icon
+                  className="h-5 w-5"
+                  strokeWidth={1.5}
+                  style={{
+                    color: nodeColors[item.family] ?? nodeColors.unknown,
+                  }}
+                />
+              </div>
+              <span className="ps-2 text-xs text-foreground">
+                {nodeNames[item.family] ?? "Other"}
                 {" "}
-                {item.type === "" ? "" : " - "}
-                {item.type.split(", ").length > 2
-                  ? item.type.split(", ").map((el, index) => (
-                      <React.Fragment key={el + index}>
-                        <span>
-                          {index === item.type.split(", ").length - 1
-                            ? el
-                            : (el += `, `)}
-                        </span>
-                      </React.Fragment>
-                    ))
-                  : item.type}
+                <span className="text-xs">
+                  {" "}
+                  {item.type === "" ? "" : " - "}
+                  {item.type.split(", ").length > 2
+                    ? item.type.split(", ").map((el, index) => (
+                        <React.Fragment key={el + index}>
+                          <span>
+                            {index === item.type.split(", ").length - 1
+                              ? el
+                              : (el += `, `)}
+                          </span>
+                        </React.Fragment>
+                      ))
+                    : item.type}
+                </span>
               </span>
             </span>
-          </span>
+          </>
         );
       });
     } else {