Merge branch 'bugfix/app-changes' of https://git.dilig.net/selenaaasi/trampa-frontend into bugfix/1758

src/App.js

   useEffect(() => {
     socketInit(userId);
   }, [userId]);
-
   return (
     <Router history={history}>
       <Helmet>

src/components/Admin/Sidebar/MarketplaceButton/MarketplaceButton.js

   MarketplaceIcon,
 } from "./MarketplaceButton.styled";
 import { useTranslation } from "react-i18next";
+import history from "../../../../store/utils/history";
 
 const MarketplaceButton = () => {
   const { t } = useTranslation();

src/components/Admin/Sidebar/SidebarNavigation/SidebarNavigation.js

 import { isInRoute, routeMatches } from "../../../../util/helpers/routeHelpers";
 import { ADMIN_HOME_PAGE, ADMIN_USERS_PAGE } from "../../../../constants/pages";
 import { ADMIN_NAVIGATION } from "../../../../constants/adminNavigation";
+import history from "../../../../store/utils/history";
 
 const SidebarNavigation = () => {
   const { t } = useTranslation();

src/components/Buttons/ArrowButton/ArrowButton.styled.js

 import { ReactComponent as DownArrow } from "../../../assets/images/svg/arrow-down.svg";
-import styled from "styled-components";
+import styled, { css } from "styled-components";
 import selectedTheme from "../../../themes";
 import { IconButton } from "../IconButton/IconButton";
 
 `}
   width: 18px;
   height: 18px;
-  /* position: relative;
+  position: relative;
   top: 1px;
-  left: 1px; */
+  left: 1px;
   & path {
     ${(props) =>
       props.disabled &&
   }
   ${(props) =>
     props.disabled &&
-    `
+    css`
     border 1px solid ${selectedTheme.colors.iconStrokeDisabledColor} !important;
     &:hover {
         background-color: inherit;

src/components/Buttons/IconButton/IconButton.js

         onClick={props.onClick}
         sx={props.style}
         iconcolor={props.iconColor}
-        {...props}
+        // {...props}
       >
         {props.children}
       </IconButtonStyled>

src/components/Cards/ChatCard/ChatCard.js

 import useIsMobile from "../../../hooks/useIsMobile";
 import { getImageUrl, variants } from "../../../util/helpers/imageUrlGetter";
 import BlockedProfile from "../ProfileCard/BlockedProfile/BlockedProfile";
+import { useSelector } from "react-redux";
+import { selectUserId } from "../../../store/selectors/loginSelectors";
 
 // Chat card is shown only on mobile phones (route /messages)
 const ChatCard = (props) => {
   const { isMobile } = useIsMobile();
+  const userId = useSelector(selectUserId);
 
   const chat = useMemo(() => {
     return props.chat;
   }, [props.chat]);
 
   const routeToItem = () => {
-    props.navigateToChat(chat?.chat?._id);
+    props.navigateToChat(chat?._id);
   };
+  const interlocutor = useMemo(() => {
+    return userId === chat?.participants[0]._id ? 1 : 0;
+  }, [userId, chat]);
 
   return (
     <ChatCardContainer onClick={routeToItem}>
       <UserImgWrapper>
         <UserImage
           src={getImageUrl(
-            chat?.interlocutorData?.image,
+            chat?.participants[interlocutor].image,
             variants.chatCard,
             isMobile
           )}
         />
       </UserImgWrapper>
-      <ChatInfo isBlocked={props.chat.interlocutorData?._blocked}>
+      <ChatInfo isBlocked={props.chat.participants[interlocutor]?._blocked}>
         <ProfileNameContainer>
-          <UserName>{chat?.interlocutorData?.name}</UserName>
-          {(props.chat.interlocutorData?._blocked ||
-            props.chat.interlocutorData?._deleted) && (
+          <UserName>{chat?.participants[interlocutor]?.company?.name}</UserName>
+          {(props.chat?.participants[interlocutor]?._blocked ||
+            props.chat?.participants[interlocutor]?._deleted) && (
             <BlockedProfile
               redText
               chatCard
               shortText
               aboveTitle
               hideIcon
-              deleted={props.chat.interlocutorData?._deleted}
+              deleted={props.chat?.participants[interlocutor]?._deleted}
             />
           )}
         </ProfileNameContainer>

src/components/Cards/ChatCard/MobileOfferDetails/MobileOfferDetails.js

   return (
     <OfferCardContainerMobile>
       <OfferTextMobile>{t("messages.cardProduct")}</OfferTextMobile>
-      <OfferTitleMobile>{props.chat?.offerData?.name}</OfferTitleMobile>
+      <OfferTitleMobile>{props.chat?.offer?.name}</OfferTitleMobile>
     </OfferCardContainerMobile>
   );
 };

src/components/Cards/FilterCard/Choser/CategoryChoser/CategoryChoser.js

     filters.subcategory.setSelectedSubcategory({});
     props.offers.applyFilters();
   };
-  console.log(props);
   useImperativeHandle(ref, () => ({
     closeSection: () => {
       setIsOpened(false);
 
   useEffect(() => {
     if (
-      !filters.category.selectedCategoryLocally ||
+      (filters.category.selectedCategoryLocally &&
+        !("_id" in filters.category.selectedCategoryLocally)) ||
       (filters.category.selectedCategoryLocally?._id === 0 && !isOpened)
     ) {
       setIsOpened(false);

src/components/Cards/FilterCard/Choser/CompanyChoser/CompanyChoser.js

 
 const CompanyChoser = forwardRef((props, ref) => {
   const [isOpened, setIsOpened] = useState(false);
+  const [appliedFilters, setAppliedFilters] = useState(false);
   const filters = props.filters;
   const { t } = useTranslation();
 
     }
   }, [filters.companies.selectedCompaniesLocally]);
 
+  useEffect(() => {
+    if (appliedFilters) {
+      props?.offers?.apply();
+      setAppliedFilters(false);
+    }
+  }, [filters.companies.selectedCompaniesLocally]);
+
+  const handleSetItemsSelected = (items) => {
+    filters.companies.setSelectedCompanies(items);
+    setAppliedFilters(true);
+  };
+
   return (
     <FilterSubDropdown
       searchPlaceholder={t("filters.company.placeholder")}
       handleOpen={() => setIsOpened((prevIsOpened) => !prevIsOpened)}
       icon={<CompanyIcon />}
       title={t("filters.company.title")}
-      setItemsSelected={filters.companies.setSelectedCompanies}
+      setItemsSelected={handleSetItemsSelected}
       companies
       offers={props.offers}
     />

src/components/Cards/FilterCard/Choser/LocationChoser/LocationChoser.js

 
 const LocationChoser = forwardRef((props, ref) => {
   const { t } = useTranslation();
+  const [appliedFilters, setAppliedFilters] = useState(false);
   const [isOpened, setIsOpened] = useState(false);
   const filters = props.filters;
 
-  console.log(props);
-
   const allLocations = useMemo(
     () => filters.locations.allLocations || [],
     [filters.locations]
       setIsOpened(true);
     }
   }, [filters.locations.selectedLocationsLocally]);
+
+  useEffect(() => {
+    if (appliedFilters) {
+      props?.offers?.apply();
+      setAppliedFilters(false);
+    }
+  }, [appliedFilters]);
+
+  const handleSetItemsSelected = (items) => {
+    filters.locations.setSelectedLocations(items);
+    setAppliedFilters(true);
+  };
   return (
     <FilterCheckboxDropdown
       searchPlaceholder={t("filters.location.placeholder")}
       handleOpen={() => setIsOpened((prevIsOpened) => !prevIsOpened)}
       icon={<LocationIcon />}
       title={t("filters.location.title")}
-      setItemsSelected={filters.locations.setSelectedLocations}
+      setItemsSelected={handleSetItemsSelected}
       offers={props.offers}
     />
   );

src/components/Cards/FilterCard/Choser/SubcategoryChoser/SubcategoryChoser.js

     },
   }));
 
+  const handleSelectSubcategory = (subcategory) => {
+    filters.subcategory.setSelectedSubcategory(subcategory, !props.myOffers);
+    // if (props.myOffers) props.offers?.applyFilters();
+  };
+
   useEffect(() => {
-    if (props?.queryStringHook?.isInitiallyLoaded || props.isMyOffers) {
+    if (props?.queryStringHook?.isInitiallyLoaded || props.myOffers) {
       if (
-        !filters.category.selectedCategoryLocally ||
+        (filters.category.selectedCategoryLocally &&
+          !("_id" in filters.category.selectedCategoryLocally)) ||
         filters.category.selectedCategoryLocally?._id === 0
       ) {
         setIsOpened(false);
       }
     } else {
       if (
-        !filters.subcategory.selectedSubcategoryLocally ||
+        (filters.subcategory.selectedSubcategoryLocally &&
+          !("_id" in filters.subcategory.selectedSubcategoryLocally)) ||
         filters.subcategory.selectedSubcategoryLocally?._id === 0
       ) {
         setIsOpened(false);
         if (
-          !filters.category.selectedCategoryLocally ||
+          (filters.category.selectedCategoryLocally &&
+            !("_id" in filters.category.selectedCategoryLocally)) ||
           filters.category.selectedCategoryLocally?._id === 0
         ) {
           setIsDisabled(true);
           : t("filters.subcategories.title")
       }
       searchPlaceholder={t("filters.subcategories.placeholder")}
-      setSelected={filters.subcategory.setSelectedSubcategory}
+      setSelected={handleSelectSubcategory}
       selected={filters.subcategory.selectedSubcategoryLocally}
       open={isOpened}
       disabled={isDisabled}
   filters: PropTypes.any,
   categoryOpened: PropTypes.bool,
   queryStringHook: PropTypes.any,
-  isMyOffers: PropTypes.bool,
+  myOffers: PropTypes.bool,
   offers: PropTypes.any,
 };
 

src/components/Cards/FilterCard/FilterCard.js

           queryStringHook={offers.queryStringHook}
           ref={subcategoryRef}
           categoryOpened={categoryRef.current?.isOpened}
-          isMyOffers={props.myOffers}
+          myOffers={props.myOffers}
           offers={offers}
         />
 

src/components/Cards/FilterCard/FilterDropdown/Checkbox/CheckboxDropdownList/CheckboxDropdownList.js

   const data = props.data;
   const [isOpened, setIsOpened] = useState(false);
   const handleDelete = (item) => {
-    props.setItemsSelected([...props.filters.filter((p) => p !== item)]);
-    props.offers.applyFilters();
+    console.log(item);
+    console.log(props.filters)
+    props.setItemsSelected([...props.filters.filter((p) => p?._id !== item?._id)]);
   };
   const handleOpen = () => {
     setIsOpened((prevState) => !prevState);

src/components/Cards/FilterCard/FilterDropdown/Checkbox/FilterCheckboxDropdown.js

   const [isOpened, setIsOpened] = useState(false);
   const [toSearch, setToSearch] = useState("");
   const { data } = props;
-  console.log(props);
 
   useEffect(() => {
     setDataToShow([...data]);

src/components/Cards/FilterCard/FilterDropdown/Checkbox/FilterSubDropdown/FilterSubDropdown.js

       filters={props.filters}
       icon={props.icon}
       data={data}
+      offers={props?.offers}
       searchPlaceholder={props.searchPlaceholder}
       open={props?.open !== undefined ? props.open : isOpened}
       handleOpen={handleOpen}

src/components/Cards/FilterCard/FilterDropdown/Radio/FilterRadioDropdown.js

                 label={props.firstOption.label}
                 // number={item.numberOfProducts}
                 fullWidth
-                checked={!props.selected || props.selected._id === 0}
+                checked={
+                  (props?.selected && !("_id" in props?.selected)) ||
+                  props?.selected?._id === 0
+                }
                 onChange={props.setSelected}
               />
             </DropdownItem>

src/components/Cards/ItemDetailsCard/ImagesCarousel/ImagesCarousel.js

           <CloseButtonIcon />
         </CloseButton>
         <Scroller isCarousel>
-          {props?.offer?.offer?.images.map((image) => {
+          {props?.images.map((image) => {
             if (!image) return;
             return (
               <OfferImage
           })}
         </Scroller>
         <Offer>
-          {t("carousel.offer")} <OfferSpan>{props.offer.offer.name}</OfferSpan>
+          {t("carousel.offer")} <OfferSpan>{props.offer.name}</OfferSpan>
         </Offer>
       </ImagesCarouselContainer>
     </>
   offer: PropTypes.any,
   onModalClose: PropTypes.any,
   createOffer: PropTypes.bool,
+  images: PropTypes.array
 };
 
 export default ImagesCarousel;

src/components/Cards/ItemDetailsCard/ItemDetailsCard.js

   const offer = useMemo(() => {
     if (props.offer) {
       if (
-        props.offer.offer._id === routeMatch.params?.offerId ||
-        props.createOffer
+        props.offer._id === routeMatch.params?.offerId &&
+        !props?.createOffer
       ) {
         return props.offer;
       }
+      if (props.createOffer) return props.offer.offer;
     }
     return itemDetailsData;
   }, [props.offer, props.createOffer, routeMatch.params]);
   }, []);
 
   useEffect(() => {
-    if (offer?.offer?._id) {
-      increaseOfferCounter(offer?.offer?._id);
+    if (offer?._id) {
+      increaseOfferCounter(offer?._id);
     }
   }, [offer]);
 
-  const date = formatDateLocale(new Date(offer?.offer?._created));
+  const date = formatDateLocale(new Date(offer?._created));
 
   const startExchange = () => {
-    startChat(chats, offer?.offer, userId);
+    startChat(chats, offer, userId);
   };
 
   const showDeleteOfferModalHandler = () => {
     dispatch(
       toggleDeleteOfferModal({
-        offer: offer.offer,
+        offer: offer,
         isAdmin: props.isAdmin,
       })
     );
     dispatch(
       toggleEditOfferModal({
         editOffer: true,
-        offer: offer?.offer,
+        offer: offer,
         isAdmin: props.isAdmin,
-        customUserId: offer?.offer?.userId,
+        customUserId: offer?.user?._id,
       })
     );
   };
   const showPinOfferModalHandler = () => {
     dispatch(
       toggleDeleteOfferModal({
-        offer: offer?.offer,
+        offer: offer,
         pin: true,
-        pinnedOffer: offer?.offer?.pinned,
+        pinnedOffer: offer?.pinned,
         deleteOffer: false,
       })
     );
           <Info>
             <Information
               icon={<CategoryIcon />}
-              value={offer?.offer?.category?.name}
+              value={offer?.category?.name}
             />
             <Information
               icon={<SubcategoryIcon />}
-              value={offer?.offer?.subcategory}
-            />
-            <Information
-              icon={<QuantityIcon />}
-              value={offer?.offer?.condition}
+              value={offer?.subcategory}
             />
+            <Information icon={<QuantityIcon />} value={offer?.condition} />
             {!props.hideViews && (
-              <Information
-                icon={<EyeIcon />}
-                value={offer?.offer?.views?.count}
-              />
+              <Information icon={<EyeIcon />} value={offer?.views?.count} />
             )}
           </Info>
           <PostDate previewCard={props.previewCard}>{date}</PostDate>
             <DateButtonsContainer>
               {props.isMyOffer && (
                 <ButtonsContainer>
-                  <PinIconContainer onClick={showPinOfferModalHandler}>
-                    {offer?.offer?.pinned ? <UnpinIcon /> : <PinIcon />}
-                  </PinIconContainer>
+                  {props?.isAdmin && (
+                    <PinIconContainer onClick={showPinOfferModalHandler}>
+                      {offer?.pinned ? <UnpinIcon /> : <PinIcon />}
+                    </PinIconContainer>
+                  )}
                   <EditIconContainer onClick={showEditOfferModalHandler}>
                     <EditIcon />
                   </EditIconContainer>

src/components/Cards/ItemDetailsCard/OfferDetails/OfferDetails.js

   const [imagesCarouselModal, setImagesCarouselModal] = useState(false);
 
   useEffect(() => {
-    if (props?.offer?.offer?.images) {
-      props.offer.offer.images.map((file) => {
+    if (props?.offer?.images) {
+      props.offer.images.map((file) => {
         if (file) {
           if (typeof file !== "string") {
             var reader = new FileReader();
               console.log("Error: ", error);
             };
           } else {
-            setImages((prevImages) => [
-              ...prevImages,
-              getImageUrl(file, variants.offerCard, isMobile),
-            ]);
+            setImages((prevImages) => [...prevImages, file]);
           }
         }
       });
     }
-  }, [props?.offer?.offer?.images]);
-  const date = formatDateLocale(new Date(offer?.offer?._created));
+    return () => {
+      setImages([]);
+    };
+  }, [props?.offer?.images]);
+  const date = formatDateLocale(new Date(offer?._created));
   const onModalClose = () => {
     setImagesCarouselModal(false);
   };
       >
         {!isMobile && props.singleOffer && (
           <ScrollerVertical>
-            {props?.offer?.offer?.images.map((item, index) => (
+            {images.map((item, index) => (
               <OfferImage
                 src={
                   props.createOffer
           singleOffer={props.singleOffer}
           previewCard={props.previewCard}
         >
-          <OfferTitle singleOffer={props.singleOffer}>
-            {offer?.offer?.name}
-          </OfferTitle>
+          <OfferTitle singleOffer={props.singleOffer}>{offer?.name}</OfferTitle>
           {isMobile && (
             <ScrollerHorizontal>
-              {props?.offer?.offer?.images.map((item, index) => {
+              {images.map((item, index) => {
                 if (!item) return;
                 return (
                   <OfferImage
               {t("itemDetailsCard.description")}
             </OfferDescriptionTitle>
             <OfferDescriptionText showBarterButton={props.showExchangeButton}>
-              {offer?.offer?.description}
+              {offer?.description}
             </OfferDescriptionText>
             <DesciprtionPostDate previewCard={props.previewCard}>
               {date}
         </OfferInfoContainer>
       </Details>
       {imagesCarouselModal && (
-        <ImagesCarousel offer={props.offer} onModalClose={onModalClose} />
+        <ImagesCarousel
+          offer={props.offer}
+          images={images}
+          onModalClose={onModalClose}
+        />
       )}
     </>
   );

src/components/Cards/MiniChatCard/MiniChatCard.js

 import { replaceInRoute } from "../../../util/helpers/routeHelpers";
 import { DIRECT_CHAT_PAGE } from "../../../constants/pages";
 import BlockedProfile from "../ProfileCard/BlockedProfile/BlockedProfile";
+import { useMemo } from "react";
+import { useSelector } from "react-redux";
+import { selectUserId } from "../../../store/selectors/loginSelectors";
 
 const MiniChatCard = (props) => {
   const { t } = useTranslation();
   const { isMobile } = useIsMobile();
+  const userId = useSelector(selectUserId);
   const changeChat = () => {
     history.push(
       replaceInRoute(DIRECT_CHAT_PAGE, {
-        chatId: props?.chat?.chat?._id,
+        chatId: props?.chat?._id,
       })
     );
   };
+  const interlocutorData = useMemo(() => {
+    if (props?.chat?.participants) {
+      let interlocutor = props?.chat?.participants[0]._id === userId ? 1 : 0;
+      return props?.chat?.participants[interlocutor];
+    }
+    return {};
+  }, [props?.chat]);
   return (
     <MiniChatCardContainer selected={props.selected} onClick={changeChat}>
       <ProfileImage
-        src={getImageUrl(
-          props?.chat?.interlocutorData?.image,
-          variants.chatCard,
-          isMobile
-        )}
+        src={getImageUrl(interlocutorData?.image, variants.chatCard, isMobile)}
       />
-      <ProfileDetails isBlocked={props.chat.interlocutorData?._blocked}>
+      <ProfileDetails isBlocked={interlocutorData?._blocked}>
         <ProfileNameContainer>
           <ProfileName selected={props.selected}>
-            {props?.chat?.interlocutorData?.name}
+            {interlocutorData?.company?.name}
           </ProfileName>
-          {(props.chat.interlocutorData?._blocked ||
-            props.chat.interlocutorData?._deleted) && (
+          {(interlocutorData?._blocked || interlocutorData?._deleted) && (
             <BlockedProfile
               redText
               chatCard
               shortText
               aboveTitle
               hideIcon
-              deleted={props.chat.interlocutorData?._deleted}
+              deleted={interlocutorData?._deleted}
             />
           )}
         </ProfileNameContainer>
           {t("messages.cardProduct")}
         </ProfileProduct>
         <ProfileProductName selected={props.selected}>
-          {props?.chat?.offerData?.name}
+          {props?.chat?.offer?.name}
         </ProfileProductName>
       </ProfileDetails>
     </MiniChatCardContainer>

src/components/Cards/OfferCard/DeleteOffer/OfferDescription/OfferDescription.js

 import {
   CategoryIcon,
   CategoryIconContainer,
+  OfferCategoryContainer,
   OfferDescriptionCategory,
   OfferDescriptionContainer,
   OfferDescriptionTitle,
   return (
     <OfferDescriptionContainer>
       <OfferDescriptionTitle>{props.offerName}</OfferDescriptionTitle>
-      <OfferDescriptionCategory>
+      <OfferCategoryContainer>
         <CategoryIconContainer
           color={selectedTheme.colors.iconStrokeDisabledColor}
           component="span"
         >
           <CategoryIcon />
         </CategoryIconContainer>
-        {props.categoryName}
-      </OfferDescriptionCategory>
+        <OfferDescriptionCategory>
+          {props.categoryName}
+        </OfferDescriptionCategory>
+      </OfferCategoryContainer>
     </OfferDescriptionContainer>
   );
 };

src/components/Cards/OfferCard/DeleteOffer/OfferDescription/OfferDescription.styled.js

   font-family: ${selectedTheme.fonts.textFont};
   color: ${selectedTheme.colors.primaryDarkText};
 `;
+export const OfferCategoryContainer = styled(Box)`
+  display: flex;
+  flex-direction: row;
+  white-space: nowrap;
+`
 
 export const CategoryIconContainer = styled(Icon)`
   margin-right: 4px;
   position: relative;
   top: 2px;
+  display: inline;
   & svg {
     width: 14px;
     position: relative;
-    top: -6px;
+    top: -4px;
   }
 `;
 export const CategoryIcon = styled(Category)``;

src/components/Cards/OfferCard/OfferCard.js

           })
         );
       } else {
-        history.push(
-          replaceInRoute(ITEM_DETAILS_PAGE, {
+        history.push({
+          pathname: replaceInRoute(ITEM_DETAILS_PAGE, {
             offerId: itemId,
-          })
-        );
+          }),
+          state: {
+            view: true,
+          },
+        });
       }
     }
   };

