@shopgate/engage/back-in-stock/components/ProductInfoBackInStockButton/index.js

Shopgate's ENGAGE library.

import React from 'react';
import PropTypes from 'prop-types';
import { SurroundPortals } from '@shopgate/engage/components';
import { PRODUCT_BACK_IN_STOCK } from '@shopgate/engage/back-in-stock/constants';
import { BackInStockButton } from '@shopgate/engage/back-in-stock/components';
import { withCurrentProduct } from '@shopgate/engage/core';
import connect from "./connector";

/**
 * The ProductInfoBackInStockButton component.
 * @param {Object} props The component props.
 * @param {boolean} props.isBackInStockEnabled Whether the back in stock feature is enabled
 * @param {string} props.productId The product id
 * @param {string} props.variantId The variant id
 * @param {Object} props.product The product
 * @param {Object} props.subscription The subscription
 * @return {JSX.Element}
 */
import { jsx as _jsx } from "react/jsx-runtime";
const ProductInfoBackInStockButton = ({
  productId,
  variantId,
  isBackInStockEnabled,
  subscription,
  product
}) => {
  const productIsAVariant = product?.type !== 'parent' && product?.type !== null;
  const productIsNotAvailable = product?.stock?.quantity === 0 && product?.stock?.ignoreQuantity === false;
  const showBackInStockButton = productIsAVariant && productIsNotAvailable && isBackInStockEnabled;
  return /*#__PURE__*/_jsx(SurroundPortals, {
    portalName: PRODUCT_BACK_IN_STOCK,
    portalProps: {
      showBackInStockButton
    },
    children: showBackInStockButton && /*#__PURE__*/_jsx(BackInStockButton, {
      showAsButton: true,
      subscription: subscription,
      isLinkToBackInStockEnabled: true,
      productId: variantId ?? productId
    })
  });
};
ProductInfoBackInStockButton.defaultProps = {
  subscription: null,
  variantId: null,
  product: null
};
export default withCurrentProduct(connect(ProductInfoBackInStockButton));