feat: add option to not show price strings at all

myparcelnl · Mar 25, 2021 · 1b5c5b9 · 1b5c5b9
1 parent 7a6205d
commit 1b5c5b9
Show file tree

Hide file tree

Showing 9 changed files with 125 additions and 12 deletions.
diff --git a/src/config/defaultConfiguration.js b/src/config/defaultConfiguration.js
@@ -35,6 +35,7 @@ export const defaultConfiguration = (platform = DEFAULT_PLATFORM) => {
     [CONFIG.KEY]: {
       [CONFIG.PLATFORM]: DEFAULT_PLATFORM,
       [CONFIG.CURRENCY]: 'EUR',
+      [CONFIG.SHOW_PRICES]: true,
       [CONFIG.SHOW_PRICE_SURCHARGE]: false,
 
       [CONFIG.PACKAGE_TYPE]: DEFAULT_PACKAGE_TYPE,

diff --git a/src/data/keys/configKeys.js b/src/data/keys/configKeys.js
@@ -2,9 +2,10 @@ export const KEY = 'config';
 
 // Properties
 export const API_BASE_URL = 'apiBaseUrl';
+export const CURRENCY = 'currency';
 export const LOCALE = 'locale';
 export const PLATFORM = 'platform';
-export const CURRENCY = 'currency';
+export const SHOW_PRICES = 'showPrices';
 export const SHOW_PRICE_SURCHARGE = 'showPriceSurcharge';
 
 export const PACKAGE_TYPE = 'packageType';

diff --git a/src/delivery-options/components/RecursiveForm/RecursiveForm.vue b/src/delivery-options/components/RecursiveForm/RecursiveForm.vue
@@ -65,13 +65,13 @@
           id: `${mutableOption.name}__${mutableOption.component.name}`,
           choice: choice.name,
         }"
-        :colspan="validChoices.length <= 1 ? null : !!choice.price ? 1 : 2"
+        :colspan="validChoices.length <= 1 ? null : (hasPrice(choice) ? 1 : 2)"
         :data="choice"
         :is-selected="isSelected(choice)" />
 
       <td
         v-else
-        :colspan="validChoices.length <= 1 ? null : !!choice.price ? 1 : 2">
+        :colspan="validChoices.length <= 1 ? null : (hasPrice(choice) ? 1 : 2)">
         <label :for="`${$classBase}__${mutableOption.name}--${choice.name}`">
           <img
             v-if="choice.hasOwnProperty('image')"
@@ -87,12 +87,14 @@
             v-text="choice.plainLabel || $configBus.strings[choice.label]" />
           <span
             v-if="!!choice.priceTag && !isSelected(choice)"
+            v-test="'priceTag'"
             :class="`${$classBase}__float--right`"
             v-text="choice.priceTag" />
 
           <component
             :is="isSelected(choice) ? 'strong' : 'span'"
-            v-if="!!choice.price"
+            v-if="hasPrice(choice)"
+            v-test="'price'"
             :class="{
               [`${$classBase}__float--right`]: true,
               [`${$classBase}__text--green`]: $configBus.get(choice, 'price') < 0,
@@ -179,6 +181,7 @@
 import * as EVENTS from '@/config/eventConfig';
 import Loader from '@/delivery-options/components/Loader';
 import PickupOption from '../Pickup/PickupOption';
+import { SHOW_PRICES } from '@/data/keys/configKeys';
 import debounce from 'lodash-es/debounce';
 import { formConfig } from '@/config/formConfig';
 import { formatCurrency } from '@/delivery-options/data/prices/formatCurrency';
@@ -329,6 +332,15 @@ export default {
     selectedChoice() {
       return this.mutableChoices.find((choice) => this.isSelected(choice));
     },
+
+    /**
+     * Whether to render price strings at all.
+     *
+     * @returns {Boolean}
+     */
+    showPrices() {
+      return this.$configBus.isEnabled(SHOW_PRICES);
+    },
   },
 
   /**
@@ -599,6 +611,17 @@ export default {
       this.selected = selected;
     },
 
+    /**
+     * Whether the given choice has a price and should show it.
+     *
+     * @param {Object} choice
+     *
+     * @returns {Boolean}
+     */
+    hasPrice(choice) {
+      return this.$configBus.isEnabled(SHOW_PRICES) && Boolean(choice.price);
+    },
+
     formatCurrency,
   },
 };

