From 6d16e7f63f6b6bc50fc90bc71820b8f45326e009 Mon Sep 17 00:00:00 2001 From: victorAnumudu Date: Fri, 16 Jun 2023 12:15:08 +0100 Subject: [PATCH 1/3] faq content add from API --- src/components/Helpers/Accordion.jsx | 4 ++-- src/components/Settings/Tabs/FaqTab.jsx | 14 +++++++++----- src/components/Settings/index.jsx | 8 +++----- src/services/UsersService.js | 12 +++++++++++- src/views/SettingsPage.jsx | 23 +++++++++++++++++++++-- 5 files changed, 46 insertions(+), 15 deletions(-) diff --git a/src/components/Helpers/Accordion.jsx b/src/components/Helpers/Accordion.jsx index 86bdc1a..85cfb71 100644 --- a/src/components/Helpers/Accordion.jsx +++ b/src/components/Helpers/Accordion.jsx @@ -10,7 +10,7 @@ export default function Accordion({ datas }) { <>
@@ -36,7 +36,7 @@ export default function Accordion({ datas }) {

- {datas.content} + {datas.msg}

diff --git a/src/components/Settings/Tabs/FaqTab.jsx b/src/components/Settings/Tabs/FaqTab.jsx index 0739d71..679b51b 100644 --- a/src/components/Settings/Tabs/FaqTab.jsx +++ b/src/components/Settings/Tabs/FaqTab.jsx @@ -1,14 +1,18 @@ import React from "react"; import Accordion from "../../Helpers/Accordion"; +import LoadingSpinner from "../../Spinners/LoadingSpinner"; -export default function FaqTab({ datas = [] }) { +export default function FaqTab({ datas }) { return (
- {datas && - datas.length > 0 && - datas.map((value) => ( - + {datas.loading ? + + : + datas && + datas?.data?.length > 0 && + datas.data.map((value, index) => ( + ))}
diff --git a/src/components/Settings/index.jsx b/src/components/Settings/index.jsx index 9c4d86f..999dca4 100644 --- a/src/components/Settings/index.jsx +++ b/src/components/Settings/index.jsx @@ -1,7 +1,7 @@ import React, { useRef, useState } from "react"; import cover from "../../assets/images/profile-info-cover.png"; import profile from "../../assets/images/profile-info-profile.png"; -import faq from "../../data/faq.json"; + import Icons from "../Helpers/Icons"; import Layout from "../Partials/Layout"; import ChangePasswordTab from "./Tabs/ChangePasswordTab"; @@ -12,7 +12,7 @@ import PaymentMathodsTab from "./Tabs/PaymentMathodsTab"; import PersonalInfoTab from "./Tabs/PersonalInfoTab"; import TermsConditionTab from "./Tabs/TermsConditionTab"; -export default function Settings() { +export default function Settings({faq}) { const tabs = [ { id: 1, @@ -83,8 +83,6 @@ export default function Settings() { } }; - // fab tab - const faqData = faq.datas; return ( <> @@ -259,7 +257,7 @@ export default function Settings() { )} {tab === "login_activity" && } {tab === "password" && } - {tab === "faq" && } + {tab === "faq" && } {tab === "terms" && }
diff --git a/src/services/UsersService.js b/src/services/UsersService.js index a342095..6f4ec57 100644 --- a/src/services/UsersService.js +++ b/src/services/UsersService.js @@ -687,9 +687,19 @@ class usersService { action: 14015, ...reqData, }; - return this.postAuxEnd("/activejobstatus ", postData); + return this.postAuxEnd("/activejobstatus", postData); } + // END POINT FOR OWNER JOB ACTION + getFaq() { + var postData = { + uid: localStorage.getItem("uid"), + // member_id: localStorage.getItem("member_id"), + sessionid: localStorage.getItem("session_token"), + }; + return this.postAuxEnd("/faq", postData); + } + /* - 20:27:30.118 FLOG_MAX [757411]: REQ_STRING(username) - 20:27:30.118 FLOG_MAX [757411]: REQ_STRING(password) diff --git a/src/views/SettingsPage.jsx b/src/views/SettingsPage.jsx index c138c99..b9a76ae 100644 --- a/src/views/SettingsPage.jsx +++ b/src/views/SettingsPage.jsx @@ -1,10 +1,29 @@ -import React from "react"; +import React,{useState, useEffect} from "react"; import Settings from "../components/Settings"; +import usersService from "../services/UsersService"; export default function SettingsPage() { + + const apiCall = new usersService() + + let [faq, setFaq] = useState({loading:true, data:[]}) // STATE TO HOLD FAQ DATA + + //FUNCTION TO GET FAQ + const getFaq = () => { + apiCall.getFaq().then(res => { + setFaq({loading:false, data:res.data.result_list}) + }).catch(err => { + setFaq({loading:false, data:[]}) + console.log('Error', err) + }) + } + + useEffect(()=>{ + getFaq() + },[]) return ( <> - + ); } From f04f4c713ec66453d610e25f52a8551b8ac08f94 Mon Sep 17 00:00:00 2001 From: Ebube Date: Fri, 16 Jun 2023 13:04:51 +0100 Subject: [PATCH 2/3] . --- src/components/MyCoupons/CouponPopup.jsx | 56 ++++++--- src/components/MyCoupons/CouponTable.jsx | 15 ++- src/components/MyCoupons/MyCoupons.jsx | 14 ++- src/components/MyJobs/MyJobTable.jsx | 25 ++-- src/components/MyJobs/index.jsx | 12 +- .../MyWallet/WalletComponent/CouponTable.jsx | 119 ++++++++++-------- src/store/TableReloads.js | 28 +++-- src/views/MyJobsPage.jsx | 37 +----- 8 files changed, 166 insertions(+), 140 deletions(-) diff --git a/src/components/MyCoupons/CouponPopup.jsx b/src/components/MyCoupons/CouponPopup.jsx index 4c34f50..ac6cfd8 100644 --- a/src/components/MyCoupons/CouponPopup.jsx +++ b/src/components/MyCoupons/CouponPopup.jsx @@ -1,10 +1,17 @@ import { useMemo, useState } from "react"; -import { toast } from "react-toastify"; import usersService from "../../services/UsersService"; +import { useDispatch } from "react-redux"; +import { tableReload } from "../../store/TableReloads"; const CouponPopup = ({ popUpHandler, data }) => { const [loader, setLoader] = useState(false); const apiCall = useMemo(() => new usersService(), []); + const [statusMsg, setStatusMsg] = useState({ + success: "", + error: "", + }); + + const dispatch = useDispatch(); const redeemCouponHandler = async () => { setLoader(true); @@ -14,28 +21,34 @@ const CouponPopup = ({ popUpHandler, data }) => { const reqData = { code_id: Number(coupon_id), code }; const res = await apiCall.getCouponRedeem(reqData); - if (res.statusText === "OK") { - toast.success("Great news! Your coupon has been redeemed.", { - autoClose: 3000, - hideProgressBar: true, - }); - } + if (res.data?.internal_return < 0) + setStatusMsg({ error: "An error occurred" }); + else setStatusMsg({ success: res.data?.status_text }); + + dispatch(tableReload({ type: "COUPONTABLE" })); setTimeout(() => { popUpHandler(); setLoader(false); - }, 3000); - throw new Response(res); + }, 10000); } catch (error) { - // error && - // toast.warn("An error occurred while processing your coupon.", { - // autoClose: 3000, - // hideProgressBar: true, - // }); setLoader(false); - console.log(error); - return; - // throw new Error(error); + if (error?.status !== 200) + setStatusMsg({ + error: { + status: true, + msg: + error?.statusText !== "" + ? error?.statusText + : "An error occurred", + }, + }); + throw new Error(error); + } finally { + setStatusMsg({ + success: "", + error: "", + }); } }; @@ -77,9 +90,8 @@ const CouponPopup = ({ popUpHandler, data }) => { Amount: -
{`${data?.amount} Naira`}
+
{data?.thePrice}
-
+ {statusMsg.success && ( +

{statusMsg.success}

+ )} + {statusMsg.error && ( +

{statusMsg.error}

+ )}
diff --git a/src/components/MyCoupons/CouponTable.jsx b/src/components/MyCoupons/CouponTable.jsx index 1891369..73bc1f0 100644 --- a/src/components/MyCoupons/CouponTable.jsx +++ b/src/components/MyCoupons/CouponTable.jsx @@ -4,6 +4,7 @@ import { handlePagingFunc } from "../Pagination/HandlePagination"; import ModalCom from "../Helpers/ModalCom"; import CouponPopup from "./CouponPopup"; import { useNavigate } from "react-router-dom"; +import { PriceFormatter } from "../Helpers/PriceFormatter"; function CouponTable({ coupon }) { const [currentPage, setCurrentPage] = useState(0); @@ -38,12 +39,18 @@ function CouponTable({ coupon }) { {coupon.data.length ? ( - {currentCoupon.map((item, index) => ( + {currentCoupon.map((item, index) => { + let thePrice = PriceFormatter( + item?.amount * 0.01, + item?.currency_code, + item?.currency + ); + return( {item.added}
{item.code} - {`${item.amount} Naira`} + {thePrice} - ))} + )})} ) : coupon.error ? ( diff --git a/src/components/MyCoupons/MyCoupons.jsx b/src/components/MyCoupons/MyCoupons.jsx index bf98567..a43cc7e 100644 --- a/src/components/MyCoupons/MyCoupons.jsx +++ b/src/components/MyCoupons/MyCoupons.jsx @@ -1,11 +1,13 @@ -import React, { useEffect, useState } from "react"; +import React, { useCallback, useEffect, useMemo, useState } from "react"; import Layout from "../Partials/Layout"; import LoadingSpinner from "../Spinners/LoadingSpinner"; import CouponTable from "./CouponTable"; import usersService from "../../services/UsersService"; +import { useSelector } from "react-redux"; export default function MyCoupons() { - const apiCall = new usersService(); + const apiCall = useMemo(() => new usersService(), []); + const {couponTable} = useSelector(state => state.tableReload) let [couponHistory, setCouponHistory] = useState({ // FOR COUPON HISTORY loading: true, @@ -14,7 +16,7 @@ export default function MyCoupons() { }); //FUNCTION TO GET COUPON HISTORY - const getCouponHistory = () => { + const getCouponHistory = useCallback(() => { apiCall .getCouponPending() .then((res) => { @@ -32,11 +34,11 @@ export default function MyCoupons() { .catch((error) => { setCouponHistory((prev) => ({ ...prev, loading: false, error: true })); }); - }; + }, [apiCall]); useEffect(() => { getCouponHistory(); - }, []); + }, [couponTable]); return ( <> @@ -59,7 +61,7 @@ export default function MyCoupons() {
) : ( - + )} diff --git a/src/components/MyJobs/MyJobTable.jsx b/src/components/MyJobs/MyJobTable.jsx index d6ad737..be596aa 100644 --- a/src/components/MyJobs/MyJobTable.jsx +++ b/src/components/MyJobs/MyJobTable.jsx @@ -11,6 +11,7 @@ import usersService from "../../services/UsersService"; import { handlePagingFunc } from "../Pagination/HandlePagination"; import PaginatedList from "../Pagination/PaginatedList"; import EditJobPopOut from "../jobPopout/EditJobPopout"; +import { PriceFormatter } from "../Helpers/PriceFormatter"; export default function MyJobTable({ MyJobList, reloadJobList, className }) { const [myCountry, setCountries] = useState(""); @@ -101,9 +102,15 @@ export default function MyJobTable({ MyJobList, reloadJobList, className }) { {selectedCategory === "All Categories" ? ( <> {MyJobList && - MyJobList?.data?.result_list && - MyJobList.data?.result_list.length > 0 ? - currentJobList.map((value, index) => ( + MyJobList?.data?.result_list && + MyJobList.data?.result_list.length > 0 ? ( + currentJobList.map((value, index) => { + let thePrice = PriceFormatter( + value?.price * 0.01, + value?.currency_code, + value?.currency + ); + return( Price:{" "} - {value.price * 0.01} + {thePrice} @@ -181,14 +188,12 @@ export default function MyJobTable({ MyJobList, reloadJobList, className }) { - )) - : + )}) + ) : ( - - No Jobs Avaliable! - + No Jobs Avaliable! - } + )} ) : selectedCategory === "Explore" ? ( <> diff --git a/src/components/MyJobs/index.jsx b/src/components/MyJobs/index.jsx index 4877726..c209b30 100644 --- a/src/components/MyJobs/index.jsx +++ b/src/components/MyJobs/index.jsx @@ -9,12 +9,10 @@ export default function MyJobs(props) { const filterHandler = (value) => { setValue(value); }; - + return ( - +
{/* heading */} @@ -42,11 +40,9 @@ export default function MyJobs(props) { >
- + ); -} +} \ No newline at end of file diff --git a/src/components/MyWallet/WalletComponent/CouponTable.jsx b/src/components/MyWallet/WalletComponent/CouponTable.jsx index b495dc0..6707059 100644 --- a/src/components/MyWallet/WalletComponent/CouponTable.jsx +++ b/src/components/MyWallet/WalletComponent/CouponTable.jsx @@ -1,66 +1,85 @@ -import React, {useState} from 'react' +import React, { useState } from "react"; -import PaginatedList from '../../Pagination/PaginatedList' -import { handlePagingFunc } from '../../Pagination/HandlePagination'; +import PaginatedList from "../../Pagination/PaginatedList"; +import { handlePagingFunc } from "../../Pagination/HandlePagination"; +import { PriceFormatter } from "../../Helpers/PriceFormatter"; -function CouponTable({coupon}) { +function CouponTable({ coupon }) { + const [currentPage, setCurrentPage] = useState(0); + const indexOfFirstItem = Number(currentPage); + const indexOfLastItem = + Number(indexOfFirstItem) + Number(process.env.REACT_APP_ITEM_PER_PAGE); + const currentCoupon = coupon?.data?.slice(indexOfFirstItem, indexOfLastItem); - const [currentPage, setCurrentPage] = useState(0); - const indexOfFirstItem = Number(currentPage); - const indexOfLastItem = Number(indexOfFirstItem)+Number(process.env.REACT_APP_ITEM_PER_PAGE); - const currentCoupon = coupon?.data?.slice(indexOfFirstItem, indexOfLastItem); - - const handlePagination = (e) => { - handlePagingFunc(e,setCurrentPage) - } + const handlePagination = (e) => { + handlePagingFunc(e, setCurrentPage); + }; return ( -
- - - +
+
+ + - + - {coupon.data.length ? - ( - - {currentCoupon.map((item, index) => ( - - - - - + {coupon.data.length ? ( + + {currentCoupon.map((item, index) => { + let thePrice = PriceFormatter( + item?.price * 0.01, + item?.currency_code, + item?.currency + ); + return ( + + + + + + + ); + })} + + ) : coupon.error ? ( + + + - ))} - - ) - : - coupon.error ? - ( - - - + + ) : ( + + + - - ) - : - - - - - - } -
Date Description Amount Active
{item.added}{item.code}{item.amount}{item.status}
{item.added}{item.code}{item.amount}{item.status}
+ Opps! an error occurred. Please try again! +
Opps! an error occurred. Please try again!
+ No Purchase History Found! +
No Purchase History Found!
+ + )} + - {/* PAGINATION BUTTON */} - = coupon?.data?.length ? true : false} data={coupon?.data} start={indexOfFirstItem} stop={indexOfLastItem} /> - {/* END OF PAGINATION BUTTON */} + {/* PAGINATION BUTTON */} + = + coupon?.data?.length + ? true + : false + } + data={coupon?.data} + start={indexOfFirstItem} + stop={indexOfLastItem} + /> + {/* END OF PAGINATION BUTTON */}
- ) + ); } -export default CouponTable \ No newline at end of file +export default CouponTable; diff --git a/src/store/TableReloads.js b/src/store/TableReloads.js index 587cb13..592971a 100644 --- a/src/store/TableReloads.js +++ b/src/store/TableReloads.js @@ -4,7 +4,8 @@ const initialState = { jobListTable: false, pendingListTable: false, myTaskTable: false, - othersInterestedTable: false + othersInterestedTable: false, + couponTable: false }; export const tableReloadSlice = createSlice({ @@ -12,21 +13,24 @@ export const tableReloadSlice = createSlice({ initialState, reducers: { tableReload: (state, action) => { - switch(action.payload.type){ - case 'JOBTABLE': + switch (action.payload.type) { + case "JOBTABLE": state.jobListTable = !state.jobListTable; - return - case 'PENDINGTABLE' : + return; + case "PENDINGTABLE": state.pendingListTable = !state.pendingListTable; - return - case 'MYTASKTABLE' : + return; + case "MYTASKTABLE": state.myTaskTable = !state.myTaskTable; - return - case 'OTHERSINTERESTEDTABLE' : + return; + case "OTHERSINTERESTEDTABLE": state.othersInterestedTable = !state.othersInterestedTable; - return + return; + case "COUPONTABLE": + state.couponTable = !state.couponTable; + return; default: - return state + return state; } }, }, @@ -34,4 +38,4 @@ export const tableReloadSlice = createSlice({ export const { tableReload } = tableReloadSlice.actions; -export default tableReloadSlice.reducer; \ No newline at end of file +export default tableReloadSlice.reducer; diff --git a/src/views/MyJobsPage.jsx b/src/views/MyJobsPage.jsx index d98adb4..14b5195 100644 --- a/src/views/MyJobsPage.jsx +++ b/src/views/MyJobsPage.jsx @@ -1,41 +1,16 @@ -//import React from "react"; -import React, { useContext, useState, useEffect } from "react"; -// import MyTasks from "../components/MyTasks"; -// import UsersService from "../services/UsersService"; -import usersService from "../services/UsersService"; import MyJobs from "../components/MyJobs"; import { useSelector } from "react-redux"; export default function MyJobsPage() { - let {commonHeadBanner} = useSelector(state => state.commonHeadBanner) + let { commonHeadBanner } = useSelector((state) => state.commonHeadBanner); + const { userJobList } = useSelector((state) => state.userJobList); - const {userJobList} = useSelector((state) => state.userJobList) - - // const { jobListTable } = useSelector((state) => state.tableReload); - // const userApi = new usersService(); - // const activeJobList = userApi.getMyJobList(); - // const [myJobList, setMyJobList] = useState({ loading: true, data: [] }); - // const api = new usersService(); - - // const getMyJobList = async () => { - // setMyJobList({ loading: true, data: [] }); - // try { - // const res = await api.getMyJobList(); - // setMyJobList({ loading: false, data: res.data }); - // // setMyJobList(res.data); - // } catch (error) { - // setMyJobList({ loading: false, data: [] }); - // console.log("Error getting mode"); - // } - // }; - // useEffect(() => { - // getMyJobList(); - // }, [jobListTable]); - - // debugger; return ( <> - + ); } From 123ed2056a4a8aae5c221a889fbd23d0d700a6ca Mon Sep 17 00:00:00 2001 From: Ebube Date: Fri, 16 Jun 2023 14:23:54 +0100 Subject: [PATCH 3/3] Family page Tasks --- .../FamilyAcc/Tabs/FamilyManageTabs.jsx | 2 +- src/components/FamilyAcc/Tabs/FamilyTasks.jsx | 66 ++++++++++--------- 2 files changed, 36 insertions(+), 32 deletions(-) diff --git a/src/components/FamilyAcc/Tabs/FamilyManageTabs.jsx b/src/components/FamilyAcc/Tabs/FamilyManageTabs.jsx index c81fcbc..10e5467 100644 --- a/src/components/FamilyAcc/Tabs/FamilyManageTabs.jsx +++ b/src/components/FamilyAcc/Tabs/FamilyManageTabs.jsx @@ -117,7 +117,7 @@ export default function FamilyManageTabs({ return (
diff --git a/src/components/FamilyAcc/Tabs/FamilyTasks.jsx b/src/components/FamilyAcc/Tabs/FamilyTasks.jsx index 2a4e8cd..0649980 100644 --- a/src/components/FamilyAcc/Tabs/FamilyTasks.jsx +++ b/src/components/FamilyAcc/Tabs/FamilyTasks.jsx @@ -5,16 +5,12 @@ import { handlePagingFunc } from "../../Pagination/HandlePagination"; import PaginatedList from "../../Pagination/PaginatedList"; import LoadingSpinner from "../../Spinners/LoadingSpinner"; import Icons from "../../Helpers/Icons"; +import { PriceFormatter } from "../../Helpers/PriceFormatter"; export default function FamilyTasks({ familyData, className, loader }) { - const filterCategories = ["All Categories", "Explore", "Featured"]; - const [selectedCategory, setCategory] = useState(filterCategories[0]); - let navigate = useNavigate(); let { pathname } = useLocation(); - let data = ["1", "2", "3", "4", "5", "6"]; // to be replaced later by result from API CALL - const [currentPage, setCurrentPage] = useState(0); const indexOfFirstItem = Number(currentPage); const indexOfLastItem = @@ -24,10 +20,7 @@ export default function FamilyTasks({ familyData, className, loader }) { indexOfLastItem ); - - const handlePagination = (e) => { - handlePagingFunc(e, setCurrentPage); - }; + const handlePagination = (e) => handlePagingFunc(e, setCurrentPage); return (
0 && currentTask.map((value, index) => { - // find due date - const dueDate = value?.delivery_date.split(" ")[0] + // find due date + const dueDate = value?.delivery_date.split(" ")[0]; + // the price + let thePrice = PriceFormatter( + value?.price * 0.01, + value?.currency_code, + value?.currency + ); return (
- - Price:{" "} - - {value.price * 0.01} + + Price:{" "} + + {thePrice} + - - - Duration:{" "} - - {" "} - {value.timeline_days} day(s) + + Duration:{" "} + + {" "} + {value.timeline_days} day(s) + - - - Due Date:{" "} - - {" "} - {dueDate} + + Due Date:{" "} + + {" "} + {dueDate} + -
- + - ) + ); })} }