From 071c1f5259c38c3d5a428427e0a2ead80f84aeb9 Mon Sep 17 00:00:00 2001
From: Alberto Defendi <1369-ahl-berto@users.noreply.gitlab.inf.unibz.it>
Date: Thu, 15 Apr 2021 13:49:05 +0200
Subject: [PATCH] Document components using styleguidist

---
 .../SignInForm/InputField/InputField.md       | 24 +++++++++++++++++++
 .../SignInForm/InputField/InputField.tsx      | 17 +++++++++++--
 .../AuthUser/SignInForm/SignInForm.tsx        |  2 --
 .../AuthUser/SignInForm/emailValidator.ts     | 10 --------
 4 files changed, 39 insertions(+), 14 deletions(-)
 create mode 100644 src/components/AuthUser/SignInForm/InputField/InputField.md
 delete mode 100644 src/components/AuthUser/SignInForm/emailValidator.ts

diff --git a/src/components/AuthUser/SignInForm/InputField/InputField.md b/src/components/AuthUser/SignInForm/InputField/InputField.md
new file mode 100644
index 0000000..895642c
--- /dev/null
+++ b/src/components/AuthUser/SignInForm/InputField/InputField.md
@@ -0,0 +1,24 @@
+Wrapper for any input field 
+
+```js
+import { SubmitHandler, useForm } from 'react-hook-form';
+const { control } = useForm();
+
+<InputField
+    name="password"
+    control={control}
+    rules={{
+    minLength: 8,
+    maxLength: 60,
+    required: {
+        value: true,
+        message: 'Insert valid password',
+    },
+    }}
+    label="Password"
+    error={false}
+    errorMessage="Insert valid password"
+/>
+
+
+```
diff --git a/src/components/AuthUser/SignInForm/InputField/InputField.tsx b/src/components/AuthUser/SignInForm/InputField/InputField.tsx
index a0093c9..6bfdc9a 100644
--- a/src/components/AuthUser/SignInForm/InputField/InputField.tsx
+++ b/src/components/AuthUser/SignInForm/InputField/InputField.tsx
@@ -4,16 +4,29 @@ import { Control, Controller, FieldValues } from 'react-hook-form';
 
 type Props = {
   /**
-   * Name of the elemement. ex. email, password
+   * Name of the elemement. (ex. email, password).
    */
   name: string;
+  /**
+   * Aria label.
+   */
   label: string;
+  /**
+   * Takes error from react-hook-form and is thrown if
+   * the component is not valid.
+   */
   error: boolean;
+  /**
+   * Message to display if the component is not valid.
+   */
   errorMessage: string;
   /**
-   * react-hook-form control
+   * React-hook-form control.
    */
   control: Control<FieldValues> | undefined;
+  /**
+   * Validation rules.
+   */
   rules: Partial<unknown>;
 };
 
diff --git a/src/components/AuthUser/SignInForm/SignInForm.tsx b/src/components/AuthUser/SignInForm/SignInForm.tsx
index 9432ee9..b2f3884 100644
--- a/src/components/AuthUser/SignInForm/SignInForm.tsx
+++ b/src/components/AuthUser/SignInForm/SignInForm.tsx
@@ -3,7 +3,6 @@ import axios from 'axios';
 import { SubmitHandler, useForm } from 'react-hook-form';
 import { createStyles, makeStyles, Theme } from '@material-ui/core/styles';
 import { Button } from '@material-ui/core';
-import { DevTool } from '@hookform/devtools';
 import { InputField } from 'components/AuthUser/SignInForm/InputField/InputField';
 
 const useStyles = makeStyles((theme: Theme) =>
@@ -104,7 +103,6 @@ export const SignInForm: FC = () => {
           Sign In
         </Button>
       </form>
-      <DevTool control={control} /> {/* set up the dev tool */}
     </>
   );
 };
diff --git a/src/components/AuthUser/SignInForm/emailValidator.ts b/src/components/AuthUser/SignInForm/emailValidator.ts
deleted file mode 100644
index 122f501..0000000
--- a/src/components/AuthUser/SignInForm/emailValidator.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-export const isEmailValid = (email: string): boolean => {
-  /**
-   * The following is the RFC 5322 valid email regex
-   * Hinted from question https://stackoverflow.com/questions/201323/how-to-validate-an-email-address-using-a-regular-expression
-   * More on http://emailregex.com/
-   */
-  // eslint-disable-next-line
-  const VALID_EMAIL_REGEX = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
-  return VALID_EMAIL_REGEX.test(String(email).toLowerCase());
-};
-- 
GitLab