From 70d82d89b349b862f22edf739bfd1c6c48532c6a Mon Sep 17 00:00:00 2001 From: victorAnumudu Date: Wed, 13 Mar 2024 19:56:13 +0100 Subject: [PATCH 1/2] added socket event to listen to job market post --- src/components/Contexts/SocketIOContext.js | 12 ++++++++++++ src/components/jobPopout/JobListPopout.jsx | 20 +++++++++++++------- src/middleware/AuthRoute.jsx | 13 +++++++++++-- src/store/TableReloads.js | 4 ++++ 4 files changed, 40 insertions(+), 9 deletions(-) diff --git a/src/components/Contexts/SocketIOContext.js b/src/components/Contexts/SocketIOContext.js index f645e73..9c54e35 100644 --- a/src/components/Contexts/SocketIOContext.js +++ b/src/components/Contexts/SocketIOContext.js @@ -30,11 +30,22 @@ export default function SocketIOContextProvider({children}) { } }; + const marketUpdate = (message, room) => { + if(message && room){ + socket.emit("marketjob_addded", { message, room }); + } + }; + useEffect(() => { socket.on("receive_message", (data) => { // setSocketMsgReceived(data.message); dispatch(tableReload({type:'CHATMESSAGELIST'})) }); + socket.on("received_refreshmarket_jobs", (data) => { + // setSocketMsgReceived(data.message); + dispatch(tableReload({type:'MARKETTABLELIST'})) + console.log('YES ssss') + }); }, [socket]); let values = { @@ -43,6 +54,7 @@ export default function SocketIOContextProvider({children}) { joinRoom, setSocketMsgReceived, socketMsgReceived, + marketUpdate, // room, // setRoom, // message, diff --git a/src/components/jobPopout/JobListPopout.jsx b/src/components/jobPopout/JobListPopout.jsx index b14e9e2..aecfdd7 100644 --- a/src/components/jobPopout/JobListPopout.jsx +++ b/src/components/jobPopout/JobListPopout.jsx @@ -8,6 +8,7 @@ import InputCom from "../Helpers/Inputs/InputCom/index"; import ModalCom from "../Helpers/ModalCom"; import LoadingSpinner from "../Spinners/LoadingSpinner"; import Detail from "./popoutcomponent/Detail"; +import { SocketValues } from "../Contexts/SocketIOContext"; const validationSchema = Yup.object().shape({ family: Yup.string().required("This is required "), @@ -29,6 +30,9 @@ function JobListPopout({ openWallet, setWalletItem, }) { + + let {marketUpdate} = SocketValues() // destructures 'SEND MESSAGE' and 'JOIN ROOM' FUNCTIONS FROM SOCKET + const [selectedTab, setSelectedTab] = useState("public"); const tabs = ["public", "individual", "group"]; @@ -201,7 +205,9 @@ function JobListPopout({ setRequestStatus({ message: "", status: false }); }, 3000); } - dispatch(tableReload({ type: "JOBTABLE" })); + marketUpdate('market', 'full-markets-jobs') // sends an event to the socket to update market lists + dispatch(tableReload({ type: "JOBTABLE" })); // reloads my job page + dispatch(tableReload({ type: "MARKETTABLELIST" })); // reloads market page setRequestStatus({ message: data?.status_msg ? data?.status_msg : "Offer Assigned Successful", status: true }); setTimeout(() => { setLoader({ jobFields: false }); @@ -224,6 +230,12 @@ function JobListPopout({ members: [], }); + const DetailsSection = ({ label, value }) => ( +
+ +
+ ); + // FUNCTION TO POPULATE USER GROUP LIST useEffect(() => { // setGroupList({loading: true, groups: [], members: []}) @@ -250,12 +262,6 @@ function JobListPopout({ }); }, []); - const DetailsSection = ({ label, value }) => ( -
- -
- ); - const DetailsComponent = () => { const detailsArray = [ { label: "Description", value: details.description }, diff --git a/src/middleware/AuthRoute.jsx b/src/middleware/AuthRoute.jsx index 72eb1a3..f5fb940 100644 --- a/src/middleware/AuthRoute.jsx +++ b/src/middleware/AuthRoute.jsx @@ -14,8 +14,12 @@ import { updateWalletDetails } from "../store/walletDetails"; import { familyBannersList } from "../store/FamilyBannerList"; import { familyResources } from "../store/FamilyResources"; import {familyWalletRedeemOptList} from '../store/FamilyWalletRedeemOpt' +import { SocketValues } from "../components/Contexts/SocketIOContext"; const AuthRoute = ({ redirectPath = "/login", children }) => { + + let {joinRoom} = SocketValues() // destructures 'SEND MESSAGE' and 'JOIN ROOM' FUNCTIONS FROM SOCKET + const apiCall = useMemo(() => new usersService(), []); const dispatch = useDispatch(); const [lastActivityTime, setLastActivityTime] = useState(Date.now()); @@ -23,7 +27,7 @@ const AuthRoute = ({ redirectPath = "/login", children }) => { const [loadProfileDetails, setLoadProfileDetails] = useState([]); const navigate = useNavigate(); - const { jobListTable, walletTable, familyBannersListTable } = useSelector( + const { jobListTable, marketTableList, walletTable, familyBannersListTable } = useSelector( (state) => state.tableReload ); @@ -219,7 +223,7 @@ const AuthRoute = ({ redirectPath = "/login", children }) => { } }; getMarketActiveJobList(); - }, [apiCall, dispatch, jobListTable, isLogin.status]); + }, [apiCall, dispatch, marketTableList, isLogin.status]); //FUNCTION TO GET COMMON HEAD DATA useEffect(() => { @@ -309,6 +313,11 @@ const AuthRoute = ({ redirectPath = "/login", children }) => { familyWalletRedeemOptions() }, [isLogin.status]); + useEffect(()=>{ // sends an event to the socket to enable user join a room to be able to receive update when jobs enters the market + joinRoom('full-markets-jobs') + console.log('joined oooooooooooooooooooooooooooooooooooooooooooooooooooooooo') + },[isLogin.status]) + // RENDER PAGE return isLogin.loading && !loggedIn ? ( diff --git a/src/store/TableReloads.js b/src/store/TableReloads.js index 2dc2a87..ea5f766 100644 --- a/src/store/TableReloads.js +++ b/src/store/TableReloads.js @@ -10,6 +10,7 @@ const initialState = { uploadsTable: false, familyBannersListTable: false, chatMessageList: false, + marketTableList: false, }; export const tableReloadSlice = createSlice({ @@ -45,6 +46,9 @@ export const tableReloadSlice = createSlice({ case "CHATMESSAGELIST": state.chatMessageList = !state.chatMessageList; return; + case "MARKETTABLELIST": + state.marketTableList = !state.marketTableList; + return; default: return state; } From 985afa3c7bc2fed7e59e7675e267135d18358176 Mon Sep 17 00:00:00 2001 From: victorAnumudu Date: Wed, 13 Mar 2024 21:02:37 +0100 Subject: [PATCH 2/2] clean up --- src/components/Contexts/SocketIOContext.js | 1 - src/middleware/AuthRoute.jsx | 1 - 2 files changed, 2 deletions(-) diff --git a/src/components/Contexts/SocketIOContext.js b/src/components/Contexts/SocketIOContext.js index 9c54e35..f0d55de 100644 --- a/src/components/Contexts/SocketIOContext.js +++ b/src/components/Contexts/SocketIOContext.js @@ -44,7 +44,6 @@ export default function SocketIOContextProvider({children}) { socket.on("received_refreshmarket_jobs", (data) => { // setSocketMsgReceived(data.message); dispatch(tableReload({type:'MARKETTABLELIST'})) - console.log('YES ssss') }); }, [socket]); diff --git a/src/middleware/AuthRoute.jsx b/src/middleware/AuthRoute.jsx index f5fb940..7d7536c 100644 --- a/src/middleware/AuthRoute.jsx +++ b/src/middleware/AuthRoute.jsx @@ -315,7 +315,6 @@ const AuthRoute = ({ redirectPath = "/login", children }) => { useEffect(()=>{ // sends an event to the socket to enable user join a room to be able to receive update when jobs enters the market joinRoom('full-markets-jobs') - console.log('joined oooooooooooooooooooooooooooooooooooooooooooooooooooooooo') },[isLogin.status])