code tydyup

Author: rbhachu

README.md

@@ -11,7 +11,7 @@ The components allow very easy control via props to change page titles, submit b
 <br />
 
 ### How you would add new pages?
-The app uses a 'views' approach, so new components can easily be added to the signup view page by linking to new components from the componenets directory. Then also adding them to the progress component in the signup views page too.
+The app uses a 'views' approach, so new components can easily be added to the signup view page by linking to new components from the components directory. Then also adding them to the progress component in the signup views page too.
 <br />
 
 ### How you would implement going back a page?
@@ -20,18 +20,18 @@ The components feature props to enable/disable a dynamic 'Back' button as outlin
 
 
 ## Features
-- Mult-Step Signup Form
+- Multi-Step Signup Form
 - Form Progression Path
 - Modular/Scalable App
 - Form Validation
 - Custom fav icon
-- Lazyloading for image and components
-- React Testing Library pass???
+- Lazy Loading for image and components
+- React Testing Library pass
 - PWA testing pass
 - Lighthouse testing pass
 - HTML testing pass
 - CSS testing pass
-- Accesability testing pass
+- Accessibility testing pass
 <br />
 
 ## Run

src/components/form-completed/index.js

@@ -22,11 +22,11 @@ function FormUserResult({ pageTitle, successMessage }) {
           <img 
             className="fade-in-image"
             src={IMGgreentick} 
-            alt={successMessage || 'Thanks1!'}
+            alt={successMessage || 'Success!'}
           />
 
           <p>
-            {successMessage || 'Thanks2!'}
+            {successMessage || 'Thank you, please check your email1!'}
           </p>
 
       </div>

src/components/form-privacy/index.js

@@ -8,48 +8,32 @@ function FormUserPrivacy({ pageTitle, submitButtonText, previousButton }) {
   // redux
   const dispatch = useDispatch();
 
+  // get Redux store values for formUserPrivacy
   const currentStage = useSelector(state => state.FormStage) // for previous button
   const stateSignup1 = useSelector(state => state.FormUserPrivacy.signup1)
   const stateSignup2 = useSelector(state => state.FormUserPrivacy.signup2)
 
-  //const stateAll = useSelector(state => state)
-  //console.log(`output: ${JSON.stringify(stateAll, null, 2)}`) // output results to console.log
-
-
   // form values initial state - getting from redux
   const [formData, setFormData] = useState({
-    //signup1: stateSignup1 === "yes" ? true : false,
-    //signup2: stateSignup2 === "yes" ? true : false
-
-    //signup1: stateSignup1 ? true : 'false1',
-    //signup2: stateSignup2 ? true : 'false2'
-    
-    signup1: stateSignup1 ? true : false,
-    signup2: stateSignup2 ? true : false
-    
-    //signup1: stateSignup1 || false,
-    //signup2: stateSignup2 || false
-
-    //signup1: stateSignup1, // add if empty then false!
-    //signup2: stateSignup2
+    signup1: stateSignup1,
+    signup2: stateSignup2
   })
 
-  
   // form values onchange
   const [isChecked1, setIsChecked1] = useState(formData.signup1);
   const [isChecked2, setIsChecked2] = useState(formData.signup2);
 
+  // form values onchange
   const handleChange1 = (e) => {  
     setIsChecked1(!isChecked1);
-    isChecked1 ? setFormData({signup1: true }) : setFormData({signup1: false })
+    !isChecked1 ? setFormData({signup1: true }) : setFormData({signup1: false })
   }
   const handleChange2 = (e) => {
     setIsChecked2(!isChecked2);
-    isChecked2 ? setFormData({signup2: true }) : setFormData({signup2: false })
+    !isChecked2 ? setFormData({signup2: true }) : setFormData({signup2: false })
   }
 
   // onsubmit
-  //const handleSubmit = (e) => {
   const handleSubmit = (e) => {
     e.preventDefault(); // stop form submission
 
@@ -61,21 +45,17 @@ function FormUserPrivacy({ pageTitle, submitButtonText, previousButton }) {
 
     // update Redux Slice
     dispatch(
-      formStage(3) // update formStage
+      formStage(3) // update formStage and move to next stage
     )
     dispatch(
       formPrivacy({
-        //signup1: formData.signup1,
-        //signup2: formData.signup2
-
-        signup1: formData.signup1 ? true : false,
-        signup2: formData.signup2 ? true : false
+        signup1: formData.signup1,
+        signup2: formData.signup2
       })
     );
 
   }
 
-
   return (
 
     <>
@@ -94,11 +74,9 @@ function FormUserPrivacy({ pageTitle, submitButtonText, previousButton }) {
             id="signup1"
             name="signup1"
             //value={formData.signup1}
-            checked={!!formData.signup1}
-            //checked={isChecked1}
             //onClick={handleChange1}
+            //onChange={handleChange1}
             onChange={(e) => handleChange1(e)}
-            //checked
           />
           <label htmlFor="signup1">Recieve updates about Tray.io product by email</label>
         </p>
@@ -109,11 +87,9 @@ function FormUserPrivacy({ pageTitle, submitButtonText, previousButton }) {
             id="signup2"
             name="signup2"
             //value={formData.signup2}
-            checked={!!formData.signup2}
-            //checked={isChecked2}
             //onClick={handleChange2}
+            //onChange={handleChange2}
             onChange={(e) => handleChange2(e)}
-            //checked
           />
           <label htmlFor="signup2">Recieve communication by email for other products created by the Tray.io team</label>
         </p>