Remove useCustomerWishlistSkus hook from Carousel and Gallery components and add in useApp talon to avoid infinite loop

Author: joseamietta

packages/pagebuilder/lib/ContentTypes/Products/Carousel/__tests__/useCarousel.spec.js

@@ -15,13 +15,6 @@ import defaultOperations from '../carousel.gql';
 import mosOperations from '../carousel.gql.ce';
 import acOperations from '../carousel.gql.ee';
 
-jest.mock(
-    '@magento/peregrine/lib/hooks/useCustomerWishlistSkus/useCustomerWishlistSkus',
-    () => ({
-        useCustomerWishlistSkus: jest.fn()
-    })
-);
-
 const cache = new InMemoryCache({
     typePolicies
 });

packages/pagebuilder/lib/ContentTypes/Products/Carousel/useCarousel.js

@@ -1,7 +1,5 @@
 import { useQuery } from '@apollo/client';
 
-import { useCustomerWishlistSkus } from '@magento/peregrine/lib/hooks/useCustomerWishlistSkus/useCustomerWishlistSkus';
-
 import mergeOperations from '@magento/peregrine/lib/util/shallowMerge';
 import defaultOperations from './carousel.gql';
 
@@ -11,8 +9,6 @@ import defaultOperations from './carousel.gql';
 export const useCarousel = (props = {}) => {
     const operations = mergeOperations(defaultOperations, props.operations);
 
-    useCustomerWishlistSkus();
-
     const { data: storeConfigData } = useQuery(operations.getStoreConfigQuery, {
         fetchPolicy: 'cache-and-network'
     });

packages/peregrine/lib/talons/App/__tests__/useApp.spec.js

@@ -16,6 +16,13 @@ useHistory.mockImplementation(() => ({
     go: reload
 }));
 
+jest.mock(
+    '@magento/peregrine/lib/hooks/useCustomerWishlistSkus/useCustomerWishlistSkus',
+    () => ({
+        useCustomerWishlistSkus: jest.fn()
+    })
+);
+
 jest.mock('@magento/peregrine/lib/context/app', () => {
     const state = {
         drawerClosed: false,

packages/peregrine/lib/talons/App/useApp.js

@@ -2,6 +2,7 @@ import { useCallback, useEffect, useMemo } from 'react';
 import { useHistory } from 'react-router-dom';
 
 import errorRecord from '@magento/peregrine/lib/util/createErrorRecord';
+import { useCustomerWishlistSkus } from '@magento/peregrine/lib/hooks/useCustomerWishlistSkus/useCustomerWishlistSkus';
 import { useAppContext } from '@magento/peregrine/lib/context/app';
 
 const dismissers = new WeakMap();
@@ -41,6 +42,8 @@ export const useApp = props => {
     } = props;
     const history = useHistory();
 
+    useCustomerWishlistSkus();
+
     const reload = useCallback(() => {
         if (process.env.NODE_ENV !== 'development') {
             history.go(0);

packages/peregrine/lib/talons/Gallery/__tests__/useGallery.spec.js

@@ -15,13 +15,6 @@ import defaultOperations from '../gallery.gql';
 import mosOperations from '../gallery.gql.ce';
 import acOperations from '../gallery.gql.ee';
 
-jest.mock(
-    '../../../hooks/useCustomerWishlistSkus/useCustomerWishlistSkus',
-    () => ({
-        useCustomerWishlistSkus: jest.fn()
-    })
-);
-
 const cache = new InMemoryCache({
     typePolicies
 });

packages/peregrine/lib/talons/Gallery/useGallery.js

@@ -1,15 +1,11 @@
 import { useQuery } from '@apollo/client';
 
-import { useCustomerWishlistSkus } from '../../hooks/useCustomerWishlistSkus/useCustomerWishlistSkus';
-
 import mergeOperations from '../../util/shallowMerge';
 import defaultOperations from './gallery.gql';
 
 export const useGallery = (props = {}) => {
     const operations = mergeOperations(defaultOperations, props.operations);
 
-    useCustomerWishlistSkus();
-
     const { data: storeConfigData } = useQuery(operations.getStoreConfigQuery, {
         fetchPolicy: 'cache-and-network'
     });