diff --git a/src/components/Contexts/SocketIOContext.js b/src/components/Contexts/SocketIOContext.js index 97c9f06..bf07241 100644 --- a/src/components/Contexts/SocketIOContext.js +++ b/src/components/Contexts/SocketIOContext.js @@ -47,19 +47,25 @@ export default function SocketIOContextProvider({children}) { useEffect(() => { socket.on("receive_message", (data) => { // setSocketMsgReceived(data.message); - dispatch(tableReload({type:'CHATMESSAGELIST'})) + dispatch(tableReload({type:'CHATMESSAGELIST'})) // dispatches to update chat message sending from owner to worker and vice versa }); + socket.on("received_refreshmarket_jobs", (data) => { // setSocketMsgReceived(data.message); - dispatch(tableReload({type:'MARKETTABLELIST'})) + dispatch(tableReload({type:'MARKETTABLELIST'})) // dispatches to update market list on full account }); + socket.on("family_actions", (data) => { // setSocketMsgReceived(data.message); - let user_uid = userDetails.account_type == 'FULL' ? userDetails.uid : sessionStorage.getItem('family_uid') + let user_uid = userDetails.account_type == 'FULL' ? userDetails.uid : sessionStorage.getItem('family_uid') // gets user UID let {message} = data - if(message.action == "REFRESH_OFFER" && message.family_uid == user_uid && message.audience == "MEMBER"){ - dispatch(tableReload({type:'FAMILYOFFERLIST'})) + if(message.action == "REFRESH_OFFER" && message.family_uid == user_uid && message.audience == "MEMBER"){ // for refreshing child account when parent assigns a job + dispatch(tableReload({type:'FAMILYOFFERLIST'})) // dispatches to update family pending/offer list on family side } + if(message.action == "REFRESH_TASK" && message.audience == "PARENT"){ // for refreshing parent account when child accepts or rejects a job + dispatch(tableReload({type:'PARENTFAMILYTASKLIST'})) // dispatches to update parent family task list on parent side + } + // console.log('DATA', data) }); }, [socket]); diff --git a/src/components/FamilyAcc/FamilyTableNew.jsx b/src/components/FamilyAcc/FamilyTableNew.jsx index c008758..ef9460c 100644 --- a/src/components/FamilyAcc/FamilyTableNew.jsx +++ b/src/components/FamilyAcc/FamilyTableNew.jsx @@ -4,6 +4,7 @@ import { apiConst } from "../../lib/apiConst"; import usersService from "../../services/UsersService"; import LoadingSpinner from "../Spinners/LoadingSpinner"; import AssignTaskPopout from "./FamilyPopout/AssignTaskPopout"; +import { useSelector } from "react-redux"; // Lazy Imports for components const FamilyWaitlist = lazy(() => import("./Tabs/FamilyNewWaitlist")); @@ -11,11 +12,15 @@ const FamilyTasks = lazy(() => import("./Tabs/FamilyNewTasks")); const FamilyPending = lazy(() => import("./Tabs/FamilyNewPending")); export default function FamilyTableNew() { + + const { parentFamilyTaskList } = useSelector((state) => state.tableReload); + console.log('parentFamilyTaskList', parentFamilyTaskList) + let { pathname } = useLocation(); // Initial state for family details const initialDetailState = { - loading: false, + loading: true, data: null, link: "", }; @@ -115,13 +120,13 @@ export default function FamilyTableNew() { useEffect(() => { const manageFamily = async () => { try { - resetDetails(); + // resetDetails(); - setDetails({ - familyTasks: { loading: true }, - familyWaitList: { loading: true }, - familyPending: { loading: true }, - }); + // setDetails({ + // familyTasks: { loading: true }, + // familyWaitList: { loading: true }, + // familyPending: { loading: true }, + // }); // const { family_uid } = accountDetails; // const reqData = { family_uid }; @@ -169,7 +174,13 @@ export default function FamilyTableNew() { }, }); } catch (error) { - resetDetails(); + // resetDetails(); + setDetails({ + familyDetails: { ...initialDetailState, loading: false, }, + familyTasks: { ...initialDetailState, loading: false, }, + familyWaitList: { ...initialDetailState, loading: false,}, + familyPending: { ...initialDetailState, loading: false, }, + }) setErrMsg("An error occurred"); throw new Error(error); } @@ -177,7 +188,7 @@ export default function FamilyTableNew() { // Invoke the manageFamily function when the component mounts manageFamily(); - }, [updatePage]); + }, [updatePage, parentFamilyTaskList]); // Effect to manage family tasks useEffect(() => { diff --git a/src/components/jobPopout/FamilyOfferJobPopout.jsx b/src/components/jobPopout/FamilyOfferJobPopout.jsx index e2d2d5d..79612a1 100644 --- a/src/components/jobPopout/FamilyOfferJobPopout.jsx +++ b/src/components/jobPopout/FamilyOfferJobPopout.jsx @@ -10,7 +10,12 @@ import localImgLoad from "../../lib/localImgLoad"; import { tableReload } from "../../store/TableReloads"; import { useDispatch } from "react-redux"; +import { SocketValues } from "../Contexts/SocketIOContext"; + function FamilyOfferJobPopout({ details, onClose, situation }) { + + const {parentAssignJobToKid} = SocketValues() + const apiUrl = new usersService(); const navigate = useNavigate(); const dispatch = useDispatch(); @@ -69,6 +74,18 @@ function FamilyOfferJobPopout({ details, onClose, situation }) { message: `Offer ${name}ed Successfully`, trigger: "", }); + // trigger socket event to refresh parent side + //SENDS MESSAGE TO SOCKET TO UPDATE PARENT ACCOUNT WHEN CHILD ACCEPTS OR REJECTS A JOB ASSIGNED BY PARENT + // message, room + let socketMsg = { + "audience": "PARENT", + "action": "REFRESH_TASK", + "family_uid": sessionStorage.getItem('family_uid'), + } + let socketRoom = `FAMILY-${sessionStorage.getItem('parent_uid')}` + parentAssignJobToKid(socketMsg, socketRoom) //SENDS MESSAGE TO SOCKET TO UPDATE CHILD ACCOUNT + // end of socket event trigger + setTimeout(() => { onClose(); dispatch(tableReload({ type: "MYTASKTABLE" })); diff --git a/src/store/TableReloads.js b/src/store/TableReloads.js index 42a5365..e2f9b7c 100644 --- a/src/store/TableReloads.js +++ b/src/store/TableReloads.js @@ -12,6 +12,7 @@ const initialState = { chatMessageList: false, marketTableList: false, familyOfferList: false, + parentFamilyTaskList: false, }; export const tableReloadSlice = createSlice({ @@ -53,6 +54,9 @@ export const tableReloadSlice = createSlice({ case "FAMILYOFFERLIST": state.familyOfferList = !state.familyOfferList; return; + case "PARENTFAMILYTASKLIST": // reloads list of active family task on parent side + state.parentFamilyTaskList = !state.parentFamilyTaskList; + return; default: return state; }