From 42b792ab9dc27e32e093ae2ba4e7c305ea50630c Mon Sep 17 00:00:00 2001
From: victorAnumudu <anumuduchukwuebuka@gmail.com>
Date: Tue, 12 Sep 2023 15:24:30 +0100
Subject: [PATCH 1/4] made country auto filled if pathname contains country
 value

---
 src/components/AuthPages/SignUp/index.jsx | 41 +++++++++++++++++++----
 1 file changed, 34 insertions(+), 7 deletions(-)

diff --git a/src/components/AuthPages/SignUp/index.jsx b/src/components/AuthPages/SignUp/index.jsx
index 02d00b1..3e4e423 100644
--- a/src/components/AuthPages/SignUp/index.jsx
+++ b/src/components/AuthPages/SignUp/index.jsx
@@ -6,15 +6,18 @@ import InputCom from "../../Helpers/Inputs/InputCom";
 import AuthLayout from "../AuthLayout";
 
 export default function SignUp() {
+  const queryParams = new URLSearchParams(location?.search);
+  const country = queryParams.get("cnt")?.toUpperCase();
+
   const [signUpLoading, setSignUpLoading] = useState(false);
   const [checked, setValue] = useState(false);
   // for the catch error
   const [msgError, setMsgError] = useState("");
   const [showPassword, setShowPassword] = useState(false);
-  const [countries, setCountries] = useState([]);
+  const [countries, setCountries] = useState({loading:true, data:[]});
 
   const [formData, setFormData] = useState({
-    country: "",
+    country: country? country : "",
     first_name: "",
     last_name: "",
     email: "",
@@ -45,9 +48,14 @@ export default function SignUp() {
     try {
       if (res.status === 200) {
         const { signup_country } = await res.data;
-        setCountries(signup_country);
+        // setCountries(signup_country);
+        if(country){ // IF LINK/PATHNAME HAS CNT QUERY VALUE
+          let cnt = signup_country.filter(item => item[0]==country)
+          return setCountries({loading: false, data: cnt.length ? signup_country.filter(item => item[0]==country) : signup_country});
+        }
+        setCountries({loading: false, data:signup_country});
       } else if (res.data.result !== 100) {
-        setCountries("Nothing see here!");
+        setCountries({loading: false, data:[]});
       }
     } catch (error) {
       throw new Error(error);
@@ -352,13 +360,32 @@ const SelectOption = ({
           onChange={inputHandler}
           value={value}
         >
-          <option value={""}>Select your Country</option>
-          {data?.length > 0 &&
-            data?.map((item, idx) => (
+          {data?.data?.length > 1 ?
+            <>
+            <option value={""}>Select your Country</option>
+            {data?.data?.map((item, idx) => (
               <option value={item[0]} key={idx}>
                 {item[1]}
               </option>
             ))}
+            </>
+            :
+            data?.data?.length == 1 ?
+            data?.data?.map((item, idx) => (
+              <option value={item[0]} key={idx}>
+                {item[1]}
+              </option>
+            ))
+            :
+            data?.data?.length < 1 && data.loading ?
+            <option value=''>
+              Loading...
+            </option>
+            :
+            <option value=''>
+              No Country Found!
+            </option>
+          }
         </select>
       </div>
     </div>

From a1140f7006a3d9dc7b225f6425c1c84c51c7b4e6 Mon Sep 17 00:00:00 2001
From: victorAnumudu <anumuduchukwuebuka@gmail.com>
Date: Tue, 12 Sep 2023 20:05:22 +0100
Subject: [PATCH 2/4] modified signup page to show select country list or
 defaults to country passed on search param

---
 src/components/AuthPages/SignUp/index.jsx | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/components/AuthPages/SignUp/index.jsx b/src/components/AuthPages/SignUp/index.jsx
index 3e4e423..f1ebc53 100644
--- a/src/components/AuthPages/SignUp/index.jsx
+++ b/src/components/AuthPages/SignUp/index.jsx
@@ -50,8 +50,12 @@ export default function SignUp() {
         const { signup_country } = await res.data;
         // setCountries(signup_country);
         if(country){ // IF LINK/PATHNAME HAS CNT QUERY VALUE
-          let cnt = signup_country.filter(item => item[0]==country)
-          return setCountries({loading: false, data: cnt.length ? signup_country.filter(item => item[0]==country) : signup_country});
+          let cnt = signup_country.filter(item => item[0]==country) // test to see country passed in query param exist from list of countries supplied by API
+          if(!cnt.length){ // IF CNT EMPTY, SET FORMDATA COUNTRY BACK TO EMPTY STRING: RE: THIS IS BCOS WE INITAIL SET COUNTRY VALUE IN FORMDATA, IF COUNTRY PARAM IS PRESENT IN LINK
+            setFormData(prev => ({...prev, country: ''}))
+            return setCountries({loading: false, data: signup_country});
+          }
+          return setCountries({loading: false, data: cnt});
         }
         setCountries({loading: false, data:signup_country});
       } else if (res.data.result !== 100) {
@@ -64,6 +68,7 @@ export default function SignUp() {
 
   const handleSignUp = async () => {
     let { country, first_name, last_name, email, password } = formData;
+    console.log('FORMDATA', formData)
     try {
       if (
         email !== "" &&
@@ -180,6 +185,7 @@ export default function SignUp() {
                   name="country"
                   value={formData.country}
                   inputHandler={handleInputChange}
+                  disable={country && countries?.data?.length <= 1 ? true : false}
                 />
                 <div className="input-fl-name mb-5 sm:flex w-full sm:space-x-6 ">
                   <div className="input-item sm:w-1/2 w-full mb-5 sm:mb-0">
@@ -314,6 +320,7 @@ export default function SignUp() {
                 <div className="signin-area mb-1">
                   <div className="flex justify-center">
                     <button
+                      disabled={countries.loading}
                       type="button"
                       onClick={handleSignUp}
                       className={`rounded-[0.475rem] mb-6 text-white flex justify-center bg-[#4687ba] hover:bg-[#009ef7] transition-all duration-300 items-center h-[42px] py-[0.8875rem] px-[1.81rem] text-[14.95px] btn-login`}
@@ -341,6 +348,7 @@ const SelectOption = ({
   inputHandler,
   value,
   data, // passing the data from parent
+  disable
 }) => {
   return (
     <div className="input-com mb-7">
@@ -354,6 +362,7 @@ const SelectOption = ({
       </div>
       <div>
         <select
+        disabled={disable}
           name={name}
           id={name}
           className="input-wrapper border border-[#f5f8fa] dark:border-[#5e6278] w-full rounded-full h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base focus-visible:border-transparent focus-visible:outline-0 focus-visible:ring-transparent "

From fbc8228977b7b8ed390463e2fad252667253f9b9 Mon Sep 17 00:00:00 2001
From: victorAnumudu <anumuduchukwuebuka@gmail.com>
Date: Tue, 12 Sep 2023 20:05:56 +0100
Subject: [PATCH 3/4] modified signup page to show select country list or
 defaults to country passed on search param

---
 src/components/AuthPages/SignUp/index.jsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/AuthPages/SignUp/index.jsx b/src/components/AuthPages/SignUp/index.jsx
index f1ebc53..79b2303 100644
--- a/src/components/AuthPages/SignUp/index.jsx
+++ b/src/components/AuthPages/SignUp/index.jsx
@@ -68,7 +68,6 @@ export default function SignUp() {
 
   const handleSignUp = async () => {
     let { country, first_name, last_name, email, password } = formData;
-    console.log('FORMDATA', formData)
     try {
       if (
         email !== "" &&

From d56363276b21e4043d5391812a9ec5dd5cb7d68c Mon Sep 17 00:00:00 2001
From: victorAnumudu <anumuduchukwuebuka@gmail.com>
Date: Wed, 13 Sep 2023 05:12:27 +0100
Subject: [PATCH 4/4] made the pathname to retain the country query param

---
 src/components/AuthPages/SignUp/index.jsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/AuthPages/SignUp/index.jsx b/src/components/AuthPages/SignUp/index.jsx
index 79b2303..735b69a 100644
--- a/src/components/AuthPages/SignUp/index.jsx
+++ b/src/components/AuthPages/SignUp/index.jsx
@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useState } from "react";
-import { Link, useNavigate } from "react-router-dom";
+import { Link, useLocation, useNavigate } from "react-router-dom";
 import WrenchBoard from "../../../assets/images/wrenchboard-logo-text.png";
 import usersService from "../../../services/UsersService";
 import InputCom from "../../Helpers/Inputs/InputCom";
@@ -8,6 +8,9 @@ import AuthLayout from "../AuthLayout";
 export default function SignUp() {
   const queryParams = new URLSearchParams(location?.search);
   const country = queryParams.get("cnt")?.toUpperCase();
+  
+  const {pathname} = useLocation()
+  const currentPath = country ? `${pathname}?cnt=${country.toLowerCase()}`:pathname // Determines the new pathname is country query params exist
 
   const [signUpLoading, setSignUpLoading] = useState(false);
   const [checked, setValue] = useState(false);
@@ -146,7 +149,7 @@ export default function SignUp() {
       <AuthLayout slogan="Welcome to WrenchBoard">
         <div className="w-full">
           <div className="mb-5">
-            <Link to="#">
+            <Link to={currentPath}>
               <img
                 src={WrenchBoard}
                 alt="wrenchboard"