Integration with BOLD Upsell App

// ...some Shopify code here

// this script tag needs to be added
<script>
      window.BOLD.common.Shopify.saveProduct({{ product.handle | json }}, {{ product.id | json }});
      {%- for variant in product.variants -%} window.BOLD.common.Shopify.saveVariant({{ variant.id | json }}, {product_id: {{ product.id | json }}, price: {{ variant.price | json }}, group_id: '{{variant.metafields.bold_rp.rp_group_id | json }}'}); {%- endfor -%}
</script>


// then add the form 
<form action="/cart/add" method="post" enctype="multipart/form-data" class="product-form" id="AddToCartForm">
      <select hidden name="id" id="ProductSelect-{{ section.id }}" class="product-form__variants no-js">
// ...

// ...some code here
import { lifecycle } from 'recompose'; //we would need lifecycle

// ...some code here

// An example of an 'Add to cart' button
const AddToCartButton = ({ onClick, item }) => (
      <form enctype='multipart/form-data' class='product-form' id='AddToCartForm' onSubmit={(e) => {e.preventDefault();}} >
        <input hidden name='id' value={item.get(['selected_variant_id'])} />//or the variant that needs to be added to cart
        <button className='findify-product-card__addtobag-bttn addtocart button dark'  onClick={onClick}>//onClick function should do regular add to cart business
          <svg>
            <use xlinkHref="#light--addtobag"/>
          </svg>
          Add to Bag
        </button>
      </form>
    ) 
    
   const enhancer = lifecycle({
    componentDidMount(){
      const { item } = this.props;
      window.BOLD.common.Shopify.saveProduct(item.get('product_url'), item.get('id'));
    }
  });

// ...some code here

// AddToCart component can be added to the productCard
// also see https://developers.findify.io/docs/add-to-cart-button for how to add an 'Add to cart' button

export default enhancer(ProductCardView); //wrap the productCard component with enhancer