From 2148a57a4c15982f10f6c58a73eb12b42cab43b2 Mon Sep 17 00:00:00 2001
From: amit kumar <mohapatraamitkumar450@gmail.com>
Date: Fri, 6 Oct 2023 22:40:47 +0530
Subject: [PATCH 1/3] Fix the check box and input for mobile UI

---
 src/components/PasswordGenerator.jsx | 42 +++++++++++++++-------------
 1 file changed, 22 insertions(+), 20 deletions(-)

diff --git a/src/components/PasswordGenerator.jsx b/src/components/PasswordGenerator.jsx
index 9fc1358..279e593 100644
--- a/src/components/PasswordGenerator.jsx
+++ b/src/components/PasswordGenerator.jsx
@@ -157,26 +157,28 @@ const PasswordGenerator = () => {
               onChange={(e) => setPasswordLength(e.target.value)}
             />
           </div>
-          <CheckBoxWithLabel
-            label="uppercase"
-            isChecked={checkBox.uppercase}
-            handleCheckBoxClick={handleCheckBoxClick}
-          />
-          <CheckBoxWithLabel
-            label="lowercase"
-            isChecked={checkBox.lowercase}
-            handleCheckBoxClick={handleCheckBoxClick}
-          />
-          <CheckBoxWithLabel
-            label="numbers"
-            isChecked={checkBox.numbers}
-            handleCheckBoxClick={handleCheckBoxClick}
-          />
-          <CheckBoxWithLabel
-            label="specialChar"
-            isChecked={checkBox.specialChar}
-            handleCheckBoxClick={handleCheckBoxClick}
-          />
+          <div style={{display:"flex", flexDirection: "column"}}>
+            <CheckBoxWithLabel
+              label="uppercase"
+              isChecked={checkBox.uppercase}
+              handleCheckBoxClick={handleCheckBoxClick}
+            />
+            <CheckBoxWithLabel
+              label="lowercase"
+              isChecked={checkBox.lowercase}
+              handleCheckBoxClick={handleCheckBoxClick}
+            />
+            <CheckBoxWithLabel
+              label="numbers"
+              isChecked={checkBox.numbers}
+              handleCheckBoxClick={handleCheckBoxClick}
+            />
+            <CheckBoxWithLabel
+              label="specialChar"
+              isChecked={checkBox.specialChar}
+              handleCheckBoxClick={handleCheckBoxClick}
+            />
+          </div>
           <div className="mt-4">
             <label className="block text-gray-700 dark:text-white text-sm font-bold mb-2">
               Exclude Characters:

From 5462bce448d911479c87676894d36e8ea8500f3f Mon Sep 17 00:00:00 2001
From: amit kumar <mohapatraamitkumar450@gmail.com>
Date: Sat, 7 Oct 2023 00:45:35 +0530
Subject: [PATCH 2/3] code is refactored for check box options

---
 src/components/PasswordGenerator.jsx | 39 ++++++++++++++--------------
 1 file changed, 19 insertions(+), 20 deletions(-)

diff --git a/src/components/PasswordGenerator.jsx b/src/components/PasswordGenerator.jsx
index 279e593..feced5f 100644
--- a/src/components/PasswordGenerator.jsx
+++ b/src/components/PasswordGenerator.jsx
@@ -30,6 +30,13 @@ const PasswordGenerator = () => {
     },
   ];
 
+  const checkBoxOptions = [
+    { label: 'uppercase', key: 'uppercase' },
+    { label: 'lowercase', key: 'lowercase' },
+    { label: 'numbers', key: 'numbers' },
+    { label: 'specialChar', key: 'specialChar' }
+  ];
+  
   // Character generators for each option
   const generators = {
     uppercase: () => {
@@ -94,7 +101,9 @@ const PasswordGenerator = () => {
     setMessage("Create. Protect. Secure. Generate your password now");
     setIsUserError(false);
   };
+  
 
+  // console.log(checkBoxes)
   return (
     <section className="text-gray-600 body-font dark:text-gray-400">
       <div className="container max-w-screen-xl mx-auto flex px-5 py-24 md:flex-row flex-col items-center">
@@ -158,26 +167,16 @@ const PasswordGenerator = () => {
             />
           </div>
           <div style={{display:"flex", flexDirection: "column"}}>
-            <CheckBoxWithLabel
-              label="uppercase"
-              isChecked={checkBox.uppercase}
-              handleCheckBoxClick={handleCheckBoxClick}
-            />
-            <CheckBoxWithLabel
-              label="lowercase"
-              isChecked={checkBox.lowercase}
-              handleCheckBoxClick={handleCheckBoxClick}
-            />
-            <CheckBoxWithLabel
-              label="numbers"
-              isChecked={checkBox.numbers}
-              handleCheckBoxClick={handleCheckBoxClick}
-            />
-            <CheckBoxWithLabel
-              label="specialChar"
-              isChecked={checkBox.specialChar}
-              handleCheckBoxClick={handleCheckBoxClick}
-            />
+          
+            {checkBoxOptions.map(option => (
+             <CheckBoxWithLabel
+               key={option.key}
+               label={option.label}
+               isChecked={checkBox[option.key]}
+               handleCheckBoxClick={handleCheckBoxClick}
+             />
+            ))}
+
           </div>
           <div className="mt-4">
             <label className="block text-gray-700 dark:text-white text-sm font-bold mb-2">

From c7bd55a92aa98a74dad02b515de4718ba6463c70 Mon Sep 17 00:00:00 2001
From: amit kumar <mohapatraamitkumar450@gmail.com>
Date: Sat, 7 Oct 2023 00:49:01 +0530
Subject: [PATCH 3/3] code is refactored for check box options

---
 src/components/PasswordGenerator.jsx | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/components/PasswordGenerator.jsx b/src/components/PasswordGenerator.jsx
index feced5f..5472f91 100644
--- a/src/components/PasswordGenerator.jsx
+++ b/src/components/PasswordGenerator.jsx
@@ -101,9 +101,7 @@ const PasswordGenerator = () => {
     setMessage("Create. Protect. Secure. Generate your password now");
     setIsUserError(false);
   };
-  
 
-  // console.log(checkBoxes)
   return (
     <section className="text-gray-600 body-font dark:text-gray-400">
       <div className="container max-w-screen-xl mx-auto flex px-5 py-24 md:flex-row flex-col items-center">