src/components/Cards/ProfileCard/ProfileControl/ProfileControl.js

     );
   };
   const handleEditProfile = () => {
-    if (!props.profile?._blocked) {
+    console.log("edit")
+    console.log(props)
+    if (!props.profile?._blocked || props?.isAdmin) {
+      console.log("edit2")
       dispatch(
         toggleEditProfileModal({
           userId: props.profile._id,
       );
     }
   };
+  console.log(props)
   return (
     <ButtonsContainer>
-      {props.profile?._blocked && !props.isMobile && <BlockedProfile />}
+      {props.profile?._blocked && !props.isMobile && !props?.isAdmin && <BlockedProfile />}
       {props.isAdmin && (
         <>
           {props.profile?._blocked ? (

src/components/Cards/RequestExchangeCard/RequestExchangeCard.js

   const requester = useSelector(selectRequester);
   const exchange = useSelector(selectExchange);
   const amIBuyer = useMemo(
-    () => exchange?.buyer?.userId === userId,
+    () => exchange?.buyer?.user?._id === userId,
     [exchange, userId]
   );
   const haveIAccepted = useMemo(
     () => (amIBuyer ? exchange?.buyer?.accepted : exchange?.seller?.accepted),
     [amIBuyer, exchange]
   );
-  const interlucatorUserId = useMemo(
-    () => (amIBuyer ? exchange?.seller?.userId : exchange?.buyer?.userId),
+  const interlocutorUserId = useMemo(
+    () => (amIBuyer ? exchange?.seller?.user?._id : exchange?.buyer?.user?._id),
     [exchange, amIBuyer]
   );
   const message = useMemo(() => {
           </MessageText>
         );
       }
-    } else if (requester === requesterStatus.INTERLUCATOR) {
+    } else if (requester === requesterStatus.interlocutor) {
       return (
         <RequestExchangeMessage
           haveIAccepted={haveIAccepted}
           chatId={props.chatId}
           userId={userId}
-          interlucatorUserId={interlucatorUserId}
+          interlocutorUserId={interlocutorUserId}
         />
       );
     }
     return "";
-  }, [requester, t, haveIAccepted, interlucatorUserId, userId, exchange]);
+  }, [requester, t, haveIAccepted, interlocutorUserId, userId, exchange]);
   return (
     <RequestExchangeCardContainer ismymessage={props.isMyMessage}>
       <InfoIcon />

src/components/Cards/RequestExchangeCard/RequestExchangeMessage/RequestExchangeMessage.js

 import { useTranslation } from "react-i18next";
 import { acceptExchangeSocket } from "../../../../socket/socket";
 import { useDispatch, useSelector } from "react-redux";
-import { selectExchange, selectRequester } from "../../../../store/selectors/exchangeSelector";
-import { acceptExchange, setRequester } from "../../../../store/actions/exchange/exchangeActions";
+import {
+  selectExchange,
+  selectRequester,
+} from "../../../../store/selectors/exchangeSelector";
+import {
+  acceptExchange,
+  setRequester,
+} from "../../../../store/actions/exchange/exchangeActions";
 import { addNewMessage } from "../../../../store/actions/chat/chatActions";
 import { convertLocalDateToUTCDate } from "../../../../util/helpers/dateHelpers";
 import requesterStatus from "../../../../constants/requesterStatus";
   const exchange = useSelector(selectExchange);
   const requester = useSelector(selectRequester);
 
-  const handleAcceptExchange = () => {
+  const handleAcceptExchangeSuccess = () => {
+    console.log("accept salje i prima 3 POZVANA RESPONSE FUNKCIJA");
     acceptExchangeSocket(
       props.chatId,
       props.userId,
-      props.interlucatorUserId,
+      props.interlocutorUserId,
       () => {
-        dispatch(
-          acceptExchange({
-            exchangeId: exchange._id,
-          })
-        );
+        console.log("accept salje i prima 4 SOCKET FUNKCIJA");
         dispatch(
           addNewMessage({
             _id: props.chatId,
             message: {
-              userId: props.userId,
+              user: {
+                _id: props.userId,
+              },
               text: "",
               isAcceptRequest: true,
               _created: convertLocalDateToUTCDate(new Date()),
       }
     );
   };
+  const handleAcceptExchange = () => {
+    console.log("accept salje i prima 1 POZVANA FUNKCIJA");
+    dispatch(
+      acceptExchange({
+        exchangeId: exchange._id,
+        handleApiResponseSuccess: handleAcceptExchangeSuccess,
+      })
+    );
+  };
   return (
     <RequestExchangeMessageContainer>
       <RequestExchangeMessageText>
           onClick={handleAcceptExchange}
           disabled={props.haveIAccepted}
         >
-          {props.haveIAccepted ? t("messages.acceptedRequest") : t("messages.acceptRequest")}
+          {props.haveIAccepted
+            ? t("messages.acceptedRequest")
+            : t("messages.acceptRequest")}
         </RequestExchangeMessageButton>
       </RequestExchangeMessageButtonsContainer>
     </RequestExchangeMessageContainer>
   children: PropTypes.node,
   chatId: PropTypes.string,
   userId: PropTypes.string,
-  interlucatorUserId: PropTypes.string,
+  interlocutorUserId: PropTypes.string,
   haveIAccepted: PropTypes.any,
 };
 

src/components/ChatColumn/ChatColumn.js

   fetchChats,
 } from "../../store/actions/chat/chatActions";
 import useSorting from "../../hooks/useOffers/useSorting";
-import { addMesageListener, removeMessageListener } from "../../socket/socket";
+import { addMessageListener, removeMessageListener } from "../../socket/socket";
 import { selectIsLoadingByActionType } from "../../store/selectors/loadingSelectors";
 import { CHAT_SCOPE } from "../../store/actions/chat/chatActionConstants";
 import SkeletonChatColumn from "./SkeletonChatColumn/SkeletonChatColumn";
       history.goBack();
       return;
     }
-    addMesageListener(({ succeed, data }) => {
+    addMessageListener(({ succeed, data }) => {
+
       if (succeed) {
         dispatch(
           addNewMessage({

src/components/CreateReview/CreateReview.js

 import FirstStepCreateReview from "./FirstStep/FirstStepCreateReview";
 import SecondStepCreateReview from "./SecondStep/SecondStepCreateReview";
 import ThirdStepCreateReview from "./ThirdStep/ThirdStepCreateReview";
-import { useDispatch, useSelector } from "react-redux";
+import { useDispatch } from "react-redux";
 import { giveReview } from "../../store/actions/review/reviewActions";
-import { selectUserId } from "../../store/selectors/loginSelectors";
 import { reviewEnum } from "../../enums/reviewEnum";
 import { fetchExchange } from "../../store/actions/exchange/exchangeActions";
 import { closeModal } from "../../store/actions/modal/modalActions";
   const [informations, setInformations] = useState({});
   const [currentStep, setCurrentStep] = useState(1);
   const dispatch = useDispatch();
-  const userId = useSelector(selectUserId);
   const closeModalHandler = () => {
     dispatch(closeModal());
   };
-  setTimeout(() => {
-    dispatch(closeModal());
-  }, 3000);
   const handleApiResponseSuccess = () => {
     dispatch(fetchExchange(props.exchange._id));
   };
     dispatch(
       giveReview({
         review: {
-          exchangeId: props.exchange._id,
-          userId: userId,
+          exchange: {
+            _id: props.exchange._id,
+          },
           succeeded,
           communication,
           message: informations.comment,

src/components/CreateReview/ThirdStep/ThirdStepCreateReview.js

   ThirdStepCreateReviewContainer,
 } from "./ThirdStepCreateReview.styled";
 import { useTranslation } from "react-i18next";
+import { useDispatch } from "react-redux";
+import { closeModal } from "../../../store/actions/modal/modalActions";
 
 const ThirdStepCreateReview = () => {
   const { t } = useTranslation();
+  const dispatch = useDispatch();
+  setTimeout(() => {
+    dispatch(closeModal());
+  }, 3000);
   return (
     <ThirdStepCreateReviewContainer>
       <LogoImage />

src/components/DirectChat/DirectChat.js

 import { selectUserId } from "../../store/selectors/loginSelectors";
 import {
   acceptExchangeSocket,
-  addMesageListener,
+  addMessageListener,
   removeMessageListener,
 } from "../../socket/socket";
 import { makeErrorToastMessage } from "../../store/utils/makeToastMessage";
 } from "../../store/selectors/exchangeSelector";
 import {
   acceptExchange,
+  fetchExchange,
   setRequester,
 } from "../../store/actions/exchange/exchangeActions";
 import { convertLocalDateToUTCDate } from "../../util/helpers/dateHelpers";
 
   const offerObject = useMemo(() => {
     if (location?.state?.offerId) {
-      return offer?.offer;
+      return offer;
     }
-    return chat?.offer?.offer;
+    return chat?.offer;
   }, [chat, location.state, offer]);
 
   const chatObject = useMemo(() => {
   }, [chat, location.state]);
 
   const amIBuyer = useMemo(
-    () => exchange.buyer?.userId === userId,
+    () => exchange.buyer?.user?._id === userId,
     [exchange, userId]
   );
 
       let haveIAccepted = amIBuyer
         ? exchange.buyer?.accepted
         : exchange.seller?.accepted;
-      let haveInterlucatorAccepted = amIBuyer
+      let haveinterlocutorAccepted = amIBuyer
         ? exchange.seller?.accepted
         : exchange.buyer?.accepted;
       let haveIReviewed = amIBuyer
         ? exchange.buyer.givenReview
         : exchange.seller.givenReview;
       if (haveIAccepted) {
-        if (haveInterlucatorAccepted) {
+        if (haveinterlocutorAccepted) {
           if (haveIReviewed) {
             return exchangeStatus.REVIEWED;
           } else {
           return exchangeStatus.I_OFFERED;
         }
       } else {
-        if (haveInterlucatorAccepted) {
+        if (haveinterlocutorAccepted) {
           return exchangeStatus.I_AM_OFFERED;
         } else {
           return exchangeStatus.INITIAL;
 
   const interlocutorObject = useMemo(() => {
     if (location?.state?.offerId) {
-      return {
-        image: offer?.companyData?.image,
-        name: offer?.companyData?.company?.name,
-        location: offer?.companyData?.company?.contacts?.location,
-        userId: offer?.offer?.userId,
-        telephone: offer?.companyData?.company?.contacts?.telephone,
-      };
+      return offer?.user;
     }
-    return {
-      ...chat?.interlocutor,
-      userId:
-        chat?.chat?.participants[0] === userId
-          ? chat?.chat?.participants[1]
-          : chat?.chat?.participants[0],
-    };
+    if (chat?.participants) {
+      let interlocutor = userId === chat?.participants[0]._id ? 1 : 0;
+      return chat?.participants[interlocutor];
+    }
+    return {};
   }, [chat, location.state, offer]);
 
   // Fetch chat after it is created
 
   // Listener to socket.IO chat
   useEffect(() => {
-    addMesageListener(({ succeed, data }) => {
+    addMessageListener(({ succeed, data }) => {
       if (succeed) {
         if (
           [...allChats].find((item) => {
-            return item.chat._id === data.chatId;
+            return item._id === data.chatId;
           })
         ) {
           dispatch(
               message: data.message,
             })
           );
-          if (
-            data.message?.isAcceptRequest &&
-            requester === requesterStatus.NOONE
-          ) {
-            dispatch(setRequester(requesterStatus.INTERLUCATOR));
+          if (data.message?.isAcceptRequest) {
+            dispatch(fetchExchange(exchange?._id));
+            if (requester === requesterStatus.NOONE) {
+              dispatch(setRequester(requesterStatus.interlocutor));
+            }
           }
         } else {
           dispatch(fetchChats());
       }
     });
     return () => removeMessageListener();
-  }, [allChats, routeMatch]);
-
+  }, [allChats, routeMatch, requester]);
 
   const refreshChat = () => {
     if (routeMatch.params?.chatId === "newMessage") {
       dispatch(fetchOneChat(routeMatch.params?.chatId));
     }
   };
-  const handleAcceptExchange = () => {
+  const handleAcceptExchangeSuccess = () => {
+    let interlocutor = userId === chat?.participants[0]._id ? 1 : 0;
     acceptExchangeSocket(
-      chat?.chat?._id,
+      chat?._id,
       userId,
-      chat?.interlocutor?._id,
+      chat?.participants[interlocutor]._id,
       () => {
-        dispatch(
-          acceptExchange({
-            exchangeId: exchange._id,
-          })
-        );
         dispatch(
           addNewMessage({
-            _id: chat?.chat?._id,
+            _id: chat?._id,
             message: {
-              userId,
+              user: {
+                _id: userId,
+              },
               isAcceptRequest: true,
               text: "",
               _created: convertLocalDateToUTCDate(new Date()),
       }
     );
   };
+  const handleAcceptExchange = () => {
+    console.log("accept salje i prima 1 POZVANA FUNKCIJA")
+    dispatch(
+      acceptExchange({
+        exchangeId: exchange._id,
+        handleApiResponseSuccess: handleAcceptExchangeSuccess,
+      })
+    );
+  };
   return (
     <DirectChatContainer>
       {isLoadingDirectChat || isLoadingDirectChat === undefined ? (
       <DirectChatContent
         chat={chatObject}
         exchangeState={exchangeState}
-        interlucator={interlocutorObject}
+        interlocutor={interlocutorObject}
         refreshChat={refreshChat}
       />
     </DirectChatContainer>

src/components/DirectChat/DirectChatContent/DirectChatContent.js

   const myProfileImage = useSelector(selectMineProfilePicture);
   const messagesRef = useRef(null);
   const requester = useSelector(selectRequester);
-  const interlucatorProfileImage = props?.interlucator?.image;
+  const interlocutorProfileImage = props?.interlocutor?.image;
   const isLoadingChatContent = useSelector(
     selectIsLoadingByActionType(CHAT_SCOPE)
   );
-  const messages = props?.chat?.chat?.messages;
+  const messages = props?.chat?.messages;
   useEffect(() => {
     messagesRef.current?.scrollTo({
       top: messagesRef.current.scrollHeight,
       behaviour: "smooth",
     });
     window.scrollTo({ top: document.body.scrollHeight, behavior: "smooth" });
-  }, [props?.chat?.chat?.messages, messagesRef, isLoadingChatContent]);
+  }, [props?.chat?.messages, messagesRef, isLoadingChatContent]);
 
   const handleRefresh = () => {
     props.refreshChat();
       ) : (
         <DirectChatContentContainer>
           <DirectChatContentHeader
-            interlucator={props?.interlucator}
+            interlocutor={props?.interlocutor}
             exchangeState={props.exchangeState}
           />
           <MessagesList ref={messagesRef} exchangeState={props?.exchangeState}>
             {messages?.map((item) => {
-              const isMyMessage = userId === item.userId;
+              const isMyMessage = userId === item.user?._id;
               const image = isMyMessage
                 ? myProfileImage
-                : interlucatorProfileImage;
-              if (requester === requesterStatus.INTERLUCATOR && isMyMessage && item?.isAcceptRequest)
+                : interlocutorProfileImage;
+              if (
+                requester === requesterStatus.interlocutor &&
+                isMyMessage &&
+                item?.isAcceptRequest
+              )
                 return;
               return (
                 <MessageContainer key={item?._id || item?._created}>
                     <RequestExchangeCard
                       isMyMessage={isMyMessage}
                       message={item}
-                      chatId={props?.chat?.chat?._id}
+                      chatId={props?.chat?._id}
                     />
                   ) : (
                     <MessageCard
           <DirectChatNewMessage
             chat={props?.chat}
             refreshChat={handleRefresh}
-            interlucator={props.interlucator}
+            interlocutor={props.interlocutor}
           />
         </DirectChatContentContainer>
       )}
 DirectChatContent.propTypes = {
   children: PropTypes.node,
   chat: PropTypes.any,
-  interlucator: PropTypes.any,
+  interlocutor: PropTypes.any,
   refreshChat: PropTypes.func,
   exchangeState: PropTypes.any,
 };

src/components/DirectChat/DirectChatContent/DirectChatContentHeader/DirectChatContentHeader.js

   const [phonePopoverAnchorEl, setPhonePopoverAnchorEl] = useState(null);
   const { isMobile } = useIsMobile();
   const mineProfileBlocked = useSelector(selectAmIBlocked);
-
   const togglePhonePopover = (event) => {
-    if (props.interlucator?.telephone) {
+    if (props.interlocutor?.company?.contacts?.telephone) {
       setShowPhonePopover((prevState) => !prevState);
       setPhonePopoverAnchorEl((prevState) => {
         if (prevState) return null;
     }
   };
   const routeToUser = () => {
-    if (!props?.interlucator?._blocked)
+    if (!props?.interlocutor?._blocked)
       history.push(
         replaceInRoute(PROFILE_PAGE, {
-          profileId: props?.interlucator?.userId,
+          profileId: props?.interlocutor?._id,
         })
       );
   };
           <ProfileImage
             onClick={routeToUser}
             src={getImageUrl(
-              props?.interlucator?.image,
+              props?.interlocutor?.image,
               variants.chatHeader,
               isMobile
             )}
           />
           <ProfileDetails>
             <ProfileName onClick={routeToUser}>
-              {props?.interlucator?.name}
+              {props?.interlocutor?.company?.name}
             </ProfileName>
             <ProfileLocation>
               <ProfileLocationIcon />
               <ProfileLocationText>
-                {props?.interlucator?.location}
+                {props?.interlocutor?.company?.contacts?.location}
               </ProfileLocationText>
             </ProfileLocation>
           </ProfileDetails>
           <PhoneIconContainer
             disabled={
               mineProfileBlocked ||
-              props?.interlucator?._blocked ||
-              !props.interlucator?.telephone
+              props?.interlocutor?._blocked ||
+              !props.interlocutor?.company?.contacts?.telephone
             }
             onClick={togglePhonePopover}
           >
           open={showPhonePopover}
           anchorRight
           onClose={togglePhonePopover}
-          content={<PhonePopover phoneNumber={props.interlucator?.telephone} />}
+          content={
+            <PhonePopover
+              phoneNumber={props.interlocutor?.company?.contacts?.telephone}
+            />
+          }
         />
       </DirectChatContentHeaderContainer>
       {(props.exchangeState === exchangeStatus.I_OFFERED ||
 
 DirectChatContentHeader.propTypes = {
   children: PropTypes.node,
-  interlucator: PropTypes.any,
+  interlocutor: PropTypes.any,
   exchangeState: PropTypes.bool,
 };
 

src/components/DirectChat/DirectChatHeader/DirectChatHeader.js

 import { useSelector } from "react-redux";
 import { selectExchange } from "../../../store/selectors/exchangeSelector";
 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 { selectUserId } from "../../../store/selectors/loginSelectors";
 import { toggleCreateReviewModal } from "../../../store/actions/modal/modalActions";
+import { setOneChat } from "../../../store/actions/chat/chatActions";
 
 const DirectChatHeader = (props) => {
   const exchange = useSelector(selectExchange);
   const chat = useSelector(selectSelectedChat);
 
   useEffect(() => {
-    if (chat?.chat?.exchangeId) refetchExchange();
-  }, [chat]);
+    return () => {
+      dispatch(setExchange({}));
+      dispatch(setOneChat({}));
+    };
+  }, []);
+
+  useEffect(() => {
+    if (chat?.exchange?._id) refetchExchange();
+  }, [chat?.exchange]);
 
   const isDisabledReviews = useMemo(() => {
     if (!exchange.valid) return true;
-    if (exchange.seller?.userId === userId && exchange.seller?.givenReview)
+    if (exchange.seller?.user._id === userId && exchange.seller?.givenReview)
       return true;
-    if (exchange.buyer?.userId === userId && exchange.buyer?.givenReview)
+    if (exchange.buyer?.user._id === userId && exchange.buyer?.givenReview)
       return true;
     return false;
   }, [exchange, userId]);
   };
 
   const refetchExchange = () => {
-    dispatch(fetchExchange(chat.chat.exchangeId));
+    dispatch(fetchExchange(chat.exchange?._id));
   };
 
   const acceptExchange = () => {

src/components/DirectChat/DirectChatNewMessage/DirectChatNewMessage.js

   const userId = useSelector(selectUserId);
   const handleSend = useCallback(
     (newChatId = undefined) => {
-      if (props.chat?.chat?._id) {
-        const chatId = props.chat?.chat?._id || newChatId;
-        sendMessage(chatId, userId, typedValue, props.interlucator.userId);
+      if (typedValue?.length === 0) return;
+      if (props?.chat?._id) {
+        const chatId = props.chat?._id || newChatId;
+        sendMessage(chatId, userId, typedValue, props.interlocutor._id);
         dispatch(
           addNewMessage({
             _id: chatId,
             message: {
-              userId,
+              user: {
+                _id: userId,
+              },
               text: typedValue,
               _created: convertLocalDateToUTCDate(new Date()),
             },
           })
         );
-        if (props.chat?.chat?._id) {
-          if (!exchange.valid && exchange.seller.userId === userId) {
+        if (props.chat?._id) {
+          if (!exchange.valid && exchange.seller.user._id === userId) {
             dispatch(validateExchange(exchange._id));
           }
         }
       }
       setTypedValue("");
     },
-    [typedValue, props.chat?.chat?._id, userId, props.interlucator.userId]
+    [typedValue, props.chat?._id, userId, props.interlocutor]
   );
   const handleMessageSendSuccess = (newChatId) => {
     history.replace(`${newChatId}`);
       startNewChat({
         offerId,
         message: typedValue,
-        interlucatorUserId: props.interlucator.userId,
+        interlocutorUserId: props.interlocutor._id,
         handleMessageSendSuccess,
       })
     );
   children: PropTypes.node,
   chatId: PropTypes.any,
   refreshChat: PropTypes.func,
-  interlucator: PropTypes.any,
+  interlocutor: PropTypes.any,
   chat: PropTypes.any,
 };
 

src/components/DirectChat/MiniChatColumn/MiniChatColumn.js

   const newChat = useMemo(() => {
     if (location.state?.offerId) {
       return {
-        interlocutorData: {
-          image: offer?.companyData?.image,
-          name: offer?.companyData?.company?.name,
-        },
-        offerData: {
-          name: offer?.offer?.name,
+        participants: [
+          {
+            image: offer?.user?.image,
+            company: {
+              name: offer?.user?.company?.name,
+            },
+          },
+        ],
+        offer: {
+          name: offer?.name,
         },
       };
     }
                 <MiniChatCard
                   key={Date.now() * Math.random()}
                   chat={item}
-                  selected={item?.chat?._id === selectedChat?.chat?._id}
+                  selected={item?._id === selectedChat?._id}
                 />
               );
             })}

src/components/Header/Header.js

           logo: true,
         },
       });
-      searchRef.current.value = "";
+      if (searchRef?.current) searchRef.current.value = "";
     }
   };
 

src/components/ItemDetails/ItemDetails.js

   );
   let isMyProfile = useMemo(() => {
     if (
-      offer?.offer?.userId?.toString() === userId?.toString() ||
+      offer?.user?._id?.toString() === userId?.toString() ||
       props.isAdmin
     )
       return true;

src/components/ItemDetails/ItemDetailsHeaderCard/ItemDetailsHeaderCard.js

 import itemDetailsData from "../../../notFoundData/itemDetailsData";
 import { Tooltip } from "@mui/material";
 import { useTranslation } from "react-i18next";
+import { replaceInRoute } from "../../../util/helpers/routeHelpers";
+import { DIRECT_CHAT_PAGE, PROFILE_PAGE } from "../../../constants/pages";
 
 const ItemDetailsHeaderCard = (props) => {
   const history = useHistory();
   const { t } = useTranslation();
   const offer = useMemo(() => {
     if (props.offer) {
-      if (props.offer.offer._id === routeMatch.params.offerId) {
+      if (props.offer._id === routeMatch.params.offerId) {
         return props.offer;
       }
     }
   const { isMobile } = useIsMobile();
 
   const handleGoProfile = () => {
-    history.push(`/profile/${offer?.offer?.userId}`);
+    history.push(replaceInRoute(PROFILE_PAGE, {
+      profileId: props?.offer?.user?._id
+    }));
   };
   const messageUser = (offer) => {
     const chatItem = chats.find(
-      (item) => item.chat.offerId === offer?.offer?._id
+      (item) => item.offer._id === offer?._id
     );
     if (chatItem !== undefined) {
-      history.push(`/messages/${chatItem.chat._id}`);
+      history.push(DIRECT_CHAT_PAGE, {
+        chatId: chatItem._id
+      });
     } else {
-      if (offer?.offer?.userId !== userId) {
+      if (offer?.user?._id !== userId) {
         history.push(`/messages/newMessage`, {
-          offerId: offer?.offer?._id,
+          offerId: offer?._id,
         });
       }
     }
       <HeaderTop>
         <OfferImage
           src={getImageUrl(
-            offer?.companyData?.image ? offer.companyData.image : "",
+            offer?.user?.image ? offer.user.image : "",
             variants.profileImage,
             isMobile
           )}
         />
         <OfferDetails>
           <OfferTitle isMyProfile={props.isMyProfile} onClick={handleGoProfile}>
-            {offer?.companyData?.company?.name}
+            {offer?.user?.company?.name}
           </OfferTitle>
           <PIBDetail offer={offer} isMyProfile={props.isMyProfile} />
           <CategoryDetail offer={offer} isMyProfile={props.isMyProfile} />

src/components/ItemDetails/ItemDetailsHeaderCard/OfferDetail/Category/CategoryDetail.js

         <LocationIcon />
       </DetailIcon>
       <DetailText ismyprofile={props.isMyProfile}>
-        {offer.offer?.location?.city}
+        {offer?.location?.city}
       </DetailText>
     </DetailContainer>
   );

src/components/ItemDetails/ItemDetailsHeaderCard/OfferDetail/PIB/PIBDetail.js

         <PIB />
       </PIBIcon>
       <DetailText isMyProfile={props.isMyProfile}>
-        {`${t("itemDetailsCard.PIB")}${offer?.companyData?.company?.PIB}`}
+        {`${t("itemDetailsCard.PIB")}${offer?.user?.company?.PIB}`}
       </DetailText>
     </DetailContainer>
   );

src/components/ItemDetails/ItemDetailsHeaderCard/StatisticDetails/StatisticDetails.js

   const { t } = useTranslation();
   const offer = props.offer;
   const percentOfSucceededExchanges = useMemo(() => {
-    if (offer?.companyData?.statistics?.exchanges?.succeeded === 0) {
+    if (offer?.user?.statistics?.exchanges?.succeeded === 0) {
       return 0 + "%";
     } else {
       return (
         Math.ceil(
-          (offer?.companyData?.statistics?.exchanges?.total /
-            offer?.companyData?.statistics?.exchanges?.succeeded) *
+          (offer?.user?.statistics?.exchanges?.total /
+            offer?.user?.statistics?.exchanges?.succeeded) *
             100
         ) + "%"
       );
       <BottomDetails>
         <StatusText>
           <StatusValue>
-            {offer?.companyData?.statistics?.publishes?.count}
+            {offer?.user?.statistics?.publishes?.count}
           </StatusValue>
           {t("itemDetailsCard.offers")}
         </StatusText>
         <StatusText>
           <StatusValue>
-            {offer?.companyData?.statistics?.views?.count}
+            {offer?.user?.statistics?.views?.count}
           </StatusValue>
           {t("itemDetailsCard.totalViews")}
         </StatusText>

src/components/MarketPlace/Header/TooltipHeader/TooltipHeader.js

   const handleClickCategory = () => {
     props?.offers?.filters?.locations.clear();
     props?.offers?.filters?.subcategory.clear();
+    props?.offers?.filters?.companies?.clear();
     props?.offers?.applyFilters();
   };
   const handleClickSubcategory = () => {
     props?.offers?.filters?.locations.clear();
+    props?.offers?.filters?.companies?.clear();
     props?.offers?.applyFilters();
   };
   const goBack = () => {

src/components/MarketPlace/Offers/Offers.js

 const Offers = (props) => {
   const offers = props?.offers;
   const arrayForMapping = Array.apply(null, Array(4)).map(() => {});
+  console.log("rerender")
+
   return (
     <>
       <OffersFilterButton />
       <OffersSearchField />
-      <OffersNotFound />
+      <OffersNotFound skeleton={props?.skeleton} />
       <OffersList
         loading={props?.skeleton}
         offers={offers}
         isGrid={props?.isGrid}
         isUsers={props?.isUsers}
         users={props?.users}
+        myOffers={props?.myOffers}
       />
       {props?.skeleton &&
         arrayForMapping.map((item, index) => (

src/components/MarketPlace/Offers/OffersList/OffersList.js

 import React from "react";
 import PropTypes from "prop-types";
-import { useSelector } from "react-redux";
+import { useDispatch, useSelector } from "react-redux";
 import { selectTotalOffers } from "../../../../store/selectors/offersSelectors";
 import { OffersContainer } from "./OffersList.styled";
 import BigProfileCard from "../../../Cards/ProfileCard/BigProfileCard/BigProfileCard";
 import { startChat } from "../../../../util/helpers/chatHelper";
 import { selectLatestChats } from "../../../../store/selectors/chatSelectors";
 import { selectUserId } from "../../../../store/selectors/loginSelectors";
+import { setRequester } from "../../../../store/actions/exchange/exchangeActions";
+import requesterStatus from "../../../../constants/requesterStatus";
 
 const OffersList = (props) => {
   const totalOffers = useSelector(selectTotalOffers);
   const chats = useSelector(selectLatestChats);
   const userId = useSelector(selectUserId);
+  const dispatch = useDispatch();
   const offers = props?.offers;
   const messageOneUser = (offer) => {
+    dispatch(setRequester(requesterStatus.NOONE));
     startChat(chats, offer, userId);
   };
   return (
                 offer={item}
                 halfwidth={props?.isGrid}
                 messageUser={messageOneUser}
-                isMyOffer={item?.userId === userId || props?.isAdmin}
+                isMyOffer={item?.user._id === userId || props?.isAdmin}
                 isAdmin={props?.isAdmin}
               />
             );

src/components/Modals/EditCategory/EditCategory.js

   // };
 
   const closeModalHandler = () => {
+    console.log("closed")
     dispatch(closeModal());
   };
 
   const handleApiResponseSuccess = () => {
+    console.log("succes")
     if (clickedOnNext) {
       formik.resetForm();
       inputRef.current.focus();

src/components/Popovers/MyMessages/MyMessages.js

 import PropTypes from "prop-types";
 import { makeErrorToastMessage } from "../../../store/utils/makeToastMessage";
 import { EyeIcon } from "./MyMessages.styled";
+import { DIRECT_CHAT_PAGE } from "../../../constants/pages";
+import { replaceInRoute } from "../../../util/helpers/routeHelpers";
 
 export const MyMessages = (props) => {
   const { t } = useTranslation();
 
   const convertMessages = (messages) => {
     return messages
-      .map((item) => ({
-        src: item.interlocutorData.image,
-        title: item.interlocutorData.name,
-        onClick: () => goToMessage(item?.chat?._id),
-        text: "Proizvod: ",
-        bigText: item.offerData.name,
-      }))
+      .map((item) => {
+        let interlocutor = userId === item.participants[0]._id ? 1 : 0;
+        return {
+          src: item.participants[interlocutor]?.image,
+          title: item.participants[interlocutor]?.company?.name,
+          onClick: () => goToMessage(item?._id),
+          text: "Proizvod: ",
+          bigText: item.offer.name,
+        };
+      })
       .slice(0, 2);
   };
 
     }
   };
   const goToMessage = (chatId) => {
-    history.push(`/messages/${chatId}`);
+    history.push(
+      replaceInRoute(DIRECT_CHAT_PAGE, {
+        chatId,
+      })
+    );
     props.closePopover();
   };
   return (

src/components/Profile/ProfileOffers/ProfileOffers.js

   const dispatch = useDispatch();
   const searchRef = useRef(null);
 
+  useEffect(() => {
+    return () => {
+      dispatch(setProfileOffers([]));
+    };
+  }, []);
+
   useEffect(() => {
     dispatch(
       fetchProfileOffers({
         sortOption: sortOption,
         append: isMobile && append,
         page: paging.currentPage,
+        isAdmin: props?.isAdmin,
       })
     );
     setAppend(true);
           <ProfileOffersHeaderSkeleton />
           {isMobile ? (
             <SkeletonContainer>
-              <SkeletonOfferCard vertical />
-              <SkeletonOfferCard vertical />
-              <SkeletonOfferCard vertical />
+              <SkeletonOfferCard vertical skeleton />
+              <SkeletonOfferCard vertical skeleton />
+              <SkeletonOfferCard vertical skeleton />
             </SkeletonContainer>
           ) : (
             <>
               {arrayForMapping.map((item, index) => (
-                <SkeletonOfferCard key={index} />
+                <SkeletonOfferCard key={index} skeleton />
               ))}
             </>
           )}

src/components/UserReviews/UserReviews.js

 import {
   fetchReviews,
   setReviews,
-  fetchReviewsAsAdmin,
 } from "../../store/actions/review/reviewActions";
 import { selectIsLoadingByActionType } from "../../store/selectors/loadingSelectors";
 import SkeletonUserReviews from "./SkeletonUserReviews/SkeletonUserReviews";
     )
   );
 
-
   useEffect(() => {
     let idProfile = routeMatch.params?.profileId;
     if (idProfile) {
-      if (props.isAdmin) {
-        dispatch(fetchReviewsAsAdmin(idProfile));
-      } else {
-        dispatch(fetchReviews(idProfile));
-      }
+      dispatch(fetchReviews(idProfile));
     }
 
     // if (props.profileReviews && routeMatch.params?.profileId) {

src/constants/requesterStatus.js

 export default {
     NOONE: 0,
     ME: 1,
-    INTERLUCATOR: 2
+    interlocutor: 2
 }

src/hooks/useOffers/useCategoryFilter.js

 
   // Set selected category locally in state
   // If second argument is true, then selected category is also updated in redux
-  const setSelectedCategory = (category, immediateApply = false) => {
+  const setSelectedCategory = (category) => {
     setSelectedCategoryLocally(category);
-    if (immediateApply) {
-      dispatch(setFilteredCategory(category));
-    }
+    // if (immediateApply) {
+    //   dispatch(setFilteredCategory(category));
+    // }
   };
 
   // Find category object by providing its name

src/hooks/useOffers/useFilters.js

 import useLocationsFilter from "./useLocationsFilter";
 import useSubcategoryFilter from "./useSubcategoryFilter";
 
-const useFilters = (clearAll = false, applyFilters) => {
+const useFilters = (clearAll = false, applyFilters = () => {}) => {
   const category = useCategoryFilter();
   const subcategory = useSubcategoryFilter(applyFilters);
   const locations = useLocationsFilter();

src/hooks/useOffers/useMyOffers.js

 import useSorting from "./useSorting";
 
 const useMyOffers = () => {
+  const applyFilters = () => {
+    paging.changePage(1);
+    setAppliedFilters(false);
+  };
   const filters = useFilters(true);
   const sorting = useSorting();
   const mineOffers = useSelector(selectMineOffers);
 
   useEffect(() => {
     dispatch(fetchMineOffers());
+    return () => {
+      filters.clear();
+      
+    }
   }, []);
 
   const clear = () => {
     setAppliedFilters(false);
   }
 
-  const apply = () => {
-    paging.changePage(1);
-    setAppliedFilters(false);
-  };
-
   // Filter, search and sort all mine offers
   const allOffersToShow = useMemo(() => {
     let mineOffersFiltered = [...mineOffers];
     search,
     allOffersToShow,
     totalOffers,
-    apply,
+    applyFilters,
     clear,
   };
 };

src/hooks/useOffers/useOffers.js

   const applyFilters = () => {
     setFiltersCleared(true);
   };
-
+  
   const clearFiltersAndApply = () => {
     clear();
     setFiltersCleared(true);
   };
-
+  
   const applySorting = () => {
     paging.changePage(1);
     setFiltersCleared(true);
   };
-
+  
   const applySearch = () => {
     paging.changePage(1);
     setFiltersCleared(true);
   const clearOnlyFiltersAndApply = () => {
     filters.clear();
     paging.changePage(1);
-
     setFiltersCleared(true);
   };
 

src/hooks/useOffers/useSubcategoryFilter.js

 import { setFilteredSubcategory } from "../../store/actions/filters/filtersActions";
 import { selectSelectedSubcategory } from "../../store/selectors/filtersSelectors";
 
-const useSubcategoryFilter = (applyFilters) => {
+const useSubcategoryFilter = (applyFilters = () => {}) => {
   const selectedSubcategory = useSelector(selectSelectedSubcategory);
   const dispatch = useDispatch();
   const initialOption = {
   const setSelectedSubcategory = (subcategory) => {
     setSelectedSubcategoryLocally(subcategory);
     // if (immediateApply) {
-    dispatch(setFilteredSubcategory(subcategory));
+      dispatch(setFilteredSubcategory(subcategory));
     // }
   };
 
   const apply = () => {
-    dispatch(setFilteredSubcategory(selectedSubcategoryLocally));
+    if (
+      Number(selectedSubcategory?._id) !==
+      Number(selectedSubcategoryLocally?._id)
+    )
+      dispatch(setFilteredSubcategory(selectedSubcategoryLocally));
   };
 
   const clear = () => {

src/hooks/useSearch.js

-// import useQueryString from "./useOffers/useQueryString";
-
-export const useSearch = () => {
-  // const queryStringHook = useQueryString();
-  const searchOffers = () => {
-    // if (searchString?.length !== 0) {
-    //   queryStringHook.appendToQueryString("oname", searchString);
-    // } else {
-    //   const newQueryString = new URLSearchParams(queryStringHook.queryString);
-    //   if (newQueryString.has("oname")) {
-    //     queryStringHook.deleteFromQueryString("oname");
-    //   }
-    // }
-  };
-
-  return {
-    searchOffers,
-  };
-};

src/initialValues/createOfferInitialValues/secondPartCreateOfferInitialValues.js

 export default (informations, offer, images) => ({
   images: informations?.image || offer?.images || images,
-  condition: informations?.condition || offer?.condition || "default",
+  condition:
+    informations?.condition ||
+    (typeof offer?.condition === "string" &&
+      offer?.condition?.charAt(0)?.toUpperCase() +
+        offer?.condition?.slice(1)) ||
+    "default",
 });

src/notFoundData/itemDetailsData.js

 import defaultImage from "../constants/defaultImage";
 
 export default {
-    companyData: {
-        company: {
-            PIB: i18next.t("notFoundData.PIB"),
-            name: i18next.t("notFoundData.companyName")
-        },
-        image: defaultImage,
-        lastThreeReviews: [],
-        statistics: {
-            exchanges: {
-                failed: 0,
-                succeeded: 0,
-                total: 0,
-            },
-            publishes: {
-                count: 0,
-            },
-            views: {
-                count: 0,
-            }
-        }
-    },
-    offer: {
         category: {
             name: i18next.t("notFoundData.categoryName")
         },
             count: 0
         },
         _created: new Date().toString()
-    }
 }

src/pages/HomePage/HomePage.js

   const toggleFilters = () => {
     setFiltersOpened((prevFiltersOpened) => !prevFiltersOpened);
   };
-
   return (
     <HomePageContainer>
       <MainLayout

src/pages/ItemDetailsPage/ItemDetailsPageMUI.js

 import UserReviews from "../../components/UserReviews/UserReviews";
 import { selectOffer } from "../../store/selectors/offersSelectors";
 import ProfileMini from "../../components/ProfileMini/ProfileMini";
+import history from "../../store/utils/history";
 
 const ItemDetailsPage = (props) => {
   const dispatch = useDispatch();
   const offerId = props.match.params.offerId;
 
   useEffect(() => {
-    dispatch(fetchOneOffer(offerId));
+    const view = history?.location?.state?.view;
+    console.log(view)
+    dispatch(fetchOneOffer({ offerId, view }));
     () => dispatch(clearSelectedOffer());
   }, []);
 

src/request/apiEndpoints.js

     setFingerprint: "/affiliate/fingerprint",
   },
   offers: {
-    getOneOffer: "offers",
+    getOneOffer: "offers/{offerId}",
     getOffers: "offers",
     getFeaturedOffers: "offers/featured",
     addOffer: "/users/{userId}/offers",
     locations: "locations",
     mineOffers: "users",
     profileOffers: "users/{userId}/offers",
+    profileOffersAsAdmin: "admin/users/{userId}/offers",
     removeOffer: "/users/{userId}/offers/{offerId}",
     removeOfferAsAdmin: "/admin/offers/{offerId}",
     pinOffer: "admin/offers/{id}/pin",
   },
   chat: {
     getChat: "chats",
-    getUserChats: "users/{userId}/chat",
+    getUserChats: "users/{userId}/chats",
     getOneChat: "users/{userId}/chats/{chatId}",
     createChat: "users/{userId}/offers/{offerId}/chat",
     sendMessage: "chats",
   exchange: {
     getExchange: "exchanges",
     validateExchange: "exchanges",
-    acceptExchange: "users/{userId}/exchanges/{exchangeId}/accept"
+    acceptExchange: "users/{userId}/exchanges/{exchangeId}/accept",
   },
   reviews: {
     getUserReviews: "/users/{userId}/reviews",

src/request/index.js

 import axios from "axios";
-import queryString from "qs";
+// import queryString from "qs";
 
 const request = axios.create({
   // baseURL: "http://192.168.88.150:3001/", // DJOLE
     "Content-Type": "application/json",
   },
   // withCredentials: true,
-  paramsSerializer: (params) =>
-    queryString.stringify(params, { arrayFormat: "comma" }),
+  // paramsSerializer: (params) =>
+  //   queryString.stringify(params, { arrayFormat: "comma" }),
 });
 
 export const getRequest = (url, params = null, options = null) => {

src/request/offersRequest.js

   return getRequest(apiEndpoints.offers.getOffers);
 };
 export const attemptFetchOneOffer = (payload) => {
-  const url = `${apiEndpoints.offers.getOneOffer}/${payload}`;
-  return getRequest(url);
+  return getRequest(
+    replaceInUrl(apiEndpoints.offers.getOneOffer, {
+      offerId: payload.offerId,
+    }),
+    payload.queryObject
+  );
 };
 export const attemptFetchMoreOffers = (page, payload) => {
   if (payload)
     }) + `?${queryString}`
   );
 };
+export const attemptFetchProfileOffersAsAdmin = (userId, queryString = "") => {
+  return getRequest(
+    replaceInUrl(apiEndpoints.offers.profileOffersAsAdmin, {
+      userId: userId,
+    }) + `?${queryString}`
+  );
+};
 export const attemptRemoveOffer = (payload, offerId) => {
   return deleteRequest(
     replaceInUrl(apiEndpoints.offers.removeOffer, {

src/socket/socket.js

 import io from "socket.io-client";
 
 export const socket = io("https://trampa-api-test.dilig.net/", {
-// export const socket = io("http://localhost:3001/", {
-// export const socket = io(process.env.REACT_APP_BASE_API_URL, {
+  // export const socket = io("http://localhost:3001/", {
+  // export const socket = io(process.env.REACT_APP_BASE_API_URL, {
   transports: ["websocket"],
   reconnectionAttempts: 5,
 });
     chatId,
     receiverUserId,
     message: {
-      userId,
+      user: {
+        _id: userId,
+      },
       text,
     },
   });
 };
-export const acceptExchangeSocket = (chatId, userId, receiverUserId, callbackFn) => {
+export const acceptExchangeSocket = (
+  chatId,
+  userId,
+  receiverUserId,
+  callbackFn
+) => {
   socket.emit("private_message", {
     chatId,
     receiverUserId,
     message: {
-      userId,
+      user: {
+        _id: userId
+      },
       isAcceptRequest: true,
-      text: ""
+      text: "",
     },
   });
   callbackFn();
 };
 
-export const addMesageListener = (listener) => {
+export const addMessageListener = (listener) => {
   socket.on("private_message", (data) =>
     listener({
       succeed: true,

src/store/middleware/accessTokensMiddleware.js

       // If refresh token is expired, log out user
       if (new Date() > new Date(refreshTokenDecoded?.exp * 1000)) {
         dispatch(logoutUser());
+        return Promise.resolve(response)
       }
       // If access token is expired, refresh access token
       if (new Date() > new Date(jwtTokenDecoded.exp * 1000)) {

src/store/reducers/chat/chatReducer.js

 function setChatsTotal(state, action) {
   return {
     ...state,
-    total: action.payload
+    total: action.payload,
   };
 }
 function setOneChat(state, action) {
 }
 function addNewMessage(state, { payload }) {
   let allChats = [...state.latestChats];
-  let chat = allChats.find((item) => item.chat._id === payload._id);
+  let chat = allChats.find((item) => item._id === payload._id);
   if (chat) {
     chat = {
       ...chat,
-      chat: {
-        ...chat.chat,
-        messages: [...chat.chat.messages, payload.message],
-      },
+      messages: [...chat.messages, payload.message],
     };
-    allChats = allChats.filter((item) => item.chat._id !== chat.chat._id);
+    allChats = allChats.filter((item) => item._id !== chat._id);
     allChats = [chat, ...allChats];
   }
   let newSelectedChat = {};
-  if (state.selectedChat.chat) {
-    newSelectedChat = { ...state.selectedChat };
-    if (newSelectedChat.chat._id === chat.chat._id)
-      newSelectedChat = { ...newSelectedChat, chat: chat.chat };
-  } else {
-    newSelectedChat = { ...chat };
-  }
+  if (state.selectedChat.chat) newSelectedChat = { ...state.selectedChat };
+  newSelectedChat = { ...chat };
   return {
     ...state,
     latestChats: [...allChats],

src/store/saga/chatSaga.js

       queryString: queryString,
     });
     yield call(console.dir, data);
-    yield put(setChats([...data.data.chatsWithData]));
-    yield put(setChatsTotal(data.data.total))
+    yield put(setChats([...data.data.chats]));
+    yield put(setChatsTotal(data.data.total));
     yield put(fetchChatsSuccess());
   } catch (e) {
     yield put(fetchChatsError());
   try {
     const userId = yield select(selectUserId);
     const data = yield call(attemptFetchHeaderChats, userId);
-    yield put(setChats([...data.data.chatsWithData]));
+    yield put(setChats([...data.data.chats]));
     yield put(fetchHeaderChatsSuccess());
   } catch (e) {
     yield put(fetchHeaderChatsError());
       userId,
     });
     let requester = requesterStatus.NOONE;
-    chatData.data.chat.messages.forEach((item) => {
+    chatData.data.messages.forEach((item) => {
       if (requester !== requesterStatus.NOONE) return;
       if (item.isAcceptRequest) {
-        if (item.userId === userId) requester = requesterStatus.ME;
-        else requester = requesterStatus.INTERLUCATOR;
+        if (item.user._id === userId) requester = requesterStatus.ME;
+        else requester = requesterStatus.interlocutor;
       }
     });
-    const chat = {
-      chat: chatData.data.chat,
-      offer: {
-        offer: { ...chatData.data.offer, images: [chatData.data.offer.image] },
-      },
-      interlocutor: chatData.data.interlocutorData,
-    };
     yield put(setRequester(requester));
-    yield put(setOneChat(chat));
+    yield put(setOneChat(chatData.data));
     yield put(fetchOneChatSuccess());
   } catch (e) {
     yield put(fetchOneChatError());
     const exchange = yield select(selectExchange);
     const userId = yield select(selectUserId);
     yield call(attemptSendMessage, payload.payload.chatId, messageObject);
-    if (chat?.offer?.offer?.userId === userId && exchange.valid === false) {
+    if (chat?.offer?.user._id === userId && exchange.valid === false) {
       yield put(validateExchange(exchange._id));
     }
     yield call(fetchChats);
     });
     const queryString = yield select(selectQueryString);
     const data = yield call(attemptFetchChats, { userId, queryString });
-    yield put(setChats([...data.data.chatsWithData]));
-    yield put(setChatsTotal(data.data.total))
+    yield put(setChats([...data.data.chats]));
+    yield put(setChatsTotal(data.data.total));
     const newChatId = newChatData.data.chatId;
     yield put(startNewChatSuccess());
     yield call(
       newChatData.data.chatId,
       userId,
       payload.payload.message,
-      payload.payload.interlucatorUserId
+      payload.payload.interlocutorUserId
     );
     yield put(
       addNewMessage({
         _id: newChatId,
         message: {
-          userId,
+          user: {
+            _id: userId
+          },
           text: payload.payload.message,
           _created: new Date().toISOString(),
         },

src/store/saga/exchangeSaga.js

 }
 function* acceptExchange({ payload }) {
   try {
+    console.log("accept salje i prima 2 POZVANA ACCEPT SAGA")
     const userId = yield select(selectUserId);
     yield call(attemptAcceptExchange, userId, payload.exchangeId);
     const data = yield call(attemptFetchExchange, payload.exchangeId);
     yield put(setExchange(data.data));
+    if (payload.handleApiResponseSuccess)
+      yield call(payload.handleApiResponseSuccess);
     yield put(acceptExchangeSuccess());
   } catch (e) {
     yield put(acceptExchangeError());

src/store/saga/offersSaga.js

   attemptFetchFeaturedOffers,
   attemptFetchOffers,
   attemptFetchOneOffer,
+  attemptFetchProfileOffersAsAdmin,
   attemptPinOffer,
   attemptRemoveOffer,
   attemptRemoveOfferAsAdmin,
     const offerData = payload.payload.offerData;
     const formData = new FormData();
     formData.append("category[name]", offerData.category.name);
-    formData.append("condition", offerData.condition);
+    formData.append(
+      "condition",
+      offerData.condition === "Novo"
+        ? "novo"
+        : offerData.condition === "Polovno"
+        ? "polovno"
+        : "kao novo"
+    );
     formData.append("description", offerData.description);
     // formData.append("file", JSON.stringify(offerData.images))
     for (var i = 0; i < offerData.images.length; i++) {
 
 function* fetchOneOffer(payload) {
   try {
-    const data = yield call(attemptFetchOneOffer, payload.payload);
+    let offerId = payload.payload;
+    console.log("sagabb", payload.payload);
+    const queryObject = new URLSearchParams();
+    if (typeof payload.payload === "object") {
+      offerId = payload.payload.offerId;
+      queryObject.set("view", "true");
+    }
+    const data = yield call(attemptFetchOneOffer, {
+      offerId,
+      queryObject,
+    });
     if (!data?.data) throw new Error();
     yield put(fetchOneOfferSuccess(data?.data));
   } catch (e) {
     const userId = yield select(selectUserId);
     const data = yield call(attemptFetchProfileOffers, userId);
     yield put(setMineOffers(data.data.offers));
+    yield put(setTotalOffers(data.data.total));
     yield put(fetchMineOffersSuccess());
   } catch (e) {
     yield put(fetchMineOffersError());
       queryString = yield select(selectQueryString);
     }
     console.log(queryString.toString());
-    const data = yield call(
-      attemptFetchProfileOffers,
-      userId,
-      convertQueryStringForBackend(queryString)
-    );
+    let data;
+    if (payload.payload.isAdmin) {
+      data = yield call(
+        attemptFetchProfileOffersAsAdmin,
+        userId,
+        convertQueryStringForBackend(queryString)
+      );
+    } else {
+      data = yield call(
+        attemptFetchProfileOffers,
+        userId,
+        convertQueryStringForBackend(queryString)
+      );
+    }
     if (payload.payload.append) {
       yield put(addProfileOffers(data.data.offers));
     } else {
     const offerData = payload.payload.offerData;
     const formData = new FormData();
     formData.append("category[name]", offerData.category.name);
-    formData.append("condition", offerData.condition);
+    formData.append("condition", offerData.condition.toLowerCase());
     formData.append("description", offerData.description);
     // const oldImages = [];
     for (var i = 0; i < offerData.images.length; i++) {

src/store/saga/reviewSaga.js

   try {
     console.log(payload);
     const data = yield call(attemptFetchReview, payload.payload);
-    yield put(setReviews([...data.data].reverse()));
+    yield put(setReviews([...data.data.reviews].reverse()));
     yield put(fetchReviewsSuccess());
   } catch (e) {
     yield put(fetchReviewsError());

src/util/helpers/chatHelper.js

+import { DIRECT_CHAT_PAGE } from "../../constants/pages";
 import history from "../../store/utils/history";
+import { replaceInRoute } from "./routeHelpers";
 
 export const startChat = (chats, offer, userId) => {
   const chatItem = chats.find(
-    (item) => item.chat.offerId === offer?._id && offer?.userId !== userId
+    (item) => item.offer?._id === offer?._id && offer?.user?._id !== userId
   );
   if (chatItem !== undefined) {
-    history.push(`/messages/${chatItem.chat._id}`);
+    history.push(replaceInRoute(DIRECT_CHAT_PAGE, { chatId: chatItem?._id }));
   } else {
-    if (offer?.userId !== userId) {
+    if (offer?.user?._id !== userId) {
       history.push(`/messages/newMessage`, {
         offerId: offer?._id,
       });