@ordergroove/offers 2.28.2 → 2.28.3-alpha-PR-686-2.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ordergroove/offers",
-  "version": "2.28.2",
+  "version": "2.28.3-alpha-PR-686-2.5+6aa5b16b",
   "description": "offer state component",
   "author": "Eugenio Lattanzio <eugenio63@gmail.com>",
   "homepage": "https://github.com/ordergroove/plush-toys#readme",
@@ -45,7 +45,7 @@
     "throttle-debounce": "^2.1.0"
   },
   "devDependencies": {
-    "@ordergroove/offers-templates": "^0.4.17"
+    "@ordergroove/offers-templates": "^0.4.18-alpha-PR-686-2.5+6aa5b16b"
   },
-  "gitHead": "0dae2ce3e9690f602b03af9511f2c242023ac438"
+  "gitHead": "6aa5b16b582ba0393ad6477f1a6c3fcaa11dc8e6"
 }

package/src/components/DefaultFrequencyText.js

@@ -0,0 +1,58 @@
+import { LitElement, html } from 'lit-element';
+
+import { connect } from '../core/connect';
+import { withProduct } from '../core/resolveProperties';
+import { configSelector, hasShopifySellingPlansSelector, makeProductDefaultFrequencySelector } from '../core/selectors';
+import { isOgFrequency, mapFrequencyToSellingPlan } from '../core/utils';
+
+export class DefaultFrequencyText extends withProduct(LitElement) {
+  static get properties() {
+    return {
+      ...super.properties,
+      configDefaultFrequency: { type: String, attribute: false },
+      defaultFrequency: { type: String, attribute: false },
+      frequencies: { type: Array, attribute: false },
+      frequenciesEveryPeriod: { type: Array, attribute: false },
+      frequency: {
+        type: String,
+        attribute: true
+      },
+      hasShopifySellingPlans: { type: Boolean, attribute: false },
+      productDefaultFrequency: { type: String, attribute: false }
+    };
+  }
+
+  get safeFrequency() {
+    if (isOgFrequency(this.frequency) && this.hasShopifySellingPlans) {
+      return mapFrequencyToSellingPlan(this.frequencies, this.frequenciesEveryPeriod, this.frequency);
+    }
+
+    return this.frequency;
+  }
+
+  get shouldShowFrequencyText() {
+    return !!(
+      this.productDefaultFrequency === this.safeFrequency ||
+      (!this.productDefaultFrequency &&
+        [this.configDefaultFrequency, this.defaultFrequency].some(it => it === this.safeFrequency))
+    );
+  }
+
+  render() {
+    return this.shouldShowFrequencyText
+      ? html`
+          <slot></slot>
+        `
+      : html``;
+  }
+}
+
+export const mapStateToProps = (state, ownProps) => ({
+  productDefaultFrequency: makeProductDefaultFrequencySelector((ownProps.product || {}).id)(state),
+  hasShopifySellingPlans: hasShopifySellingPlansSelector(state),
+  configDefaultFrequency: state.config?.defaultFrequency,
+  ...configSelector(state, ownProps, 'frequencies', []),
+  ...configSelector(state, ownProps, 'frequenciesEveryPeriod', [])
+});
+
+export const ConnectedDefaultFrequencyText = connect(mapStateToProps)(DefaultFrequencyText);

package/src/core/selectors.js

@@ -131,6 +131,17 @@ export const makeProductDefaultFrequencySelector = memoize(productId =>
   )
 );
 
+/**
+ * Returns a boolean representing if a merchant has Shopify selling plans
+ * @param {Object} state
+ */
+export const hasShopifySellingPlansSelector = state =>
+  [
+    platform.shopify_selling_plans,
+    !!frequenciesEveryPeriodSelector(state).length,
+    !!sellingPlansSelector(state).length
+  ].every(it => !!it);
+
 /**
  * Convert a string from camel case to kebab case.
  * @param {String} string

package/src/make-api.js

@@ -20,6 +20,7 @@ import { Modal } from './components/Modal';
 import { Select } from './components/Select';
 import { Tooltip } from './components/Tooltip';
 import { ConnectedFrequencyStatus } from './components/FrequencyStatus';
+import { ConnectedDefaultFrequencyText } from './components/DefaultFrequencyText';
 import * as testMode from './test-mode';
 import { api } from './core/api';
 import { environment, offer } from './core/reducer';
@@ -51,6 +52,7 @@ export default function makeApi(store) {
     customElements.define('og-upsell-modal', ConnectedUpsellModal);
     customElements.define('og-next-upcoming-order', ConnectedNextUpcomingOrder);
     customElements.define('og-price', ConnectedPrice);
+    customElements.define('og-default-frequency-text', ConnectedDefaultFrequencyText);
   } catch (err) {
     console.info('OG WebComponents already registered, skipping.');
   }