Readme, screenshot and comments

CookedIdeas · CookedIdeas · commit 4d8bbe5cbfa0 · 2023-11-13T10:30:59.000+01:00
diff --git a/README.md b/README.md
@@ -8,17 +8,25 @@ Project currently in development.
 
 ## Features
 
-To fullfill
+- A responsive form using useform hook
+- Inform user : if there is errors in inputs fulfillment, if submission is successful, if submission is not successful
+- All inputs data from an array
+
+To test it, set VITE_IS_TEST as true in .env
+
+For production, change api url to yours in .env VITE_API_URL='your-api-url' and in utils/index.jsx → usePostForm hook → customFetch.post('/your-api-route', mailBody)
 
 ## Project
 
 React powered by [Vite](https://vitejs.dev/)
 
 With :
 
-- [TailwindCss](https://tailwindcss.com/) & [DaisyUI](https://daisyui.com/) for styling
 - [@tanstack/react-query](https://tanstack.com/query/v3/)
 - [react-hook-form - useForm](https://react-hook-form.com/)
+- [react-toastify](react-toastify) for beautiful toaster
+- [miragejs](https://miragejs.com) to mockup server response
+- [TailwindCss](https://tailwindcss.com/) & [DaisyUI](https://daisyui.com/) for styling
 
 ## Use it !
 
diff --git a/images/screenshot.png b/images/screenshot.png
diff --git a/index.html b/index.html
@@ -2,7 +2,6 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>React form</title>
   </head>
diff --git a/src/App.jsx b/src/App.jsx
@@ -37,7 +37,7 @@ function App() {
     postForm(formAnswers);
   };
 
-  // toggle form
+  // === Fold form === //
 
   const [foldForm, setFoldForm] = useState(false);
 
@@ -50,15 +50,13 @@ function App() {
   const [errorTypesArray, setErrorTypesArray] = useState([]);
 
   const validateForm = () => {
+    // if no error, return
     if (Object.entries(errors).length === 0) return;
-    console.log('error presence');
-    console.log(errors);
 
     // transform error object to array
     const errorsAsArray = Object.entries(errors);
 
-    // loop thru errorsAsArray and test error types
-
+    // loop thru errorsAsArray and store error types in errorTypesArray state
     let tempErrorArray = [];
     if (errorsAsArray.length > 0) {
       errorsAsArray.map((singleError) => {
@@ -68,6 +66,8 @@ function App() {
     }
   };
 
+  // check errors types in errorTypesArray state
+  // for each type, trigger a toast
   useEffect(() => {
     // if error type required or pattern → trigger toastify with info
     errorTypesArray.includes('required') &&
