| const requester = useSelector(selectRequester); | const requester = useSelector(selectRequester); | ||||
| const exchange = useSelector(selectExchange); | const exchange = useSelector(selectExchange); | ||||
| const amIBuyer = useMemo( | const amIBuyer = useMemo( | ||||
| () => exchange?.buyer?.userId === userId, | |||||
| () => exchange?.buyer?.user?._id === userId, | |||||
| [exchange, userId] | [exchange, userId] | ||||
| ); | ); | ||||
| const haveIAccepted = useMemo( | const haveIAccepted = useMemo( | ||||
| [amIBuyer, exchange] | [amIBuyer, exchange] | ||||
| ); | ); | ||||
| const interlocutorUserId = useMemo( | const interlocutorUserId = useMemo( | ||||
| () => (amIBuyer ? exchange?.seller?.userId : exchange?.buyer?.userId), | |||||
| () => (amIBuyer ? exchange?.seller?.user?._id : exchange?.buyer?.user?._id), | |||||
| [exchange, amIBuyer] | [exchange, amIBuyer] | ||||
| ); | ); | ||||
| const message = useMemo(() => { | const message = useMemo(() => { |
| const exchange = useSelector(selectExchange); | const exchange = useSelector(selectExchange); | ||||
| const requester = useSelector(selectRequester); | const requester = useSelector(selectRequester); | ||||
| const handleAcceptExchange = () => { | |||||
| const handleAcceptExchangeSuccess = () => { | |||||
| console.log("accept salje i prima 3 POZVANA RESPONSE FUNKCIJA"); | |||||
| acceptExchangeSocket( | acceptExchangeSocket( | ||||
| props.chatId, | props.chatId, | ||||
| props.userId, | props.userId, | ||||
| props.interlocutorUserId, | props.interlocutorUserId, | ||||
| () => { | () => { | ||||
| dispatch( | |||||
| acceptExchange({ | |||||
| exchangeId: exchange._id, | |||||
| }) | |||||
| ); | |||||
| console.log("accept salje i prima 4 SOCKET FUNKCIJA"); | |||||
| dispatch( | dispatch( | ||||
| addNewMessage({ | addNewMessage({ | ||||
| _id: props.chatId, | _id: props.chatId, | ||||
| } | } | ||||
| ); | ); | ||||
| }; | }; | ||||
| const handleAcceptExchange = () => { | |||||
| console.log("accept salje i prima 1 POZVANA FUNKCIJA"); | |||||
| dispatch( | |||||
| acceptExchange({ | |||||
| exchangeId: exchange._id, | |||||
| handleApiResponseSuccess: handleAcceptExchangeSuccess, | |||||
| }) | |||||
| ); | |||||
| }; | |||||
| return ( | return ( | ||||
| <RequestExchangeMessageContainer> | <RequestExchangeMessageContainer> | ||||
| <RequestExchangeMessageText> | <RequestExchangeMessageText> |
| return; | return; | ||||
| } | } | ||||
| addMessageListener(({ succeed, data }) => { | addMessageListener(({ succeed, data }) => { | ||||
| console.log(data); | |||||
| if (succeed) { | if (succeed) { | ||||
| dispatch( | dispatch( |
| } from "../../store/selectors/exchangeSelector"; | } from "../../store/selectors/exchangeSelector"; | ||||
| import { | import { | ||||
| acceptExchange, | acceptExchange, | ||||
| fetchExchange, | |||||
| setRequester, | setRequester, | ||||
| } from "../../store/actions/exchange/exchangeActions"; | } from "../../store/actions/exchange/exchangeActions"; | ||||
| import { convertLocalDateToUTCDate } from "../../util/helpers/dateHelpers"; | import { convertLocalDateToUTCDate } from "../../util/helpers/dateHelpers"; | ||||
| }, [chat, location.state]); | }, [chat, location.state]); | ||||
| const amIBuyer = useMemo( | const amIBuyer = useMemo( | ||||
| () => exchange.buyer?.userId === userId, | |||||
| () => exchange.buyer?.user?._id === userId, | |||||
| [exchange, userId] | [exchange, userId] | ||||
| ); | ); | ||||
| // Listener to socket.IO chat | // Listener to socket.IO chat | ||||
| useEffect(() => { | useEffect(() => { | ||||
| addMessageListener(({ succeed, data }) => { | addMessageListener(({ succeed, data }) => { | ||||
| console.log(data); | |||||
| if (succeed) { | if (succeed) { | ||||
| if ( | if ( | ||||
| [...allChats].find((item) => { | [...allChats].find((item) => { | ||||
| message: data.message, | message: data.message, | ||||
| }) | }) | ||||
| ); | ); | ||||
| if ( | |||||
| data.message?.isAcceptRequest && | |||||
| requester === requesterStatus.NOONE | |||||
| ) { | |||||
| dispatch(setRequester(requesterStatus.interlocutor)); | |||||
| if (data.message?.isAcceptRequest) { | |||||
| dispatch(fetchExchange(exchange?._id)); | |||||
| if (requester === requesterStatus.NOONE) { | |||||
| dispatch(setRequester(requesterStatus.interlocutor)); | |||||
| } | |||||
| } | } | ||||
| } else { | } else { | ||||
| dispatch(fetchChats()); | dispatch(fetchChats()); | ||||
| } | } | ||||
| }); | }); | ||||
| return () => removeMessageListener(); | return () => removeMessageListener(); | ||||
| }, [allChats, routeMatch]); | |||||
| }, [allChats, routeMatch, requester]); | |||||
| const refreshChat = () => { | const refreshChat = () => { | ||||
| if (routeMatch.params?.chatId === "newMessage") { | if (routeMatch.params?.chatId === "newMessage") { | ||||
| dispatch(fetchOneChat(routeMatch.params?.chatId)); | dispatch(fetchOneChat(routeMatch.params?.chatId)); | ||||
| } | } | ||||
| }; | }; | ||||
| const handleAcceptExchange = () => { | |||||
| const handleAcceptExchangeSuccess = () => { | |||||
| let interlocutor = userId === chat?.participants[0]._id ? 1 : 0; | let interlocutor = userId === chat?.participants[0]._id ? 1 : 0; | ||||
| console.log("accept salje i prima 3 POZVANA RESPONSE FUNKCIJA") | |||||
| acceptExchangeSocket( | acceptExchangeSocket( | ||||
| chat?._id, | chat?._id, | ||||
| userId, | userId, | ||||
| chat?.participants[interlocutor]._id, | chat?.participants[interlocutor]._id, | ||||
| () => { | () => { | ||||
| dispatch( | |||||
| acceptExchange({ | |||||
| exchangeId: exchange._id, | |||||
| }) | |||||
| ); | |||||
| console.log("accept salje i prima 4 SOCKET FUNKCIJA") | |||||
| dispatch( | dispatch( | ||||
| addNewMessage({ | addNewMessage({ | ||||
| _id: chat?._id, | _id: chat?._id, | ||||
| message: { | message: { | ||||
| user: { | user: { | ||||
| _id: userId | |||||
| _id: userId, | |||||
| }, | }, | ||||
| isAcceptRequest: true, | isAcceptRequest: true, | ||||
| text: "", | text: "", | ||||
| } | } | ||||
| ); | ); | ||||
| }; | }; | ||||
| const handleAcceptExchange = () => { | |||||
| console.log("accept salje i prima 1 POZVANA FUNKCIJA") | |||||
| dispatch( | |||||
| acceptExchange({ | |||||
| exchangeId: exchange._id, | |||||
| handleApiResponseSuccess: handleAcceptExchangeSuccess, | |||||
| }) | |||||
| ); | |||||
| }; | |||||
| return ( | return ( | ||||
| <DirectChatContainer> | <DirectChatContainer> | ||||
| {isLoadingDirectChat || isLoadingDirectChat === undefined ? ( | {isLoadingDirectChat || isLoadingDirectChat === undefined ? ( |
| import { useSelector } from "react-redux"; | import { useSelector } from "react-redux"; | ||||
| import { selectExchange } from "../../../store/selectors/exchangeSelector"; | import { selectExchange } from "../../../store/selectors/exchangeSelector"; | ||||
| import { useDispatch } from "react-redux"; | import { useDispatch } from "react-redux"; | ||||
| import { fetchExchange } from "../../../store/actions/exchange/exchangeActions"; | |||||
| import { | |||||
| fetchExchange, | |||||
| setExchange, | |||||
| } from "../../../store/actions/exchange/exchangeActions"; | |||||
| import { selectSelectedChat } from "../../../store/selectors/chatSelectors"; | import { selectSelectedChat } from "../../../store/selectors/chatSelectors"; | ||||
| import { selectUserId } from "../../../store/selectors/loginSelectors"; | import { selectUserId } from "../../../store/selectors/loginSelectors"; | ||||
| import { toggleCreateReviewModal } from "../../../store/actions/modal/modalActions"; | import { toggleCreateReviewModal } from "../../../store/actions/modal/modalActions"; | ||||
| import { setOneChat } from "../../../store/actions/chat/chatActions"; | |||||
| const DirectChatHeader = (props) => { | const DirectChatHeader = (props) => { | ||||
| const exchange = useSelector(selectExchange); | const exchange = useSelector(selectExchange); | ||||
| const dispatch = useDispatch(); | const dispatch = useDispatch(); | ||||
| const chat = useSelector(selectSelectedChat); | const chat = useSelector(selectSelectedChat); | ||||
| useEffect(() => { | |||||
| return () => { | |||||
| dispatch(setExchange({})); | |||||
| dispatch(setOneChat({})); | |||||
| }; | |||||
| }, []); | |||||
| useEffect(() => { | useEffect(() => { | ||||
| if (chat?.exchange?._id) refetchExchange(); | if (chat?.exchange?._id) refetchExchange(); | ||||
| }, [chat?.exchange]); | }, [chat?.exchange]); |
| import React from "react"; | import React from "react"; | ||||
| import PropTypes from "prop-types"; | import PropTypes from "prop-types"; | ||||
| import { useSelector } from "react-redux"; | |||||
| import { useDispatch, useSelector } from "react-redux"; | |||||
| import { selectTotalOffers } from "../../../../store/selectors/offersSelectors"; | import { selectTotalOffers } from "../../../../store/selectors/offersSelectors"; | ||||
| import { OffersContainer } from "./OffersList.styled"; | import { OffersContainer } from "./OffersList.styled"; | ||||
| import BigProfileCard from "../../../Cards/ProfileCard/BigProfileCard/BigProfileCard"; | import BigProfileCard from "../../../Cards/ProfileCard/BigProfileCard/BigProfileCard"; | ||||
| import { startChat } from "../../../../util/helpers/chatHelper"; | import { startChat } from "../../../../util/helpers/chatHelper"; | ||||
| import { selectLatestChats } from "../../../../store/selectors/chatSelectors"; | import { selectLatestChats } from "../../../../store/selectors/chatSelectors"; | ||||
| import { selectUserId } from "../../../../store/selectors/loginSelectors"; | import { selectUserId } from "../../../../store/selectors/loginSelectors"; | ||||
| import { setRequester } from "../../../../store/actions/exchange/exchangeActions"; | |||||
| import requesterStatus from "../../../../constants/requesterStatus"; | |||||
| const OffersList = (props) => { | const OffersList = (props) => { | ||||
| const totalOffers = useSelector(selectTotalOffers); | const totalOffers = useSelector(selectTotalOffers); | ||||
| const chats = useSelector(selectLatestChats); | const chats = useSelector(selectLatestChats); | ||||
| const userId = useSelector(selectUserId); | const userId = useSelector(selectUserId); | ||||
| const dispatch = useDispatch(); | |||||
| const offers = props?.offers; | const offers = props?.offers; | ||||
| const messageOneUser = (offer) => { | const messageOneUser = (offer) => { | ||||
| dispatch(setRequester(requesterStatus.NOONE)); | |||||
| startChat(chats, offer, userId); | startChat(chats, offer, userId); | ||||
| }; | }; | ||||
| return ( | return ( |
| // baseURL: "http://192.168.88.175:3005/", | // baseURL: "http://192.168.88.175:3005/", | ||||
| // baseURL: "http://192.168.88.143:3001/", // DULE | // baseURL: "http://192.168.88.143:3001/", // DULE | ||||
| // baseURL: "https://trampa-api.dilig.net/", | // baseURL: "https://trampa-api.dilig.net/", | ||||
| baseURL: "https://trampa-api-test.dilig.net/", | |||||
| // baseURL: "http://localhost:3001/", | |||||
| // baseURL: "https://trampa-api-test.dilig.net/", | |||||
| baseURL: "http://localhost:3001/", | |||||
| // baseURL: process.env.REACT_APP_BASE_API_URL, | // baseURL: process.env.REACT_APP_BASE_API_URL, | ||||
| headers: { | headers: { | ||||
| "Content-Type": "application/json", | "Content-Type": "application/json", |
| // const baseURL = "http://192.168.88.143:3001/"; // DULE | // const baseURL = "http://192.168.88.143:3001/"; // DULE | ||||
| // const baseURL = "http://192.168.88.175:3005/"; | // const baseURL = "http://192.168.88.175:3005/"; | ||||
| // const baseURL = "https://trampa-api.dilig.net/"; | // const baseURL = "https://trampa-api.dilig.net/"; | ||||
| const baseURL = "https://trampa-api-test.dilig.net/"; | |||||
| // const baseURL = "https://trampa-api-test.dilig.net/"; | |||||
| // const baseURL = "http://192.168.88.150:3001/"; // DJOLE | // const baseURL = "http://192.168.88.150:3001/"; // DJOLE | ||||
| // const baseURL = "http://localhost:3001/"; | |||||
| const baseURL = "http://localhost:3001/"; | |||||
| // const baseURL = process.env.REACT_APP_BASE_API_URL | // const baseURL = process.env.REACT_APP_BASE_API_URL | ||||
| //Interceptor unique name | //Interceptor unique name | ||||
| } | } | ||||
| // If refresh token is expired, log out user | // If refresh token is expired, log out user | ||||
| console.log(new Date(refreshTokenDecoded?.exp * 1000)) | |||||
| console.log(new Date()) | |||||
| if (new Date() > new Date(refreshTokenDecoded?.exp * 1000)) { | if (new Date() > new Date(refreshTokenDecoded?.exp * 1000)) { | ||||
| dispatch(logoutUser()); | dispatch(logoutUser()); | ||||
| return Promise.resolve(response) | |||||
| } | } | ||||
| // If access token is expired, refresh access token | // If access token is expired, refresh access token | ||||
| if (new Date() > new Date(jwtTokenDecoded.exp * 1000)) { | if (new Date() > new Date(jwtTokenDecoded.exp * 1000)) { |
| } | } | ||||
| function addNewMessage(state, { payload }) { | function addNewMessage(state, { payload }) { | ||||
| let allChats = [...state.latestChats]; | let allChats = [...state.latestChats]; | ||||
| console.log("state", state); | |||||
| let chat = allChats.find((item) => item._id === payload._id); | let chat = allChats.find((item) => item._id === payload._id); | ||||
| console.log("chat: ", chat); | |||||
| if (chat) { | if (chat) { | ||||
| chat = { | chat = { | ||||
| ...chat, | ...chat, | ||||
| messages: [...chat.messages, payload.message], | messages: [...chat.messages, payload.message], | ||||
| }; | }; | ||||
| console.log("newchat: ", chat); | |||||
| allChats = allChats.filter((item) => item._id !== chat._id); | allChats = allChats.filter((item) => item._id !== chat._id); | ||||
| console.log("allchats1: ", allChats); | |||||
| allChats = [chat, ...allChats]; | allChats = [chat, ...allChats]; | ||||
| console.log("allchats2: ", allChats); | |||||
| } | } | ||||
| let newSelectedChat = {}; | let newSelectedChat = {}; | ||||
| if (state.selectedChat.chat) newSelectedChat = { ...state.selectedChat }; | if (state.selectedChat.chat) newSelectedChat = { ...state.selectedChat }; | ||||
| console.log("newSelectedChat1: ", newSelectedChat); | |||||
| newSelectedChat = { ...chat }; | newSelectedChat = { ...chat }; | ||||
| console.log("newSelectedChat2: ", newSelectedChat); | |||||
| return { | return { | ||||
| ...state, | ...state, | ||||
| latestChats: [...allChats], | latestChats: [...allChats], |
| } | } | ||||
| function* startNewChat(payload) { | function* startNewChat(payload) { | ||||
| try { | try { | ||||
| console.log(payload) | |||||
| const userId = yield select(selectUserId); | const userId = yield select(selectUserId); | ||||
| const newChatData = yield call(attemptCreateNewChat, { | const newChatData = yield call(attemptCreateNewChat, { | ||||
| offerId: payload.payload.offerId, | offerId: payload.payload.offerId, |
| } | } | ||||
| function* acceptExchange({ payload }) { | function* acceptExchange({ payload }) { | ||||
| try { | try { | ||||
| console.log("accept salje i prima 2 POZVANA ACCEPT SAGA") | |||||
| const userId = yield select(selectUserId); | const userId = yield select(selectUserId); | ||||
| yield call(attemptAcceptExchange, userId, payload.exchangeId); | yield call(attemptAcceptExchange, userId, payload.exchangeId); | ||||
| const data = yield call(attemptFetchExchange, payload.exchangeId); | const data = yield call(attemptFetchExchange, payload.exchangeId); | ||||
| yield put(setExchange(data.data)); | yield put(setExchange(data.data)); | ||||
| if (payload.handleApiResponseSuccess) | |||||
| yield call(payload.handleApiResponseSuccess); | |||||
| yield put(acceptExchangeSuccess()); | yield put(acceptExchangeSuccess()); | ||||
| } catch (e) { | } catch (e) { | ||||
| yield put(acceptExchangeError()); | yield put(acceptExchangeError()); |