add family tab populated with family list
This commit was merged in pull request #752.
This commit is contained in:
@@ -5,7 +5,7 @@ import React, {
|
||||
useMemo,
|
||||
useState,
|
||||
} from "react";
|
||||
import { Link } from "react-router-dom";
|
||||
import { Link, useOutletContext } from "react-router-dom";
|
||||
import usersService from "../../services/UsersService";
|
||||
import Icons from "../Helpers/Icons";
|
||||
import InputCom from "../Helpers/Inputs/InputCom";
|
||||
@@ -16,13 +16,16 @@ import FamilyTable from "./FamilyTable";
|
||||
import CustomBreadcrumb from "../Breadcrumb/CustomBreadcrumb";
|
||||
|
||||
export default function FamilyAcc() {
|
||||
|
||||
const {loader, setLoader, familyList, setListReload} = useOutletContext() // CONTEXT VALUES FROM OUTLET TO CHILD
|
||||
|
||||
// State to store the selected year and month
|
||||
const [selectedYear, setSelectedYear] = useState("");
|
||||
const [selectedMonth, setSelectedMonth] = useState("");
|
||||
const [familyList, setFamilyList] = useState({});
|
||||
const [loader, setLoader] = useState(false);
|
||||
// const [familyList, setFamilyList] = useState({});
|
||||
// const [loader, setLoader] = useState(false);
|
||||
const [popUp, setPopUp] = useState(false);
|
||||
const [listReload, setListReload] = useState(false);
|
||||
// const [listReload, setListReload] = useState(false);
|
||||
const [msgErr, setMsgErr] = useState("");
|
||||
const [formData, setFormData] = useState({
|
||||
first_name: "",
|
||||
@@ -101,34 +104,34 @@ export default function FamilyAcc() {
|
||||
}
|
||||
};
|
||||
|
||||
const memberList = useCallback(async () => {
|
||||
setLoader(true);
|
||||
try {
|
||||
const res = await apiCall.familyListings();
|
||||
const { data } = res;
|
||||
if (data?.internal_return >= 0 && data?.status === "OK") {
|
||||
const { result_list, session_image_server } = data;
|
||||
setFamilyList({ result_list, session_image_server });
|
||||
sessionStorage.setItem("family_list", JSON.stringify(result_list))
|
||||
setLoader(false);
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
} catch (error) {
|
||||
setLoader(false);
|
||||
throw new Error(error);
|
||||
}
|
||||
}, [apiCall]);
|
||||
// const memberList = useCallback(async () => {
|
||||
// setLoader(true);
|
||||
// try {
|
||||
// const res = await apiCall.familyListings();
|
||||
// const { data } = res;
|
||||
// if (data?.internal_return >= 0 && data?.status === "OK") {
|
||||
// const { result_list, session_image_server } = data;
|
||||
// setFamilyList({ result_list, session_image_server });
|
||||
// sessionStorage.setItem("family_list", JSON.stringify(result_list))
|
||||
// setLoader(false);
|
||||
// } else {
|
||||
// return;
|
||||
// }
|
||||
// } catch (error) {
|
||||
// setLoader(false);
|
||||
// throw new Error(error);
|
||||
// }
|
||||
// }, [apiCall]);
|
||||
|
||||
useEffect(() => {
|
||||
let checkMemberList = true;
|
||||
if (checkMemberList) {
|
||||
memberList();
|
||||
}
|
||||
return () => {
|
||||
checkMemberList = false;
|
||||
};
|
||||
}, [listReload, memberList]);
|
||||
// useEffect(() => {
|
||||
// let checkMemberList = true;
|
||||
// if (checkMemberList) {
|
||||
// memberList();
|
||||
// }
|
||||
// return () => {
|
||||
// checkMemberList = false;
|
||||
// };
|
||||
// }, [listReload, memberList]);
|
||||
|
||||
return (
|
||||
<Layout>
|
||||
@@ -177,7 +180,7 @@ export default function FamilyAcc() {
|
||||
</span>
|
||||
</Link>
|
||||
<Link
|
||||
to={`/familysettings`}
|
||||
to={`/acc-family/familysettings`}
|
||||
state={{ imageServer: familyList?.session_image_server }}
|
||||
className="slider-btns flex space-x-4 w-12 h-12 rounded-md shadow-sm justify-center items-center cursor-pointer dark:bg-[linear-gradient(134.38deg,#f539f8_0%,#c342f9_43.55%,#5356fb_104.51%)] bg-[#76a5df] text-white"
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user