From b9096117bcef411582ece4ffc2ae52ad1745e3e9 Mon Sep 17 00:00:00 2001
From: Ebube <ebube.ojinta@chiefsoft.com>
Date: Sun, 6 Aug 2023 23:46:03 +0100
Subject: [PATCH 1/2] updateprofile payload updated

---
 .../Settings/Tabs/PersonalInfoTab.jsx         | 80 ++++++++++++-------
 1 file changed, 53 insertions(+), 27 deletions(-)

diff --git a/src/components/Settings/Tabs/PersonalInfoTab.jsx b/src/components/Settings/Tabs/PersonalInfoTab.jsx
index 096f277..0ee4009 100644
--- a/src/components/Settings/Tabs/PersonalInfoTab.jsx
+++ b/src/components/Settings/Tabs/PersonalInfoTab.jsx
@@ -1,13 +1,11 @@
 import React, { useEffect, useState } from "react";
 import { useSelector } from "react-redux";
-import { Link, useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 import usersService from "../../../services/UsersService";
 import Icons from "../../Helpers/Icons";
 import InputCom from "../../Helpers/Inputs/InputCom";
 import LoadingSpinner from "../../Spinners/LoadingSpinner";
 
-import { toast } from "react-toastify";
-
 import { Form, Formik } from "formik";
 import * as Yup from "yup";
 
@@ -69,6 +67,10 @@ export default function PersonalInfoTab({
     city: userDetails?.city,
     email: userDetails?.email,
     profile: userDetails?.profile_pic,
+    pref_email: 0,
+    pref_phone: 0,
+    promo: false,
+    online_name: `${userDetails?.firstname} ${userDetails?.lastname}`,
   };
 
   let [profile, setProfile] = useState({
@@ -90,8 +92,14 @@ export default function PersonalInfoTab({
     // there is no profile accommodation on the payload
     delete values?.profile;
 
+    const reqData = {
+      ...values,
+      pref_email: Number(values.pref_email?.toString()),
+      pref_phone: Number(values.pref_phone?.toString()),
+    };
+
     apiCall
-      .updateProfile(values)
+      .updateProfile(reqData)
       .then((res) => {
         // API CALL TO UPDATE USER DETAILS
         if (res.data.internal_return < 0) {
@@ -102,10 +110,14 @@ export default function PersonalInfoTab({
           });
           return;
         }
-        // setRequestState({message: 'Profile update successfully', loading: false, status: true})
-        toast.success("Update Successful");
+        setRequestState({
+          message: "Profile update successfully",
+          loading: false,
+          status: true,
+        });
+        // toast.success("Update Successful");
         setTimeout(() => {
-          // navigate("/", { replace: true });
+          navigate("/", { replace: true });
           window.location.reload(true);
         }, 1000);
       })
@@ -148,10 +160,10 @@ export default function PersonalInfoTab({
                         fieldClass="px-6"
                         label="User Name"
                         type="text"
-                        name="username"
-                        placeholder=""
-                        value={userDetails.username}
-                        disable={true}
+                        name="online_name"
+                        placeholder="Username"
+                        value={props.values.online_name}
+                        inputHandler={props.handleChange}
                       />
                     </div>
 
@@ -267,13 +279,17 @@ export default function PersonalInfoTab({
                         Pref. Communication
                       </label>
                       <div className="check-box">
-                        <div className="flex items-center justify-start">
+                        <div
+                          role="group"
+                          className="flex items-center justify-start"
+                        >
                           <div className="check-input flex items-center mr-1">
                             <input
                               className="w-4 h-4 cursor-pointer"
                               type="checkbox"
-                              name="prefcomm1"
-                              id=""
+                              name="pref_email"
+                              value={1}
+                              onChange={props.handleChange}
                             />
                             <span className="mx-2 text-base text-dark-gray dark:text-white">
                               Email
@@ -283,8 +299,9 @@ export default function PersonalInfoTab({
                             <input
                               className="w-4 h-4 cursor-pointer"
                               type="checkbox"
-                              name="prefcomm2"
-                              id=""
+                              name="pref_phone"
+                              value={1}
+                              onChange={props.handleChange}
                             />
                             <span className="mx-2 text-base text-dark-gray dark:text-white">
                               Phone
@@ -296,22 +313,32 @@ export default function PersonalInfoTab({
 
                     {/* Allow Promotions */}
                     <div className="field w-full mb-6 flex items-center space-x-4">
-                      <label className="input-label text-[#181c32] dark:text-white text-base font-semibold">
+                      <label
+                        htmlFor="promo"
+                        className="input-label text-[#181c32] dark:text-white text-base font-semibold"
+                      >
                         Allow Promotions
                       </label>
-                      <div
-                        className="cursor-pointer flex items-center"
-                        onClick={() => setTogglePromotion((prev) => !prev)}
-                      >
-                        <div
-                          className={`h-6 w-8 mr-1 p-1 ${
-                            togglePromotion
+                      <div>
+                        <input
+                          type="checkbox"
+                          id="promo"
+                          name="promo"
+                          value={props.values.promo}
+                          checked={props.values.promo}
+                          onChange={props.handleChange}
+                          className="hidden"
+                        />
+                        <label
+                          htmlFor="promo"
+                          className={`cursor-pointer flex items-center h-6 w-8 mr-1 p-1 ${
+                            props.values.promo
                               ? "bg-sky-blue flex justify-end items-center"
                               : "bg-slate-200"
-                          } rounded-full transition`}
+                          } rounded-full transition duration-200`}
                         >
                           <div className="w-4 h-full bg-white rounded-full"></div>
-                        </div>
+                        </label>
                       </div>
                     </div>
                     {/* inputs ends here */}
@@ -388,7 +415,6 @@ export default function PersonalInfoTab({
                 )}
                 <div className="w-full h-[120px] border-t border-light-purple dark:border-[#5356fb29]  flex justify-end items-center">
                   <div className="flex items-center space-x-4 mr-9">
-                    
                     {/* <Link
                       to="/"
                       className="text-18 text-light-red tracking-wide "

From 5f01cb14f98d196b3ef4351eac3814716b997188 Mon Sep 17 00:00:00 2001
From: Ebube <ebube.ojinta@chiefsoft.com>
Date: Mon, 7 Aug 2023 08:10:51 +0100
Subject: [PATCH 2/2] updated payload

---
 .../Settings/Tabs/PersonalInfoTab.jsx         | 22 +++++++++----------
 1 file changed, 10 insertions(+), 12 deletions(-)

diff --git a/src/components/Settings/Tabs/PersonalInfoTab.jsx b/src/components/Settings/Tabs/PersonalInfoTab.jsx
index 0ee4009..96b2435 100644
--- a/src/components/Settings/Tabs/PersonalInfoTab.jsx
+++ b/src/components/Settings/Tabs/PersonalInfoTab.jsx
@@ -58,8 +58,6 @@ export default function PersonalInfoTab({
 
   let navigate = useNavigate();
 
-  let [togglePromotion, setTogglePromotion] = useState(false);
-
   const initialValues = {
     firstname: userDetails?.firstname,
     lastname: userDetails?.lastname,
@@ -69,8 +67,8 @@ export default function PersonalInfoTab({
     profile: userDetails?.profile_pic,
     pref_email: 0,
     pref_phone: 0,
-    promo: false,
-    online_name: `${userDetails?.firstname} ${userDetails?.lastname}`,
+    accept_promo: false,
+    online_name: userDetails?.username
   };
 
   let [profile, setProfile] = useState({
@@ -158,7 +156,7 @@ export default function PersonalInfoTab({
                     <div className="field w-full mb-6">
                       <InputCom
                         fieldClass="px-6"
-                        label="User Name"
+                        label="User Name (change if it's an email)"
                         type="text"
                         name="online_name"
                         placeholder="Username"
@@ -314,7 +312,7 @@ export default function PersonalInfoTab({
                     {/* Allow Promotions */}
                     <div className="field w-full mb-6 flex items-center space-x-4">
                       <label
-                        htmlFor="promo"
+                        htmlFor="accept_promo"
                         className="input-label text-[#181c32] dark:text-white text-base font-semibold"
                       >
                         Allow Promotions
@@ -322,17 +320,17 @@ export default function PersonalInfoTab({
                       <div>
                         <input
                           type="checkbox"
-                          id="promo"
-                          name="promo"
-                          value={props.values.promo}
-                          checked={props.values.promo}
+                          id="accept_promo"
+                          name="accept_promo"
+                          value={props.values.accept_promo}
+                          checked={props.values.accept_promo}
                           onChange={props.handleChange}
                           className="hidden"
                         />
                         <label
-                          htmlFor="promo"
+                          htmlFor="accept_promo"
                           className={`cursor-pointer flex items-center h-6 w-8 mr-1 p-1 ${
-                            props.values.promo
+                            props.values.accept_promo
                               ? "bg-sky-blue flex justify-end items-center"
                               : "bg-slate-200"
                           } rounded-full transition duration-200`}