Merge pull request #2307 from Safelite/feature/CASH-153

Feature/CASH-153 - put new date picker behind experiment setting

src/experiment-components/date-picker-2.vue

@@ -99,8 +99,8 @@
 // Supporting files
 import loader from "@/ux-components/loader/loader";
 import store from "@/store";
-import { TIMINGFUNC_MAP, BUFFER_OFFSET, MONTHS_OF_YEAR } from "./mixins/constants";
+import { TIMINGFUNC_MAP, BUFFER_OFFSET, MONTHS_OF_YEAR } from "@/digital-components/date-picker/mixins/constants";
-import { selectableDaysOptions, requiredParameter, forceTwoDigitString } from "./mixins/helpers";
+import { selectableDaysOptions, requiredParameter, forceTwoDigitString } from "@/digital-components/date-picker/mixins/helpers";
 import {
     convertDateToDateString,
     convertDateStringToDate,

src/layouts/schedule/schedule.spec.js

@@ -7,6 +7,7 @@ import { getMountOptions } from "@/helpers/unit-test-helper.js";
 import store from "@/store";
 import router from "@/router";
 import baseMixin from "../../mixins/base-mixin";
+import { experimentSettings } from "../../constants/experiments";
 
 // Mock basemixin
 jest.mock("@/mixins/base-mixin.js", () => ({
@@ -177,6 +178,7 @@ beforeEach(() => {
             glassParts: [],
             supportingItems: [],
         },
+        experimentSettings: {},
     };
 });
 afterEach(() => {

src/layouts/schedule/schedule.vue

@@ -18,7 +18,18 @@
                             marginTopSizeOverride="1" />
                     </template>
                     <locationAlerts cmsWidgetPrefix="LocationAlert-" ref="locationAlerts" />
+                    <datePicker
+                        v-if="!isPricingByDayExperiment"
+                        customComponentId="dateQuestion"
+                        selectableDatesSetting="custom"
+                        ref="datePicker"
+                        v-model="selectedDate"
+                        class="text-link-small"
+                        :customSelectableDatesCallback="getAvailableDatesMethod"
+                        validationRules="date-required"
+                        @date-clicked="openInshopTimeSlotsModal" />
                     <datePicker2
+                        v-if="isPricingByDayExperiment"
                         customComponentId="dateQuestion"
                         selectableDatesSetting="custom"
                         ref="datePicker"
@@ -69,7 +80,8 @@ import navbar from "@/fmg-components/nav-bar/nav-bar";
 import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
 import loadingModal from "@/fmg-components/loading-modal/loading-modal.vue";
 import { Form, defineRule } from "vee-validate";
-import datePicker2 from "@/digital-components/date-picker/date-picker-2";
+import datePicker from "@/digital-components/date-picker/date-picker";
+import datePicker2 from "@/experiment-components/date-picker-2";
 import locationAlerts from "@/layouts/schedule/location-alerts/location-alerts";
 import timeSlotModalQuestion from "./time-slot-modal-question/time-slot-modal-question";
 import textBlock from "@/digital-components/text-block/text-block";
@@ -91,6 +103,8 @@ import { AppointmentTypeStrings, PREMIUM_FEE_PART_TYPE } from "@/constants/sched
 import { errorMessages } from "@/constants/error-messages";
 import { required } from "@/helpers/validation-rules";
 import store from "@/store";
+import experimentMixin from "@/mixins/experiment-mixin.js";
+import { experimentSettings } from "@/constants/experiments";
 
 // DEFINE VALIDATION RULES
 defineRule("date-required", required(errorMessages.DATE_REQUIRED));
@@ -301,6 +315,13 @@ export default {
                 (selectableDate) => selectableDate.date === this.selectedDate
             );
         },
+        isPricingByDayExperiment() {
+            return (
+                experimentMixin.methods
+                    .getSettingValue(experimentSettings.PRICING_BY_DAY)
+                    ?.toLowerCase() === "true"
+            );
+        },
     },
     methods: {
         splitCopyOnCMSPlaceHolder,
@@ -537,6 +558,7 @@ export default {
         funnelSubHeader,
         Form,
         loadingModal,
+        datePicker,
         datePicker2,
         locationAlerts,
         timeSlotModalQuestion,