|
|
|
|
|
|
|
|
import React, { useState } from "react"; |
|
|
import React, { useState } from "react"; |
|
|
import PropTypes from "prop-types"; |
|
|
import PropTypes from "prop-types"; |
|
|
import { MarketPlaceContainer } from "./MarketPlace.styled"; |
|
|
|
|
|
|
|
|
import { |
|
|
|
|
|
AddOfferButton, |
|
|
|
|
|
AddPlusIcon, |
|
|
|
|
|
MarketPlaceContainer, |
|
|
|
|
|
} from "./MarketPlace.styled"; |
|
|
import Header from "./Header/Header"; |
|
|
import Header from "./Header/Header"; |
|
|
import Offers from "./Offers/Offers"; |
|
|
import Offers from "./Offers/Offers"; |
|
|
import { useDispatch, useSelector } from "react-redux"; |
|
|
import { useDispatch, useSelector } from "react-redux"; |
|
|
import { useEffect } from "react"; |
|
|
import { useEffect } from "react"; |
|
|
import { fetchChats } from "../../store/actions/chat/chatActions"; |
|
|
import { fetchChats } from "../../store/actions/chat/chatActions"; |
|
|
import { selectUserId } from "../../store/selectors/loginSelectors"; |
|
|
import { selectUserId } from "../../store/selectors/loginSelectors"; |
|
|
|
|
|
import { toggleCreateOfferModal } from "../../store/actions/modal/modalActions"; |
|
|
|
|
|
import useIsMobile from "../../hooks/useIsMobile"; |
|
|
|
|
|
|
|
|
const MarketPlace = (props) => { |
|
|
const MarketPlace = (props) => { |
|
|
const [isGrid, setIsGrid] = useState(false); |
|
|
const [isGrid, setIsGrid] = useState(false); |
|
|
const userId = useSelector(selectUserId); |
|
|
const userId = useSelector(selectUserId); |
|
|
const dispatch = useDispatch(); |
|
|
const dispatch = useDispatch(); |
|
|
|
|
|
const { isMobile } = useIsMobile(); |
|
|
useEffect(() => { |
|
|
useEffect(() => { |
|
|
console.log("ABG", userId); |
|
|
console.log("ABG", userId); |
|
|
if (userId) |
|
|
if (userId) |
|
|
|
|
|
|
|
|
); |
|
|
); |
|
|
}, [userId]); |
|
|
}, [userId]); |
|
|
const offers = props.offers; |
|
|
const offers = props.offers; |
|
|
|
|
|
const addOfferHandler = () => { |
|
|
|
|
|
dispatch(toggleCreateOfferModal()); |
|
|
|
|
|
}; |
|
|
return ( |
|
|
return ( |
|
|
<MarketPlaceContainer> |
|
|
<MarketPlaceContainer> |
|
|
<Header |
|
|
<Header |
|
|
|
|
|
|
|
|
isUsers={props.users} |
|
|
isUsers={props.users} |
|
|
users={props.allUsers} |
|
|
users={props.allUsers} |
|
|
/> |
|
|
/> |
|
|
|
|
|
{isMobile && ( |
|
|
|
|
|
<AddOfferButton onClick={addOfferHandler}> |
|
|
|
|
|
<AddPlusIcon /> |
|
|
|
|
|
</AddOfferButton> |
|
|
|
|
|
)} |
|
|
</MarketPlaceContainer> |
|
|
</MarketPlaceContainer> |
|
|
); |
|
|
); |
|
|
}; |
|
|
}; |