add big truck no service alert to vin/license/address lookup, remove bailout

src/constants/vehicle-lookup-alert-types.js

@@ -2,7 +2,8 @@ const vehicleLookupAlertTypes = Object.freeze({
     NOT_FOUND: 'notFound',
     NOT_MATCHED: 'notMatched',
     TWO_IDENTICAL_YMM_MATCHED: 'twoIdenticalYMMMatched',
-    PERFECT_MATCH: 'perfectMatch'
+    PERFECT_MATCH: 'perfectMatch',
+    NO_SERVICE: 'noService'
 });
 
 export default vehicleLookupAlertTypes;

src/layouts/address-lookup/address-lookup.vue

@@ -53,6 +53,13 @@
                         cmsWidgetName="AlertVinLookupsByHomeAddressNotAllowedWidget"
                         alertClass="alert-danger"
                         :isDismissible="false" />
+                    <alert
+                        v-if="displayNoServiceAlert"
+                        ref="AlertNoService"
+                        class="mt-5"
+                        cmsWidgetName="AlertNoServiceWidget"
+                        alertClass="alert-danger"
+                        :isDismissable="false" />
                     <customerQuestions
                         ref="customerQuestions"
                         v-model="customerQuestions" />
@@ -137,7 +144,8 @@ export default {
             isCarIdDifferent: false,
             isSelectedGlassAvailableForVehicle: true,
             customAlertData: {},
-            forwardButtonCarStyle: ''
+            forwardButtonCarStyle: '',
+            displayNoServiceAlert: false
         };
     },
     computed: {
@@ -255,6 +263,15 @@ export default {
                 return this.$refs.siteFooter.removeLoader();
             }
 
+            // Check if vehicle is a non-servicable big truck
+            if (resultMap.vinLookupResponse.isBigTruck && !resultMap.vinLookupResponse.canSafeliteService) {
+                this.displayNoServiceAlert = true;
+                this.resetVehicleFromLookup();
+                this.$refs.siteFooter.disableForwardButton();
+                this.$refs.siteFooter.removeLoader();
+                return;
+            }
+
             const carsFound = resultMap.vinLookupResponse.vinVehicles;
 
             // Handle cases for different amounts of VINS found for the address.
@@ -370,6 +387,7 @@ export default {
             this.displayVinNotFoundAlert = false;
             this.displayMatchedDifferentVehicleAlert = false;
             this.displayVinLookupByHomeAddressNotAllowedAlert = false;
+            this.displayNoServiceAlert = false;
             this.$refs.siteFooter.enableForwardAction();
         }
     }

src/layouts/license-plate-lookup/license-plate-lookup.vue

@@ -47,6 +47,13 @@
                         :manualCopy="AlertMatchedTwoIdenticalYMMVehicleBody"
                         alertClass="alert-warning"
                         :isDismissible="false" />
+                    <alert
+                        v-if="displayNoServiceAlert"
+                        ref="AlertNoService"
+                        class="mt-5 mb-5"
+                        cmsWidgetName="AlertNoServiceWidget"
+                        alertClass="alert-danger"
+                        :isDismissable="false" />
                     <textboxQuestion
                         id="license-plate-question-wrapper"
                         v-model="licensePlate"
