feat module 6, 7 : remove sold out item or item not in menu from recently view in product page

src/components/ProductHistoryList/ProductHistoryList.jsx

@@ -2,9 +2,23 @@ import { useState, useEffect } from 'react';
 import { Box, Typography, IconButton, Pagination, Button } from '@mui/material';
 import { useSelector, useDispatch } from 'react-redux';
 import defaultImage from "../../assets/images/default.png"
+import { getMenuCollectionTitlesByProductType } from '../../config/menuCollections';
 
 import Grid from '@mui/material/Grid2';
 
+const normalizeTitle = (title = "") => title.trim().toUpperCase();
+
+const allowedRecentlyViewedCollections = getMenuCollectionTitlesByProductType();
+
+const isProductAllowedInRecentlyViewed = (product) => {
+  const allowedCollections = allowedRecentlyViewedCollections[product?.productType] || [];
+  const normalizedAllowedCollections = allowedCollections.map(normalizeTitle);
+
+  return product?.collections?.some((collection) =>
+    normalizedAllowedCollections.includes(normalizeTitle(collection?.title))
+  );
+};
+
 const ProductHistoryList = () => {
 
   const products = useSelector((state) => state.products.products.data); // only used as referenced
@@ -15,7 +29,15 @@ const ProductHistoryList = () => {
     if (products.length > 0 && localStorage.getItem('amber-product-history')) {
 
       const productHandleList = JSON.parse(localStorage.getItem('amber-product-history')) || []
-      const selectedProducts = products.filter(({ handle }) => productHandleList.includes(handle)) || []
+      const selectedProducts = products.filter((product) => (
+        productHandleList.includes(product.handle) && isProductAllowedInRecentlyViewed(product)
+      )) || []
+
+      // Keep the old history key, but remove products that are no longer available through the menu.
+      localStorage.setItem(
+        'amber-product-history',
+        JSON.stringify(selectedProducts.map(({ handle }) => handle))
+      )
 
       setFilterProducts(selectedProducts)