file link updated

src/components/MyActiveJobs/ActiveJobMessage.jsx

@@ -32,7 +32,7 @@ export default function ActiveJobMessage({ activeJobMesList }) {
             <tbody>
                 {activeJobMesList.data.map((item, index) => 
                 {
-                    let imageLink = `${activeJobMesList?.image}${localStorage.getItem('session_token')}/contrats/${item.msg_uid}`
+                    let imageLink = `${activeJobMesList?.image}${localStorage.getItem('session_token')}/contracts/${item.msg_uid}`
                     return (
                         <tr key={index} className='text-slate-500'>
                             <td>

src/components/MyWallet/Popup/AddFundDollars.jsx

@@ -64,17 +64,21 @@ const initialValues = {
 };
 
 function AddFundDollars(props) {
-  let MaxNoOfCards = process.env.REACT_APP_MAX_CREDIT_CARDS // HOLDS THE VALUE OF THE MAX NUMBER OF CARDS USER CAN ADD
-  
+  let MaxNoOfCards = process.env.REACT_APP_MAX_CREDIT_CARDS; // HOLDS THE VALUE OF THE MAX NUMBER OF CARDS USER CAN ADD
+
   const apiCall = new usersService();
   let countryWallet = props.walletItem.country;
-  const [tab, setTab] = useState("previous");
+  const [selectedOption, setSelectedOption] = useState("previous");
   const { userDetails } = useSelector((state) => state?.userDetails);
   const [prevCardDetails, setPrevCardDetails] = useState({});
   const [payListCards, setPayListCards] = useState({ loading: true, data: [] });
   const [cardIcons, setCardIcons] = useState("atm-card");
   const [prevCardError, setPrevCardError] = useState("");
 
+  const handleOptionChange = (event) => {
+    setSelectedOption(event.target.value);
+  };
+
   const { firstname, lastname } = userDetails;
 
   // Handling Card Icons
@@ -144,7 +148,12 @@ function AddFundDollars(props) {
       return;
     }
 
-    if (tab === "previous") {
+    let stateData = {
+      amount: Number(props.input) * 100,
+      currency: props.walletItem?.code,
+    };
+
+    if (selectedOption === "previous") {
       // To check if card is empty
       if (Object.keys(prevCardDetails).length === 0) {
         setPrevCardError("No card selected!");
@@ -158,10 +167,26 @@ function AddFundDollars(props) {
       show: { awaitConfirm: { loader: true } },
     }));
 
-    let stateData = {
-      amount: Number(props.input) * 100,
-      currency: props.walletItem?.code,
-    };
+    // Extracting card_uid from the previous card details
+    const paymentCardValue = prevCardDetails["payment-card"];
+
+    if (paymentCardValue) {
+      try {
+        const paymentCardObject = JSON.parse(paymentCardValue);
+        stateData = {
+          ...stateData,
+          card_uid: paymentCardObject.card_uid,
+        };
+      } catch (error) {
+        console.error("Error parsing JSON:", error);
+      }
+    } else {
+      // For the new card details
+      stateData = {
+        ...stateData,
+        card_uid: "",
+      };
+    }
 
     try {
       const res = await apiCall.getStartCredit(stateData);
@@ -171,12 +196,11 @@ function AddFundDollars(props) {
       }
 
       const _response = res.data;
-      stateData.amount = Number(props.input);
       stateData.card =
-        tab === "previous"
+        selectedOption === "previous"
           ? prevCardDetails["payment-card"]
           : { ...values, cvv: values.cvv };
-      stateData.cardType = tab === "previous" ? "prev" : "new";
+      stateData.cardType = selectedOption === "previous" ? "prev" : "new";
       stateData = { ...stateData, ..._response };
 
       setTimeout(() => {
@@ -224,36 +248,45 @@ function AddFundDollars(props) {
             </h1>
             <div className="my-1 flex items-center gap-2">
               <label
-                onClick={() => setTab("previous")}
                 htmlFor="previous"
                 className="cursor-pointer flex items-center gap-1"
               >
                 <input
                   type="radio"
                   id="previous"
+                  value="previous"
                   name="card-option"
-                  checked={tab === "previous"}
+                  onChange={handleOptionChange}
+                  checked={selectedOption === "previous"}
                   className={`p-2 text-lg font-bold text-slate-600 dark:text-white border pointer-events-none w-7 h-7 ${
-                    tab == "previous" ? "" : ""
+                    selectedOption == "previous" ? "" : ""
                   } tracking-wide transition duration-200`}
                 />
                 Previous Cards
               </label>
               <label
-                onClick={() => setTab("new")}
                 htmlFor="new"
-                className={`cursor-pointer flex items-center gap-1 ${payListCards.data.length >= MaxNoOfCards ? 'pointer-events-none':''}`}
+                className={`cursor-pointer flex items-center gap-1 ${
+                  payListCards.data.length >= MaxNoOfCards
+                    ? "pointer-events-none"
+                    : ""
+                }`}
               >
                 <input
                   id="new"
                   type="radio"
                   name="card-option"
-                  checked={tab === "new"}
+                  value="new"
+                  onChange={handleOptionChange}
+                  checked={selectedOption === "new"}
                   className={`p-2 text-lg font-bold text-slate-600 dark:text-white border pointer-events-none w-7 h-7 ${
-                    tab == "new" ? "" : ""
+                    selectedOption == "new" ? "" : ""
                   }  tracking-wide transition duration-200`}
                 />
-                Add New Card {payListCards.data.length >= MaxNoOfCards && <span className="text-[14px] text-red-500">Max Reached</span>}
+                Add New Card{" "}
+                {payListCards.data.length >= MaxNoOfCards && (
+                  <span className="text-[14px] text-red-500">Max Reached</span>
+                )}
               </label>
             </div>
           </form>
@@ -261,8 +294,8 @@ function AddFundDollars(props) {
         <hr />
         {/* END OF switch button */}
 
-        {/* previous tab */}
-        {tab === "previous" && (
+        {/* previous selectedOption */}
+        {selectedOption === "previous" && (
           <div className="p-4 previous-details w-full min-h-[16.5rem] flex flex-col">
             {payListCards.loading ? (
               <LoadingSpinner size="10" color="sky-blue" />
@@ -278,10 +311,11 @@ function AddFundDollars(props) {
                 {currentPreviousCards.map((item, index) => (
                   <option
                     key={index}
-                    className={index !== 0 && "border-t-2"}
+                    className={index !== 0 ? "border-t-2" : undefined}
                     value={JSON.stringify(item)}
+                    title={`${item.description} Card\nBank **************${item.digits}`}
                   >
-                    <div className="my-2 flex items-center gap-5">
+                    {/* <div className="my-2 flex items-center gap-5">
                       <div className="card-details">
                         <h1 className="text-lg font-bold text-dark-gray dark:text-white tracking-wide">
                           {item.description} Card
@@ -290,7 +324,8 @@ function AddFundDollars(props) {
                           Bank **************{item.digits}
                         </p>
                       </div>
-                    </div>
+                    </div> */}
+                    {item.description} Card - Bank **************{item.digits}
                   </option>
                 ))}
               </select>
@@ -300,7 +335,7 @@ function AddFundDollars(props) {
                   No Previous Card Found!
                 </p>
                 <button
-                  onClick={() => setTab("new")}
+                  onClick={() => setSelectedOption("new")}
                   type="button"
                   className="my-5 px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
                 >
@@ -314,13 +349,13 @@ function AddFundDollars(props) {
           </div>
         )}
 
-        {tab === "new" && (
+        {selectedOption === "new" && (
           <div className="new-details w-full max-h-[22rem]">
-            {payListCards.loading ?
+            {payListCards.loading ? (
               <div className="pt-10 flex w-full h-full justify-center items-center">
-                <LoadingSpinner size='10' color='sky-blue' />
+                <LoadingSpinner size="10" color="sky-blue" />
               </div>
-            :payListCards.data.length < MaxNoOfCards ?
+            ) : payListCards.data.length < MaxNoOfCards ? (
               <div className="w-full flex flex-col justify-between">
                 <Formik
                   initialValues={initialValues}
@@ -379,7 +414,8 @@ function AddFundDollars(props) {
                                             *
                                           </span>
                                           <span className="text-[12px] text-red-500 ml-1">
-                                            {props.errors.expirationMonth && "**"}
+                                            {props.errors.expirationMonth &&
+                                              "**"}
                                           </span>
                                         </label>
                                       </div>
@@ -431,7 +467,8 @@ function AddFundDollars(props) {
                                             *
                                           </span>
                                           <span className="text-[12px] text-red-500 italic">
-                                            {props.errors.expirationYear && "**"}
+                                            {props.errors.expirationYear &&
+                                              "**"}
                                           </span>
                                         </label>
                                       </div>
@@ -560,14 +597,12 @@ function AddFundDollars(props) {
                   }}
                 </Formik>
               </div>
-            :
-            null
-            }
+            ) : null}
           </div>
         )}
       </div>
 
-      {tab == "previous" && (
+      {selectedOption == "previous" && (
         <div className="md:py-8 add-fund-btn flex justify-end items-center gap-2 py-4">
           <button
             className="px-4 py-1 h-11 max-w-[100px] w-full flex justify-center bg-[#f5a430] text-black items-center text-base rounded-full"

src/components/MyWallet/Popup/AddFundPop.jsx

@@ -71,6 +71,7 @@ function AddFundPop({
       // Prepare state data for API call
       let stateData = {
         amount: Number(input) * 100,
+        card_uid: "", //added card_uid as empty string
         currency: walletItem?.code,
       };
 

src/components/MyWallet/Popup/ConfirmAddFund.jsx

@@ -45,7 +45,7 @@ function ThePaymentText({ value, type }) {
  * @returns {JSX.Element} - The rendered component.
  */
 function AmountSection({ currency, amount, country }) {
-  const formattedAmount = amount?.toFixed(2);
+  const formattedAmount = (+amount * 0.01)?.toFixed(2);
   const gapClassName = country === "US" ? "gap-14" : "gap-4";
 
   return (
@@ -87,7 +87,7 @@ function TransactionFeeSection({ currency, fee, country }) {
  */
 function TotalSection({ currency, amount, fee, country }) {
   const total = Number(amount) + Number(fee);
-  const formattedTotal = total?.toFixed(2);
+  const formattedTotal = (total * 0.01)?.toFixed(2);
 
   const gap = country === "US" ? "gap-[8rem]" : "gap-[6.3rem]";