@@ -156,7 +163,8 @@ export default {
             isCarIdDifferent: false,
             customAlertData: {},
             isSelectedGlassAvailableForVehicle: true,
-            forwardButtonCarStyle: ''
+            forwardButtonCarStyle: '',
+            displayNoServiceAlert: false
         };
     },
     computed: {
@@ -299,6 +307,14 @@ export default {
                 return this.$refs.siteFooter.removeLoader();
             }
 
+            // Check if vehicle is a non-servicable big truck
+            if (vehicleFromLookup.isBigTruck && !vehicleFromLookup.canSafeliteService) {
+                this.displayNoServiceAlert = true;
+                this.resetVehicleFromLookup();
+                this.$refs.siteFooter.disableForwardButton();
+                return this.$refs.siteFooter.removeLoader();
+            }
+
             // Save vehicle, license plate, and registration information
             useMainStore().saveRegistrationLicensePlateLookup({
                 isSelectedGlassAvailableForVehicle: this.isSelectedGlassAvailableForVehicle,
@@ -333,6 +349,7 @@ export default {
         resetWarningsAndErrors() {
             this.displayVinNotFoundAlert = false;
             this.displayMatchedDifferentVehicleAlert = false;
+            this.displayNoServiceAlert = false;
         }
     }
 };

src/layouts/vin-lookup/vin-lookup-alerts/no-service-alert/no-service-alert.vue

@@ -0,0 +1,26 @@
+<template>
+    <alert
+      id="no-service-alert"
+      alertClass="alert-danger"
+      cmsWidgetName="AlertNoServiceWidget"
+      aria-label="no-service-alert" />
+  </template>
+<script>
+import alert from '@/ux-components/alert/alert.vue';
+
+export default {
+    name: 'no-service-alert',
+    components: {
+        alert
+    },
+    inject: ['vehicleFromLookup']
+};
+</script>
+<style>
+/**
+  Override wrong margin-bottom rule in the Alert component.
+*/
+#no-service-alert p:last-of-type {
+  margin-bottom: 0 !important;
+}
+</style>

src/layouts/vin-lookup/vin-lookup-alerts/vin-lookup-alerts.vue

@@ -10,6 +10,8 @@
       v-else-if="isVehicleNotMatchedVisible" />
     <perfectMatchAlert
       v-else-if="isPerfectMatchVisible" />
+    <noServiceAlert
+      v-else-if="isNoServiceVisible" />
   </div>
 </template>
 <script>
@@ -19,6 +21,7 @@ import vehicleNotMatchedAlert from '@/layouts/vin-lookup/vin-lookup-alerts/vehic
 import twoIdenticalYMMVehicleAlert from
     '@/layouts/vin-lookup/vin-lookup-alerts/two-identical-ymm-vehicle-alert/two-identical-ymm-vehicle-alert.vue';
 import perfectMatchAlert from '@/layouts/vin-lookup/vin-lookup-alerts//perfect-match-alert/perfect-match-alert.vue';
+import noServiceAlert from './no-service-alert/no-service-alert.vue';
 
 export default {
     name: 'vin-lookup-alerts',
@@ -26,7 +29,8 @@ export default {
         vehicleNotFoundAlert,
         vehicleNotMatchedAlert,
         twoIdenticalYMMVehicleAlert,
-        perfectMatchAlert
+        perfectMatchAlert,
+        noServiceAlert
     },
     props: {
         activeAlertType: {
@@ -51,6 +55,9 @@ export default {
         isPerfectMatchVisible() {
             return this.activeAlertType === vehicleLookupAlertTypes.PERFECT_MATCH;
         },
+        isNoServiceVisible() {
+            return this.activeAlertType === vehicleLookupAlertTypes.NO_SERVICE;
+        },
         wrapperCssClass() {
             return {
                 'mb-5': this.activeAlertType !== null

src/layouts/vin-lookup/vin-lookup.vue

@@ -196,14 +196,15 @@ export default {
                     return;
                 }
 
-                if (!vehicleLookupResponse.data.canSafeliteService) {
+                // Check if vehicle is a non-servicable big truck
-                    this.mainStore.setBailout(bailoutMessage.HeavyTruckVehicle(vehicleLookupResponse.data.carId));
+                if (vehicleLookupResponse.data.isBigTruck && !vehicleLookupResponse.data.canSafeliteService) {
-                    this.$router.navigate(this.navigationScenarios.CLICKED_FORWARD_WITH_BAILOUT, this.$route);
+                    this.activeVehicleLookupAlertType = vehicleLookupAlertTypes.NO_SERVICE;
+                    this.resetVehicleFromLookup();
+                    this.$refs.siteFooter.disableForwardButton();
+                    this.$refs.siteFooter.removeLoader();
                     return;
                 }
 
-                this.mainStore.resetBailout();
-
                 // Add vin bcs the response from the service doesn't contain vin
                 this.vehicleFromLookup = Object.assign(
                     vehicleLookupResponse.data,