How to use the @shopgate/pwa-common/streams/router.routeWillEnter$.filter function in @shopgate/pwa-common

/**
 * Emits when product results has been received.
 */
export const productsReceived$ = main$
  .filter(({ action }) => action.type === RECEIVE_PRODUCTS);

/**
 * Emits when the category route comes active again after a legacy page was active.
 */
export const productRouteReappeared$ = pwaDidAppear$
  .filter(({ action }) => action.route.pattern === ITEM_PATTERN);

/**
 * Emits when a product page was initially opened.
 */
export const productWillEnter$ = routeWillEnter$
  .filter(({ action }) => action.route.pattern === ITEM_PATTERN);

/**
 * Emits when a product page was initially opened and its data is present.
 */
export const productIsReady$ = productWillEnter$
  // Take care that the stream only emits when underlying streams emit within the correct order.
  .switchMap(() => receivedVisibleProduct$.first())
  .merge(productRouteReappeared$);

import { getCurrentRoute } from '@shopgate/pwa-common/selectors/router';
import { routeWillEnter$ } from '@shopgate/pwa-common/streams/router';
import { main$ } from '@shopgate/pwa-common/streams/main';
import { RECEIVE_PAGE_CONFIG } from '@shopgate/pwa-common/constants/ActionTypes';

export const pageWillEnter$ = routeWillEnter$
  .filter(({ action }) => !!action.route.params.pageId);

