signup country bug fixed

src/components/History/JobsCompleted.jsx

@@ -40,9 +40,6 @@ function JobsCompleted() {
         }).catch((error)=>{
             setJobHistory(prev => ({...prev, loading: false, error: true}))
         })
-        setTimeout(()=>{
-            setJobHistory(prev => ({...prev, loading: false, error:true}))
-        },3000)
     }
 
     useEffect(()=>{
@@ -50,8 +47,8 @@ function JobsCompleted() {
       }, [])
 
   return (
-    <div className='flex flex-col justify-between min-h-[500px]'>
-    {jobHistory.loading ? 
+    <div className='p-4 flex flex-col justify-between min-h-[500px]'>
+    {jobHistory?.loading ? 
     <LoadingSpinner size='16' color='sky-blue' height='h-[500px]' />
     : jobHistory?.data?.length ?
     <table className="wallet-activity w-full table-auto border-collapse text-left">
@@ -64,7 +61,7 @@ function JobsCompleted() {
             </tr>
         </thead>
         <tbody>
-            {currentReward.map((item, index) => {
+            {currentReward?.map((item, index) => {
                 let date = new Date(item?.delivery_date).toLocaleDateString()
                 return (
                     <tr key={index} className='dark:text-white dark:bg-dark-white border-y dark:border-[#5356fb29] hover:bg-gray-50 dark:hover:bg-gray-50 dark:hover:text-black transition-all duration-300'>
@@ -86,7 +83,7 @@ function JobsCompleted() {
             )}
         </tbody>
     </table>
-    :jobHistory.error ?
+    :jobHistory?.error ?
     <div className="p-2 text-slate-500 flex flex-col grow justify-center items-center">
         <span>Opps! an error occurred. Please try again!</span>
     </div>

src/components/History/RewardsTable.jsx

@@ -47,7 +47,7 @@ export const RewardsTable = memo(() => {
       }, [])
 
   return (
-    <div className='flex flex-col justify-between min-h-[500px]'>
+    <div className='p-4 flex flex-col justify-between min-h-[500px]'>
     {familyRewardHistory.loading ? 
     <LoadingSpinner size='16' color='sky-blue' height='h-[500px]' />
     : familyRewardHistory.data.length ?

src/components/History/index.jsx

@@ -19,9 +19,32 @@ export default function History() {
 
     const apiCall = new usersService()
 
-    let [tab, setTab] = useState("purchases"); //STATE FOR SWITCHING BETWEEN TABS
     const [selectedTab, setSelectedTab] = useState("purchases");
-    const tabs = ["purchases", "recent activity", "rewards", 'jobs completed'] //STATE FOR SWITCHING BETWEEN TABS
+    // let [tab, setTab] = useState("purchases"); //STATE FOR SWITCHING BETWEEN TABS
+    // const tabs = ["purchases", "recent activity", "rewards", 'jobs completed'] //STATE FOR SWITCHING BETWEEN TABS
+
+    const tabs = [  //STATE FOR SWITCHING BETWEEN TABS
+        {
+            id: 1,
+            title: "purchases",
+            iconName: "history",
+          },
+          {
+            id: 2,
+            title: "recent activity",
+            iconName: "history",
+          },
+          {
+            id: 3,
+            title: "rewards",
+            iconName: "history",
+          },
+          {
+            id: 4,
+            title: "jobs completed",
+            iconName: "history",
+          },
+    ]
 
     let [paymentHistory, setPaymentHistory] = useState({ // FOR PAYMENT HISTORY
         loading: true,
@@ -91,12 +114,15 @@ export default function History() {
                     <div className="content-tab-items lg:w-[230px] w-full mr-2">
                         <div className='overflow-hidden mb-5 lg:mb-0 py-2 lg:py-8'>
                             {tabs.map((item) => (
-                                <TabButton 
-                                    key={item}
-                                    item={item}
-                                    selectedTab={selectedTab}
-                                    setSelectedTab={setSelectedTab}
-                                />
+                                <div key={item.id} className='w-full'>
+                                    <TabButton 
+                                        key={item.id}
+                                        item={item.title}
+                                        iconName={item.iconName}
+                                        selectedTab={selectedTab}
+                                        setSelectedTab={setSelectedTab}
+                                    />
+                                </div>
                             ))}
                         </div>
                     </div>

src/components/MyWallet/WalletComponent/PurchasesTable.jsx

@@ -15,7 +15,7 @@ function PurchasesTable({purchase}) {
     }
 
   return (
-    <div className='flex flex-col justify-between min-h-[500px]'>
+    <div className='p-4 flex flex-col justify-between min-h-[500px]'>
         {purchase.data.length ?
         <table className="wallet-activity w-full table-auto border-collapse text-left">
             <thead className='w-full'>

src/components/MyWallet/WalletComponent/RecentActivityTable.jsx

@@ -18,7 +18,7 @@ function RecentActivityTable({ payment }) {
   };
 
   return (
-    <div className="flex flex-col justify-between min-h-[500px]">
+    <div className="p-4 flex flex-col justify-between min-h-[500px]">
       {payment?.data?.length > 0 ? 
         <table className="wallet-activity w-full table-auto border-collapse text-left">
           <thead className="w-full">

src/components/Partials/Default.jsx

@@ -1,5 +1,6 @@
 import React, { useEffect, useState } from "react";
 import DarkModeContext from "../Contexts/DarkModeContext";
+import axios from 'axios'
 
 function Default({ children }) {
   // dark mode setup
@@ -12,6 +13,32 @@ function Default({ children }) {
   const queryParams = new URLSearchParams(location?.search);
   const country = queryParams.get("cnt")?.toUpperCase();
 
+  const getLocation = () => {
+    if (navigator.geolocation) {
+      navigator.geolocation.getCurrentPosition(
+        (data) => {
+          const pos = data.coords;
+          const position = {
+            lat: pos.latitude,
+            long: pos.longitude,
+          };
+          axios.get(`https://nominatim.openstreetmap.org/reverse?format=json&lat=${position.lat}&lon=${position.long}&zoom=18&addressdetails=1`).then(res =>{
+            localStorage.setItem("myloc", res?.data?.address?.country);
+            // console.log('LOC', res?.data?.address?.country)
+            // localStorage.setItem("myloc", JSON.stringify(position));
+          }).catch(err => {
+            console.log('ERR', err)
+          })
+        },
+        (err) => {
+          localStorage.setItem("myloc", JSON.stringify('not supported'));
+        }
+      );
+    } else {
+      localStorage.setItem("myloc", JSON.stringify('not supported'));
+    }
+  }
+
   useEffect(() => {
     if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
       setTheme("dark");
@@ -39,6 +66,10 @@ function Default({ children }) {
     }
   },[countryMode])
 
+  useEffect(()=>{
+    getLocation()
+  },[])
+
   return (
     <>
       <DarkModeContext.Provider value={{ theme, handleThemeSwitch, countryMode }}>

src/components/Partials/RightSideBar.jsx

@@ -323,7 +323,7 @@ export default function RightSideBar({ myJobList }) {
                   {/* name */}
                   <div>
                     <p className="text-thin-light-gray text-base font-medium">
-                      <NavLink to="/offer-interest">Offers Interest</NavLink>
+                      <NavLink to="/offer-interest">Interest</NavLink>
                     </p>
                   </div>
                   {/* action */}

src/components/customTabs/TabButton.jsx

@@ -1,6 +1,7 @@
 import React from 'react'
+import Icons from '../Helpers/Icons'
 
-export default function TabButton({ item='', selectedTab='', setSelectedTab=()=>{} }) {
+export default function TabButton({ item='', iconName='', selectedTab='', setSelectedTab=()=>{} }) {
   return (
     <button
       className={`flex lg:space-x-4 space-x-2 hover:text-purple transition-all duration-300 ease-in-out items-center cursor-pointer lg:mb-11 mb-2 mr-6 lg:mr-0 float-left lg:float-none overflow-hidden ${
@@ -10,7 +11,12 @@ export default function TabButton({ item='', selectedTab='', setSelectedTab=()=>
       name={item}
       onClick={() => setSelectedTab(item)}
     >
-      {item[0].toUpperCase() + item.slice(1)}
+      <div>
+        <Icons name={iconName} />
+      </div>
+      <div>
+        <p className="text-18 tracking-wide">{item[0].toUpperCase() + item.slice(1)}</p>
+      </div>
     </button>
   )
 }

src/services/UsersService.js

@@ -32,7 +32,7 @@ class usersService {
   }
 
   blogData() {
-    return this.getAuxEnd("/blogdata", null);
+    return this.getAuxEnd("/blogdata", {});
   }
 
   CompleteOauthLogin(reqData) {
@@ -130,7 +130,7 @@ class usersService {
   }
   getApiGate() {
     // localStorage.setItem("session_token", ``);
-    return this.postAuxEnd("/apigate", null);
+    return this.postAuxEnd("/apigate", {});
   }
 
   getLoadProfile() {
@@ -141,7 +141,7 @@ class usersService {
       page: 0,
       limit: 100,
     };
-    return this.postAuxEnd("/loadprofile", null);
+    return this.postAuxEnd("/loadprofile", {});
   }
 
   getUploadedList() {
@@ -791,7 +791,7 @@ class usersService {
 
   // Country Data {GET}
   getSignupCountryData() {
-    return this.postAuxEnd("/signupcountry", null);
+    return this.postAuxEnd("/signupcountry", {});
   }
 
   // END POINT TO GET BANK NAME
@@ -1529,7 +1529,7 @@ class usersService {
     */
 
   getUserReminders() {
-    return this.getAuxEnd("/reminders", null);
+    return this.getAuxEnd("/reminders", {});
   }
   //----------------------------------------  -----
   //----------------------------------------  -----
@@ -1588,6 +1588,9 @@ class usersService {
     //     Axios.defaults.headers.post['Access-Control-Allow-Origin'] = '*'; //,axiosConfig
     //     Axios.defaults.withCredentials = true;
     //debugger;
+    if(localStorage && localStorage.getItem('myloc')){
+      reqData.loc = localStorage.getItem('myloc')
+    }
     return Axios.post(endPoint, reqData)
         .then((response) => {
           console.log(response);