| REACT_APP_BASE_API_URL=https://trampa-api-test.dilig.net/ | |||||
| REACT_APP_BASE_API_URL=https://trampa-api.dilig.net/ |
| locationRef?.current?.closeSection(); | locationRef?.current?.closeSection(); | ||||
| companyRef?.current?.closeSection(); | companyRef?.current?.closeSection(); | ||||
| }; | }; | ||||
| console.log(props); | |||||
| return ( | return ( | ||||
| <FilterCardContainer | <FilterCardContainer | ||||
| filtersOpened={props.filtersOpened} | filtersOpened={props.filtersOpened} |
| display: -webkit-box; | display: -webkit-box; | ||||
| -webkit-line-clamp: 5; | -webkit-line-clamp: 5; | ||||
| -webkit-box-orient: vertical; | -webkit-box-orient: vertical; | ||||
| pointer-events: none; | |||||
| @media (max-width: 1500px) { | @media (max-width: 1500px) { | ||||
| display: none; | display: none; | ||||
| } | } |
| import { useTranslation } from "react-i18next"; | import { useTranslation } from "react-i18next"; | ||||
| import useIsTablet from "../../hooks/useIsTablet"; | import useIsTablet from "../../hooks/useIsTablet"; | ||||
| import { clearFilters } from "../../store/actions/filters/filtersActions"; | import { clearFilters } from "../../store/actions/filters/filtersActions"; | ||||
| import { selectLatestChats } from "../../store/selectors/chatSelectors"; | |||||
| const Header = () => { | const Header = () => { | ||||
| const theme = useTheme(); | const theme = useTheme(); | ||||
| const routeMatch = useRouteMatch(); | const routeMatch = useRouteMatch(); | ||||
| const { isTablet } = useIsTablet(); | const { isTablet } = useIsTablet(); | ||||
| const [logoClicked, setLogoClicked] = useState(false); | const [logoClicked, setLogoClicked] = useState(false); | ||||
| const [badge, setBadge] = useState(0); | |||||
| const { t } = useTranslation(); | const { t } = useTranslation(); | ||||
| console.log(history.location.pathname.includes("messages")); | |||||
| const allChats = useSelector(selectLatestChats); | |||||
| const seenLastChat = allChats[0]?.participants?.filter( | |||||
| (item) => item._id === user | |||||
| )[0]?.hasSeenLatestMessages; | |||||
| useEffect(() => { | |||||
| if (seenLastChat === false) { | |||||
| setBadge((prevState) => prevState + 1); | |||||
| } | |||||
| }, [seenLastChat]); | |||||
| // Dont show header on auth routes(login, register, etc.) and admin routes | // Dont show header on auth routes(login, register, etc.) and admin routes | ||||
| useEffect(() => { | useEffect(() => { | ||||
| <MySwapsButton | <MySwapsButton | ||||
| handleAddOfferClick={handleAddOfferClick} | handleAddOfferClick={handleAddOfferClick} | ||||
| /> | /> | ||||
| <MyMessagesButton /> | |||||
| <MyMessagesButton badge={badge} setBadge={setBadge} /> | |||||
| </> | </> | ||||
| )} | )} | ||||
| <UserButton name={name} /> | <UserButton name={name} /> |
| import { useLocation } from "react-router-dom"; | import { useLocation } from "react-router-dom"; | ||||
| import { useEffect } from "react"; | import { useEffect } from "react"; | ||||
| import { useTranslation } from "react-i18next"; | import { useTranslation } from "react-i18next"; | ||||
| // import { selectLatestChats } from "../../../store/selectors/chatSelectors"; | |||||
| // import { selectUserId } from "../../../store/selectors/loginSelectors"; | |||||
| // import { useSelector } from "react-redux"; | |||||
| const MyMessagesButton = () => { | |||||
| const MyMessagesButton = (props) => { | |||||
| // const [badge, setBadge] = useState(0); | |||||
| const location = useLocation(); | const location = useLocation(); | ||||
| const { t } = useTranslation(); | const { t } = useTranslation(); | ||||
| const [msgPopoverOpen, setMsgPopoverOpen] = useState(false); | const [msgPopoverOpen, setMsgPopoverOpen] = useState(false); | ||||
| const [msgAnchorEl, setMsgAnchorEl] = useState(null); | const [msgAnchorEl, setMsgAnchorEl] = useState(null); | ||||
| // const allChats = useSelector(selectLatestChats); | |||||
| // const userId = useSelector(selectUserId); | |||||
| // let lastChatLength = allChats[0]?.messages?.map( | |||||
| // (mesage) => mesage.user._id !== userId | |||||
| // ).length; | |||||
| // console.log(lastChatLength); | |||||
| // useEffect(() => { | |||||
| // setBadge(badge + 1); | |||||
| // }, [lastChatLength]); | |||||
| useEffect(() => { | useEffect(() => { | ||||
| setMsgPopoverOpen(false); | setMsgPopoverOpen(false); | ||||
| }, [location.pathname]); | }, [location.pathname]); | ||||
| const openMsgPopover = (event) => { | const openMsgPopover = (event) => { | ||||
| setMsgPopoverOpen(true); | setMsgPopoverOpen(true); | ||||
| setMsgAnchorEl(event.currentTarget); | setMsgAnchorEl(event.currentTarget); | ||||
| props.setBadge(0); | |||||
| }; | }; | ||||
| const closeMsgPopover = () => { | const closeMsgPopover = () => { | ||||
| setMsgPopoverOpen(false); | setMsgPopoverOpen(false); | ||||
| setMsgAnchorEl(null); | setMsgAnchorEl(null); | ||||
| }; | }; | ||||
| const badgeStyle = { | |||||
| "& .MuiBadge-badge": { | |||||
| color: selectedTheme.colors.primaryPurple, | |||||
| backgroundColor: selectedTheme.colors.iconYellowColor, | |||||
| fontWeight: 700, | |||||
| }, | |||||
| }; | |||||
| return ( | return ( | ||||
| <> | <> | ||||
| <IconButton | <IconButton | ||||
| color: selectedTheme.colors.primaryPurple, | color: selectedTheme.colors.primaryPurple, | ||||
| }} | }} | ||||
| > | > | ||||
| <Badge color="primary"> | |||||
| <Badge sx={badgeStyle} badgeContent={props.badge}> | |||||
| <MailIcon /> | <MailIcon /> | ||||
| </Badge> | </Badge> | ||||
| </IconButton> | </IconButton> | ||||
| MyMessagesButton.propTypes = { | MyMessagesButton.propTypes = { | ||||
| onClick: PropTypes.func, | onClick: PropTypes.func, | ||||
| badge: PropTypes.any, | |||||
| setBadge: PropTypes.func, | |||||
| }; | }; | ||||
| export default MyMessagesButton; | export default MyMessagesButton; |
| import React, { useMemo } from "react"; | |||||
| import React, { useMemo, useEffect } from "react"; | |||||
| import { PropTypes } from "prop-types"; | import { PropTypes } from "prop-types"; | ||||
| import Header from "./Header/Header"; | import Header from "./Header/Header"; | ||||
| import { useSelector } from "react-redux"; | |||||
| import { useDispatch, useSelector } from "react-redux"; | |||||
| import { | import { | ||||
| ItemDetailsContainer, | ItemDetailsContainer, | ||||
| OfferIconContainer, | OfferIconContainer, | ||||
| import { ONE_OFFER_SCOPE } from "../../store/actions/offers/offersActionConstants"; | import { ONE_OFFER_SCOPE } from "../../store/actions/offers/offersActionConstants"; | ||||
| import { selectIsLoadingByActionType } from "../../store/selectors/loadingSelectors"; | import { selectIsLoadingByActionType } from "../../store/selectors/loadingSelectors"; | ||||
| import SkeletonItemDetails from "./SkeletonItemDetails/SkeletonItemDetails"; | import SkeletonItemDetails from "./SkeletonItemDetails/SkeletonItemDetails"; | ||||
| import { fetchChats } from "../../store/actions/chat/chatActions"; | |||||
| const ItemDetails = (props) => { | const ItemDetails = (props) => { | ||||
| const offer = useSelector(selectOffer); | const offer = useSelector(selectOffer); | ||||
| const userId = useSelector(selectUserId); | const userId = useSelector(selectUserId); | ||||
| const { t } = useTranslation(); | const { t } = useTranslation(); | ||||
| const dispatch = useDispatch(); | |||||
| useEffect(() => { | |||||
| if (userId) | |||||
| dispatch( | |||||
| fetchChats({ | |||||
| currentPage: 1, | |||||
| }) | |||||
| ); | |||||
| }, [userId]); | |||||
| const isLoadingOffer = useSelector( | const isLoadingOffer = useSelector( | ||||
| selectIsLoadingByActionType(ONE_OFFER_SCOPE) | selectIsLoadingByActionType(ONE_OFFER_SCOPE) | ||||
| ); | ); |
| const goBack = () => { | const goBack = () => { | ||||
| history.goBack(); | history.goBack(); | ||||
| }; | }; | ||||
| console.log(props); | |||||
| return ( | return ( | ||||
| <Tooltip | <Tooltip | ||||
| title={ | title={ |
| import { useRouteMatch } from "react-router-dom"; | import { useRouteMatch } from "react-router-dom"; | ||||
| import { fetchProfile } from "../../store/actions/profile/profileActions"; | import { fetchProfile } from "../../store/actions/profile/profileActions"; | ||||
| import Header from "./Header/Header"; | import Header from "./Header/Header"; | ||||
| import { fetchChats } from "../../store/actions/chat/chatActions"; | |||||
| const Profile = (props) => { | const Profile = (props) => { | ||||
| const userId = useSelector(selectUserId); | const userId = useSelector(selectUserId); | ||||
| dispatch(fetchProfile(profileId)); | dispatch(fetchProfile(profileId)); | ||||
| } | } | ||||
| }, [profileId]); | }, [profileId]); | ||||
| useEffect(() => { | |||||
| if (userId) | |||||
| dispatch( | |||||
| fetchChats({ | |||||
| currentPage: 1, | |||||
| }) | |||||
| ); | |||||
| }, [userId]); | |||||
| const isMyProfile = useMemo(() => { | const isMyProfile = useMemo(() => { | ||||
| return userId === routeMatch.params?.profileId; | return userId === routeMatch.params?.profileId; | ||||
| }, [userId, routeMatch]); | }, [userId, routeMatch]); |
| editor={editor} | editor={editor} | ||||
| value={isJsonString(props?.value) ? JSON.parse(props?.value) : value} | value={isJsonString(props?.value) ? JSON.parse(props?.value) : value} | ||||
| onChange={(newValue) => { | onChange={(newValue) => { | ||||
| console.log( | |||||
| editor.selection | |||||
| ? Editor.string(editor, editor.selection) | |||||
| : "<no selection>" | |||||
| ); | |||||
| const marks = Editor.marks(editor); | const marks = Editor.marks(editor); | ||||
| console.log("marks", marks); | |||||
| if (marks) { | if (marks) { | ||||
| console.log("ovde je true"); | |||||
| console.log("marks a", marks?.a); | |||||
| if ( | if ( | ||||
| ((editor?.selection && | ((editor?.selection && | ||||
| Editor.string(editor, editor.selection).length === 0) || | Editor.string(editor, editor.selection).length === 0) || | ||||
| !editor?.selection) && | !editor?.selection) && | ||||
| marks?.a | marks?.a | ||||
| ) { | ) { | ||||
| console.log("marks", marks); | |||||
| Editor.removeMark(editor, "a"); | Editor.removeMark(editor, "a"); | ||||
| } | } | ||||
| } | } |
| const toggleFilters = () => { | const toggleFilters = () => { | ||||
| setFiltersOpened((prevFiltersOpened) => !prevFiltersOpened); | setFiltersOpened((prevFiltersOpened) => !prevFiltersOpened); | ||||
| }; | }; | ||||
| console.log("ABBGAG"); | |||||
| if (userId || props?.isMarketplacePage) { | if (userId || props?.isMarketplacePage) { | ||||
| return ( | return ( | ||||
| <HomePageContainer> | <HomePageContainer> |