From 1b6e61d3cb16e4cf8397e1ad3be18409fbd22b6d Mon Sep 17 00:00:00 2001
From: Gabriel Almeida <gabriel@logspace.ai>
Date: Tue, 2 May 2023 18:46:41 -0300
Subject: [PATCH] style(inputComponent): fix indentation and spacing in
 InputComponent component

---
 .../src/components/inputComponent/index.tsx   | 143 ++++++++++--------
 1 file changed, 76 insertions(+), 67 deletions(-)

diff --git a/src/frontend/src/components/inputComponent/index.tsx b/src/frontend/src/components/inputComponent/index.tsx
index 164d00704..72e05a2c8 100644
--- a/src/frontend/src/components/inputComponent/index.tsx
+++ b/src/frontend/src/components/inputComponent/index.tsx
@@ -3,75 +3,84 @@ import { InputComponentType } from "../../types/components";
 import { classNames } from "../../utils";
 
 export default function InputComponent({
-	value,
-	onChange,
-	disabled,
-	password,
+  value,
+  onChange,
+  disabled,
+  password,
 }: InputComponentType) {
-	const [myValue, setMyValue] = useState(value ?? "");
-	const [pwdVisable, setPwdVisable] = useState(false)
-	useEffect(() => {
-		if (disabled) {
-			setMyValue("");
-			onChange("");
-		}
-	}, [disabled, onChange]);
-	return (
-		<div className={disabled ? "relative pointer-events-none cursor-not-allowed" : "relative"}>
-			<input
-				type={password && !pwdVisable ? "password" : "text"}
-				value={myValue}
-				className={classNames(
-					"block w-full form-input dark:bg-gray-900 dark:border-gray-600 rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm",
-					disabled ? " bg-gray-200 dark:bg-gray-700" : "",
-				)}
-				placeholder="Type a text"
-				onChange={(e) => {
-					setMyValue(e.target.value);
-					onChange(e.target.value);
-				}}
-			/>
-			<button
+  const [myValue, setMyValue] = useState(value ?? "");
+  const [pwdVisible, setPwdVisible] = useState(false);
+  useEffect(() => {
+    if (disabled) {
+      setMyValue("");
+      onChange("");
+    }
+  }, [disabled, onChange]);
+  return (
+    <div
+      className={
+        disabled
+          ? "relative pointer-events-none cursor-not-allowed"
+          : "relative"
+      }
+    >
+      <input
+        type={password && !pwdVisible ? "password" : "text"}
+        value={myValue}
+        className={classNames(
+          "block w-full form-input dark:bg-gray-900 dark:border-gray-600 rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm",
+          disabled ? " bg-gray-200 dark:bg-gray-700" : ""
+        )}
+        placeholder="Type a text"
+        onChange={(e) => {
+          setMyValue(e.target.value);
+          onChange(e.target.value);
+        }}
+      />
+      <button
         className="absolute inset-y-0 right-0 items-center px-4 text-gray-600"
-        onClick={() => {setPwdVisable(!pwdVisable)}}
+        onClick={() => {
+          setPwdVisible(!pwdVisible);
+        }}
       >
-        {password && (pwdVisable ? (
-          <svg
-            xmlns="http://www.w3.org/2000/svg"
-            fill="none"
-            viewBox="0 0 24 24"
-            strokeWidth={1.5}
-            stroke="currentColor"
-            className="w-5 h-5"
-          >
-            <path
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              d="M3.98 8.223A10.477 10.477 0 001.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.45 10.45 0 0112 4.5c4.756 0 8.773 3.162 10.065 7.498a10.523 10.523 0 01-4.293 5.774M6.228 6.228L3 3m3.228 3.228l3.65 3.65m7.894 7.894L21 21m-3.228-3.228l-3.65-3.65m0 0a3 3 0 10-4.243-4.243m4.242 4.242L9.88 9.88"
-            />
-          </svg>
-        ) : (
-          <svg
-            xmlns="http://www.w3.org/2000/svg"
-            fill="none"
-            viewBox="0 0 24 24"
-            strokeWidth={1.5}
-            stroke="currentColor"
-            className="w-5 h-5"
-          >
-            <path
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              d="M2.036 12.322a1.012 1.012 0 010-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178z"
-            />
-            <path
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"
-            />
-          </svg>
-        ))}
+        {password &&
+          (pwdVisible ? (
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              fill="none"
+              viewBox="0 0 24 24"
+              strokeWidth={1.5}
+              stroke="currentColor"
+              className="w-5 h-5"
+            >
+              <path
+                strokeLinecap="round"
+                strokeLinejoin="round"
+                d="M3.98 8.223A10.477 10.477 0 001.934 12C3.226 16.338 7.244 19.5 12 19.5c.993 0 1.953-.138 2.863-.395M6.228 6.228A10.45 10.45 0 0112 4.5c4.756 0 8.773 3.162 10.065 7.498a10.523 10.523 0 01-4.293 5.774M6.228 6.228L3 3m3.228 3.228l3.65 3.65m7.894 7.894L21 21m-3.228-3.228l-3.65-3.65m0 0a3 3 0 10-4.243-4.243m4.242 4.242L9.88 9.88"
+              />
+            </svg>
+          ) : (
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              fill="none"
+              viewBox="0 0 24 24"
+              strokeWidth={1.5}
+              stroke="currentColor"
+              className="w-5 h-5"
+            >
+              <path
+                strokeLinecap="round"
+                strokeLinejoin="round"
+                d="M2.036 12.322a1.012 1.012 0 010-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178z"
+              />
+              <path
+                strokeLinecap="round"
+                strokeLinejoin="round"
+                d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"
+              />
+            </svg>
+          ))}
       </button>
-		</div>
-	);
+    </div>
+  );
 }