export const receivedVisiblePageConfig$ = main$
  .filter(({ action, getState }) => {
    const route = getCurrentRoute(getState());

    if (action.type !== RECEIVE_PAGE_CONFIG) {
      return false;
    }

    if (typeof action.pageId === 'undefined') {
      return false;
    }

    if (!route.params.pageId) {
      return false;

import { getCurrentRoute } from '@shopgate/pwa-common/selectors/router';
import { routeWillEnter$ } from '@shopgate/pwa-common/streams/router';
import { main$ } from '@shopgate/pwa-common/streams/main';
import { RECEIVE_PAGE_CONFIG } from '@shopgate/pwa-common/constants/ActionTypes';

export const pageWillEnter$ = routeWillEnter$
  .filter(({ action }) => !!action.route.params.pageId);

export const receivedVisiblePageConfig$ = main$
  .filter(({ action, getState }) => {
    const route = getCurrentRoute(getState());

    if (action.type !== RECEIVE_PAGE_CONFIG) {
      return false;
    }

    if (typeof action.pageId === 'undefined') {
      return false;
    }

    if (!route.params.pageId) {
      return false;

import { getCurrentRoute } from '@shopgate/pwa-common/helpers/router';
import { main$ } from '@shopgate/pwa-common/streams/main';
import { routeWillEnter$, routeWillLeave$ } from '@shopgate/pwa-common/streams/router';
import {
  ITEM_PATH,
  RECEIVE_PRODUCT,
  RECEIVE_PRODUCT_CACHED,
} from '@shopgate/pwa-common-commerce/product/constants';
import {
  REQUEST_SUBMIT_REVIEW,
  RECEIVE_SUBMIT_REVIEW,
  ERROR_SUBMIT_REVIEW,
  RESET_SUBMIT_REVIEW,
} from '../constants';

export const reviewsWillEnter$ = routeWillEnter$
  .filter(({ action }) => action.route.pattern === `${ITEM_PATH}/:productId/reviews`);

export const reviewsWillLeave$ = routeWillLeave$
  .filter(({ action }) => action.route.pattern === `${ITEM_PATH}/:productId/reviews`);

/**
 * Gets triggered when the user tried to submit a review.
 * @type {Observable}
 */
export const requestReviewSubmit$ = main$.filter(({ action }) => (
  action.type === REQUEST_SUBMIT_REVIEW
));

/**
 * Gets triggered when the user tried to submit a review.
 * @type {Observable}

FAVORITES_PATH,
  REQUEST_ADD_FAVORITES,
  REQUEST_REMOVE_FAVORITES,
  RECEIVE_FAVORITES,
  RECEIVE_SYNC_FAVORITES,
  ERROR_SYNC_FAVORITES,
  ERROR_FETCH_FAVORITES,
  IDLE_SYNC_FAVORITES,
  ERROR_FAVORITES,
} from '../constants';

/**
 * @link https://developer.shopgate.com/references/engage/streams/favorites
 */

export const favoritesWillEnter$ = routeWillEnter$
  .filter(({ action }) => action.route.pattern === FAVORITES_PATH);

export const favoritesError$ = main$.filter(({ action }) => [
  ERROR_SYNC_FAVORITES,
  ERROR_FETCH_FAVORITES,
  ERROR_FAVORITES,
].includes(action.type));

export const shouldFetchFavorites$ = favoritesWillEnter$.merge(appDidStart$);

export const shouldFetchFreshFavorites$ = userDidLogin$.merge(userDidLogout$);

export const favoritesDidUpdate$ = main$.filter(({ action }) => [
  REQUEST_ADD_FAVORITES,
  REQUEST_REMOVE_FAVORITES,
  RECEIVE_FAVORITES,

import { routeWillEnter$ } from '@shopgate/pwa-common/streams/router';
import { INDEX_PATH } from '@shopgate/pwa-common/constants/RoutePaths';

export const startPageWillEnter$ = routeWillEnter$
  .filter(({ action }) => action.route.pathname === INDEX_PATH);

import { main$ } from '@shopgate/pwa-common/streams/main';
import { routeWillEnter$, routeDidEnter$, routeWillLeave$ } from '@shopgate/pwa-common/streams/router';
import { CATEGORY_PATH, RECEIVE_CATEGORY, ERROR_CATEGORY } from '@shopgate/pwa-common-commerce/category/constants';
import { filtersDidUpdate$ } from '@shopgate/pwa-common-commerce/filter/streams';
import { getCurrentRoute } from '@shopgate/pwa-common/selectors/router';
import { hex2bin } from '@shopgate/pwa-common/helpers/data';

export const categoryWillEnter$ = routeWillEnter$
  .filter(({ action }) => action.route.pattern === `${CATEGORY_PATH}/:categoryId`);

export const categoryDidEnter$ = routeDidEnter$
  .filter(({ action }) => action.route.pattern === `${CATEGORY_PATH}/:categoryId`);

export const categoryWillLeave$ = routeWillLeave$
  .filter(({ action }) => action.route.pattern === `${CATEGORY_PATH}/:categoryId`);

/**
 * Filters stream state by type.
 * @param {Object} data The stream data.
 * @param {string} type The action type to filter.
 * @returns {boolean}
 */
const filterDataByType = (data, type) => {
  const { action, getState } = data;

export const filterWillLeave$ = routeWillLeave$
  .filter(({ action }) => (
    action.route.pattern === `${CATEGORY_PATH}/:categoryId${FILTER_PATH}`
    || action.route.pattern === `${SEARCH_PATH}${FILTER_PATH}`
  ));

export const filterableRoutesWillEnter$ = routeWillEnter$
  .filter(({ action }) => (
    action.historyAction === ACTION_PUSH
    && (
      action.route.pattern === `${CATEGORY_PATH}/:categoryId`
      || action.route.pattern === SEARCH_PATH
    )
  ));

export const filterableRoutesWillReenter$ = routeWillEnter$
  .filter(({ action }) => (
    action.historyAction === ACTION_POP
    && (
      action.route.pattern === `${CATEGORY_PATH}/:categoryId`
      || action.route.pattern === SEARCH_PATH
    )
  ));

export const filterableRoutesWillLeave$ = routeWillLeave$
  .filter(({ action }) => (
    action.historyAction === ACTION_POP
    && (
      action.route.pattern === `${CATEGORY_PATH}/:categoryId`
      || action.route.pattern === SEARCH_PATH
    )
  ));

import { routeWillEnter$, routeWillLeave$ } from '@shopgate/pwa-common/streams/router';
import { LOGIN_PATH } from '@shopgate/pwa-common/constants/RoutePaths';

export const loginWillEnter$ = routeWillEnter$
  .filter(({ action }) => action.route.pattern === LOGIN_PATH);

export const loginWillLeave$ = routeWillLeave$
  .filter(({ action }) => action.route.pattern === LOGIN_PATH);

ERROR_PRODUCT_DESCRIPTION,
  ERROR_PRODUCT_IMAGES,
  ERROR_PRODUCT_VARIANTS,
  ERROR_PRODUCT_PROPERTIES,
  ERROR_PRODUCT_OPTIONS,
  ERROR_PRODUCT_SHIPPING,
  PRODUCT_NOT_AVAILABLE,
} from '../constants';

export const productWillEnter$ = routeWillEnter$.merge(routeDidUpdate$)
  .filter(({ action }) => action.route.pattern === ITEM_PATTERN);

export const variantWillUpdate$ = routeDidUpdate$
  .filter(({ action }) => action.route.pattern === ITEM_PATTERN);

export const galleryWillEnter$ = routeWillEnter$
  .filter(({ action }) => action.route.pattern === ITEM_GALLERY_PATTERN);

export const galleryWillLeave$ = routeWillLeave$
  .filter(({ action }) => action.route.pattern === ITEM_GALLERY_PATTERN);

export const productReceived$ = main$
  .filter(({ action }) => action.type === RECEIVE_PRODUCT)
  .distinctUntilChanged();

/** Dispatched when ERROR_PRODUCT received */
export const errorProduct$ = main$.filter(({ action }) => action.type === ERROR_PRODUCT);

/** Dispatched when ERROR_PRODUCT_* (resources) is received */
export const errorProductResources$ = main$.filter((
  ({ action }) => [
    ERROR_PRODUCT_DESCRIPTION,