refactor: change the pickup locations views strings and setting

src/components/Pickup/Pickup.vue

@@ -2,26 +2,26 @@
   <td>
     <div>
       <button
-        @click="() => select('list')"
+        @click="selected = views.list"
         v-text="$configBus.strings.pickupLocationsListButton" />
       <button
-        @click="() => select('map')"
+        @click="selected = views.map"
         v-text="$configBus.strings.pickupLocationsMapButton" />
     </div>
 
     <transition name="shove">
       <keep-alive>
         <div :class="$classBase + '__pickup-locations--list'">
           <recursive-form
-            v-if="selected === 'list'"
+            v-if="selected === views.list"
             :option="listOption" />
         </div>
       </keep-alive>
     </transition>
     <transition name="shove">
       <keep-alive>
         <leaflet
-          v-if="selected === 'map'"
+          v-if="selected === views.map"
           :data="data"
           @update="emitUpdate" />
       </keep-alive>
@@ -31,11 +31,14 @@
 
 <script>
 import * as EVENTS from '@/config/data/eventConfig';
-import { FEATURE_MAX_PAGE_ITEMS, FEATURE_PICKUP_LOCATIONS_MAP } from '@/config/data/settingsConfig';
+import * as SETTINGS from '@/config/data/settingsConfig';
 import Leaflet from '@/components/Pickup/Map/Leaflet';
 import { PICKUP_LOCATION } from '@/config/data/formConfig';
 import PickupOption from '@/components/Pickup/PickupOption';
 
+const MAP_VIEW = 'map';
+const LIST_VIEW = 'list';
+
 export default {
   name: 'Pickup',
   components: { Leaflet },
@@ -47,27 +50,42 @@ export default {
   },
   data() {
     return {
-      selected: this.$configBus.get(FEATURE_PICKUP_LOCATIONS_MAP) ? 'map' : 'list',
+      selected: this.getDefaultMapView(),
       listOption: {
         name: PICKUP_LOCATION,
         type: 'radio',
         component: PickupOption,
-        pagination: this.$configBus.get(FEATURE_MAX_PAGE_ITEMS),
+        pagination: this.$configBus.get(SETTINGS.FEATURE_MAX_PAGE_ITEMS),
         choices: this.data.choices,
       },
+      views: {
+        map: MAP_VIEW,
+        list: LIST_VIEW,
+      },
     };
   },
   methods: {
-    select(item) {
-      this.selected = item;
-    },
-
     /**
      * @param {Object} event - Event object.
      */
     emitUpdate(event) {
       this.$configBus.$emit(EVENTS.UPDATE, event);
     },
+
+    /**
+     * Get the default map view setting or fall back to default.
+     *
+     * @returns {String}
+     */
+    getDefaultMapView() {
+      const setting = this.$configBus.get(SETTINGS.FEATURE_PICKUP_LOCATIONS_DEFAULT_VIEW);
+
+      if (setting && this.views.includes(setting)) {
+        return setting;
+      }
+
+      return this.views.map;
+    },
   },
 };
 </script>

src/config/data/defaultConfig.js

@@ -35,7 +35,7 @@ const baseConfig = {
     [SETTINGS.PRICE_STANDARD_DELIVERY]: 0,
 
     [SETTINGS.FEATURE_ALLOW_RETRY]: true,
-    [SETTINGS.FEATURE_PICKUP_LOCATIONS_MAP]: false,
+    [SETTINGS.FEATURE_PICKUP_LOCATIONS_DEFAULT_VIEW]: 'map',
     [SETTINGS.FEATURE_MAX_PAGE_ITEMS]: 5,
 
     /**

src/config/data/locales/be/config.js

@@ -15,7 +15,7 @@ export const config = {
   /**
    * For the same reason as above, prefer the map view to the list view.
    */
-  [SETTINGS.FEATURE_PICKUP_LOCATIONS_MAP]: true,
+  [SETTINGS.FEATURE_PICKUP_LOCATIONS_DEFAULT_VIEW]: true,
 
   /**
    * Show more pickup items by default for BE because it doesn't show the distance.

src/config/data/settingsConfig.js

@@ -40,25 +40,21 @@ export const CARRIER_SETTINGS = 'carrierSettings';
  */
 export const FEATURE_ALLOW_RETRY = 'allowRetry';
 
-/**
- * Enable a map for the pickup locations instead of the default list.
- *
- * @type {String}
- */
-export const FEATURE_PICKUP_LOCATIONS_MAP = 'pickupLocationsMap';
-
-/**
- * Tile layer data for use with the pickup locations map.
- *
- * @type {String}
+/*
+ * The default view of pickup locations.
  */
-export const PICKUP_LOCATIONS_MAP_TILE_LAYER_DATA = 'pickupLocationsMapTileLayerData';
+export const FEATURE_PICKUP_LOCATIONS_DEFAULT_VIEW = 'pickupLocationsDefaultView';
 
 /*
  * Show distance under each pickup location if true. Otherwise shows street name and number.
  */
 export const FEATURE_PICKUP_SHOW_DISTANCE = 'pickupShowDistance';
 
+/*
+ * Tile layer data for use with the pickup locations map.
+ */
+export const PICKUP_LOCATIONS_MAP_TILE_LAYER_DATA = 'pickupLocationsMapTileLayerData';
+
 /*
  * Max amount of pickup locations shown.
  */

types/index.d.ts

@@ -141,8 +141,8 @@ declare namespace MyParcelDeliveryOptions {
 
     // Feature toggles
     allowRetry: Boolean
+    pickupLocationsDefaultView: 'map' | 'list'
     pickupShowDistance: Boolean
-    pickupLocationsMap: Boolean
 
     pickupLocationsMapTileLayerData: MapTileLayerData
   }