Ready for testing and deploy

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

@@ -37,7 +37,7 @@ const ImagesCarousel = (props) => {
           <CloseButtonIcon />
         </CloseButton>
         <Scroller isCarousel>
-          {props?.images.map((image) => {
+          {props?.offer?.images.map((image) => {
             if (!image) return;
             return (
               <OfferImage
@@ -59,7 +59,6 @@ ImagesCarousel.propTypes = {
   offer: PropTypes.any,
   onModalClose: PropTypes.any,
   createOffer: PropTypes.bool,
-  images: PropTypes.array
 };
 
 export default ImagesCarousel;

src/components/Header/Header.js

@@ -44,6 +44,7 @@ import { toggleCreateOfferModal } from "../../store/actions/modal/modalActions";
 import { ReactComponent as Marketplace } from "../../assets/images/svg/package.svg";
 import { useTranslation } from "react-i18next";
 import useIsTablet from "../../hooks/useIsTablet";
+import { clearFilters } from "../../store/actions/filters/filtersActions";
 
 const Header = () => {
   const theme = useTheme();
@@ -58,6 +59,7 @@ const Header = () => {
   const [shouldShow, setShouldShow] = useState(true);
   const routeMatch = useRouteMatch();
   const { isTablet } = useIsTablet();
+  const [logoClicked, setLogoClicked] = useState(false);
   const { t } = useTranslation();
 
   // Dont show header on auth routes(login, register, etc.) and admin routes
@@ -73,6 +75,37 @@ const Header = () => {
     }
   }, []);
 
+  useEffect(() => {
+    if (logoClicked) {
+      if (isAdminRoute()) {
+        history.push({
+          pathname: ADMIN_HOME_PAGE,
+          state: {
+            logo: true,
+          },
+        });
+      } else {
+        if (user) {
+          history.push({
+            pathname: HOME_PAGE,
+            state: {
+              logo: true,
+            },
+          });
+        } else {
+          history.push({
+            pathname: MARKETPLACE_PAGE,
+            state: {
+              logo: true,
+            },
+          });
+        }
+        if (searchRef?.current) searchRef.current.value = "";
+      }
+      setLogoClicked(false);
+    }
+  }, [logoClicked]);
+
   // Sets value into search input based on query string
   useEffect(() => {
     if (searchRef.current) {
@@ -99,30 +132,15 @@ const Header = () => {
 
   // When user clicks logo, he sends specific state so filters can be removed
   const handleLogoClick = () => {
-    if (isAdminRoute()) {
-      history.push({
-        pathname: ADMIN_HOME_PAGE,
-        state: {
-          logo: true,
-        },
-      });
-    } else {
-      if (user) {
-        history.push({
-          pathname: HOME_PAGE,
-          state: {
-            logo: true,
-          },
-        });
-      } else {
-        history.push({
-          pathname: MARKETPLACE_PAGE,
-          state: {
-            logo: true,
-          },
-        });
-      }
-      if (searchRef?.current) searchRef.current.value = "";
+    if (
+      !(
+        routeMatches(HOME_PAGE) ||
+        routeMatches(BASE_PAGE) ||
+        routeMatches(MARKETPLACE_PAGE)
+      )
+    ) {
+      dispatch(clearFilters());
+      setLogoClicked(true);
     }
   };
 

src/hooks/useOffers/useFilters.js

@@ -14,6 +14,9 @@ const useFilters = (clearAll = false, applyFilters = () => {}) => {
     if (clearAll) {
       clear();
     }
+    return () => {
+      clear();
+    }
   }, []);
 
   const numOfFiltersChosen = useMemo(() => {

src/hooks/useOffers/useSubcategoryFilter.js

@@ -44,8 +44,8 @@ const useSubcategoryFilter = (applyFilters = () => {}) => {
   };
 
   const clear = () => {
-    setSelectedSubcategoryLocally(initialOption);
-    dispatch(setFilteredSubcategory(initialOption));
+    setSelectedSubcategoryLocally({});
+    dispatch(setFilteredSubcategory({}));
   };
 
   return {