diff --git a/src/delivery-options/data/prices/getPriceLabelFromFormConfig.js b/src/delivery-options/data/prices/getPriceLabelFromFormConfig.js
@@ -1,4 +1,4 @@
-import * as CONFIG from "@/data/keys/configKeys";
+import * as CONFIG from '@/data/keys/configKeys';
 import * as STRINGS from '@/data/keys/stringsKeys';
 import { formatCurrency } from '@/delivery-options/data/prices/formatCurrency';
 import { getLowestPriceFromFormConfig } from '@/delivery-options/data/prices/getLowestPriceFromFormConfig';
@@ -16,14 +16,16 @@ import { configBus as realConfigBus } from '@/delivery-options/config/configBus'
  */
 export function getPriceLabelFromFormConfig(formSettings, carrier = null, configBus = realConfigBus) {
   const minimumPrice = getLowestPriceFromFormConfig(formSettings, carrier, configBus);
-  const formattedPrice = formatCurrency(minimumPrice, configBus);
-  const isDiscount = minimumPrice < 0;
+  const showPrices = configBus.get(CONFIG.SHOW_PRICES);
   const showPriceSurcharge = configBus.get(CONFIG.SHOW_PRICE_SURCHARGE);
 
-  if (showPriceSurcharge && minimumPrice === 0) {
+  if (!showPrices || (showPriceSurcharge && minimumPrice === 0)) {
     return null;
   }
 
+  const formattedPrice = formatCurrency(minimumPrice, configBus);
+  const isDiscount = minimumPrice < 0;
+
   if (isDiscount) {
     return `${formattedPrice} ${configBus.strings[STRINGS.DISCOUNT].toLowerCase()}`;
   }

diff --git a/src/sandbox/settings/form.js b/src/sandbox/settings/form.js
@@ -61,14 +61,25 @@ export const createSettings = memoize((platform) => {
       title: GENERAL,
       description: 'general',
       settings: [
+        {
+          key: CONFIG.KEY,
+          name: CONFIG.SHOW_PRICES,
+          component: CToggle,
+        },
         {
           key: CONFIG.KEY,
           name: CONFIG.CURRENCY,
+          conditions: [
+            CONFIG.SHOW_PRICES,
+          ],
         },
         {
           key: CONFIG.KEY,
           name: CONFIG.SHOW_PRICE_SURCHARGE,
           component: CToggle,
+          conditions: [
+            CONFIG.SHOW_PRICES,
+          ],
         },
         {
           key: CONFIG.KEY,
@@ -97,7 +108,6 @@ export const createSettings = memoize((platform) => {
           name: CONFIG.CUTOFF_TIME,
           component: CTimepicker,
         },
-
       ],
     },
     {
@@ -122,6 +132,7 @@ export const createSettings = memoize((platform) => {
               name: CONFIG.PRICE_STANDARD_DELIVERY,
               component: CCurrency,
               conditions: [
+                CONFIG.SHOW_PRICES,
                 inAnyCarrier(CONFIG.ALLOW_DELIVERY_OPTIONS),
               ],
               props: currencyProps,
@@ -151,6 +162,7 @@ export const createSettings = memoize((platform) => {
               name: CONFIG.PRICE_MORNING_DELIVERY,
               component: CCurrency,
               conditions: [
+                CONFIG.SHOW_PRICES,
                 inAnyCarrier(CONFIG.ALLOW_DELIVERY_OPTIONS),
                 inAnyCarrier(CONFIG.ALLOW_MORNING_DELIVERY),
               ],
@@ -181,6 +193,7 @@ export const createSettings = memoize((platform) => {
               name: CONFIG.PRICE_EVENING_DELIVERY,
               component: CCurrency,
               conditions: [
+                CONFIG.SHOW_PRICES,
                 inAnyCarrier(CONFIG.ALLOW_DELIVERY_OPTIONS),
                 inAnyCarrier(CONFIG.ALLOW_EVENING_DELIVERY),
               ],
@@ -257,6 +270,7 @@ export const createSettings = memoize((platform) => {
                   component: CCurrency,
                   props: currencyProps,
                   conditions: [
+                    CONFIG.SHOW_PRICES,
                     inAnyCarrier(CONFIG.ALLOW_ONLY_RECIPIENT),
                   ],
                 },
@@ -285,6 +299,7 @@ export const createSettings = memoize((platform) => {
                   component: CCurrency,
                   props: currencyProps,
                   conditions: [
+                    CONFIG.SHOW_PRICES,
                     inAnyCarrier(CONFIG.ALLOW_SIGNATURE),
                   ],
                 },
@@ -311,12 +326,18 @@ export const createSettings = memoize((platform) => {
               name: CONFIG.PRICE_PACKAGE_TYPE_DIGITAL_STAMP,
               component: CCurrency,
               props: currencyProps,
+              conditions: [
+                CONFIG.SHOW_PRICES,
+              ],
             }),
             ...ifAnyCarrierAllows(ALLOW_PACKAGE_TYPE_MAILBOX, {
               key: CONFIG.KEY,
               name: CONFIG.PRICE_PACKAGE_TYPE_MAILBOX,
               component: CCurrency,
               props: currencyProps,
+              conditions: [
+                CONFIG.SHOW_PRICES,
+              ],
             }),
           ],
         }),
@@ -342,6 +363,7 @@ export const createSettings = memoize((platform) => {
           component: CCurrency,
           props: currencyProps,
           conditions: [
+            CONFIG.SHOW_PRICES,
             inAnyCarrier(CONFIG.ALLOW_PICKUP_LOCATIONS),
           ],
         },

diff --git a/src/sandbox/settings/formParts/stringForm.js b/src/sandbox/settings/formParts/stringForm.js
@@ -52,6 +52,9 @@ export const stringsForm = [
       {
         key: STRINGS.KEY,
         name: STRINGS.FROM,
+        conditions: [
+          CONFIG.SHOW_PRICES,
+        ],
       },
       {
         key: STRINGS.KEY,

diff --git a/src/sandbox/translations/en.js b/src/sandbox/translations/en.js
@@ -90,6 +90,8 @@ export const englishTranslations = {
   [`field.${CONFIG.PRICE_STANDARD_DELIVERY}`]: 'Standard delivery price',
   [`field.${CONFIG.SATURDAY_CUTOFF_TIME}.description`]: `Like the regular "@:field.${CONFIG.CUTOFF_TIME}" setting: This option allows you to indicate the latest cutoff time before an order will still be picked, packed and dispatched on the same/first set dropoff day, taking the dropoff delay into account.`,
   [`field.${CONFIG.SATURDAY_CUTOFF_TIME}`]: 'Saturday cutoff time',
+  [`field.${CONFIG.SHOW_PRICES}.description`]: 'Disable to not show prices anywhere at all.',
+  [`field.${CONFIG.SHOW_PRICES}`]: 'Show prices',
   [`field.${CONFIG.SHOW_PRICE_SURCHARGE}.description`]: 'Enable to show price as surcharge rather than total price.',
   [`field.${CONFIG.SHOW_PRICE_SURCHARGE}`]: 'Show price as surcharge',
 

diff --git a/tests/unit/delivery-options/components/RecursiveForm/RecursiveForm.spec.js b/tests/unit/delivery-options/components/RecursiveForm/RecursiveForm.spec.js
@@ -1,15 +1,22 @@
+import * as CARRIERS from '@/data/keys/carrierKeys';
+import * as CONFIG from '@/data/keys/configKeys';
+import * as PLATFORMS from '@/data/keys/platformKeys';
 import RecursiveForm from '@/delivery-options/components/RecursiveForm/RecursiveForm';
-import { SENDMYPARCEL } from '@/data/keys/platformKeys';
+import { UPDATED_DELIVERY_OPTIONS } from '@/config/eventConfig';
 import { defaultConfiguration } from '@/config/defaultConfiguration';
+import { formConfigDelivery } from '@/config/formConfig';
+import { getPriceLabelFromFormConfig } from '@/delivery-options/data/prices/getPriceLabelFromFormConfig';
+import { mockDeliveryOptions } from '@Tests/unit/delivery-options/mockDeliveryOptions';
 import { mockVue } from '@Tests/unit/delivery-options/mockVue';
 import { mount } from '@vue/test-utils';
+import { waitForEvent } from '@Tests/waitForEvent';
 
 describe('RecursiveForm.vue', () => {
   let component;
 
   beforeAll(() => {
     component = mount(RecursiveForm, {
-      localVue: mockVue(defaultConfiguration(SENDMYPARCEL)),
+      localVue: mockVue(defaultConfiguration(PLATFORMS.SENDMYPARCEL)),
       propsData: {
         option: {
           name: 'carrier',
@@ -28,4 +35,56 @@ describe('RecursiveForm.vue', () => {
     expect(formatCurrency(24.50)).toBe('€ 24,50');
     expect(formatCurrency(20000)).toBe('€ 20.000,00');
   });
+
+  it('handles "showPrices: false" properly', async() => {
+    expect.assertions(2);
+    const wrapper = mockDeliveryOptions({
+      [CONFIG.KEY]: {
+        [CONFIG.PLATFORM]: PLATFORMS.SENDMYPARCEL,
+        [CONFIG.SHOW_PRICES]: false,
+        [CONFIG.CARRIER_SETTINGS]: {
+          [CARRIERS.BPOST]: {
+            [CONFIG.PRICE_MORNING_DELIVERY]: 1.23,
+            [CONFIG.PRICE_STANDARD_DELIVERY]: 4.56,
+          },
+        },
+      },
+    });
+
+    const priceLabel = getPriceLabelFromFormConfig(
+      formConfigDelivery,
+      null,
+      wrapper.vm.$configBus,
+    );
+    expect(priceLabel).toEqual(null);
+
+    await waitForEvent(UPDATED_DELIVERY_OPTIONS);
+    expect(wrapper.findAll('[data-test-id="price"]')).toHaveLength(0);
+  });
+
+  it('handles "showPrices: true" properly', async() => {
+    expect.assertions(2);
+    const wrapper = mockDeliveryOptions({
+      [CONFIG.KEY]: {
+        [CONFIG.PLATFORM]: PLATFORMS.SENDMYPARCEL,
+        [CONFIG.CARRIER_SETTINGS]: {
+          [CARRIERS.BPOST]: {
+            [CONFIG.ALLOW_MORNING_DELIVERY]: true,
+            [CONFIG.PRICE_MORNING_DELIVERY]: 1.23,
+            [CONFIG.PRICE_STANDARD_DELIVERY]: 4.56,
+          },
+        },
+      },
+    });
+
+    const priceLabel = getPriceLabelFromFormConfig(
+      formConfigDelivery,
+      null,
+      wrapper.vm.$configBus,
+    );
+    expect(priceLabel).toEqual('Vanaf € 0,00');
+
+    await waitForEvent(UPDATED_DELIVERY_OPTIONS);
+    expect(wrapper.findAll('[data-test-id="price"]')).toHaveLength(2);
+  });
 });
diff --git a/tests/unit/delivery-options/prices.spec.js b/tests/unit/delivery-options/prices.spec.js
@@ -59,7 +59,7 @@ describe('price logic', () => {
     expect(priceBePostNl).toEqual(3.59);
 
     // Evening delivery
-    expect(priceNlPostNl).toEqual(3.20);
+    expect(priceNlPostNl).toEqual(3.2);
   });
 
   it('gets the correct lowest pickup price for a single carrier', () => {