From 8c64b13c6d2158c252f9b112bb1c6e980f121478 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Thu, 24 Aug 2023 10:47:54 -0400
Subject: [PATCH 01/20] front end for endorsements page

---
 .../endorsements-page/endorsements-page.vue   | 70 +++++++++++++++++++
 src/router/router-constants/issPage-values.js |  1 +
 src/router/router-constants/routing-table.js  | 16 ++++-
 3 files changed, 86 insertions(+), 1 deletion(-)
 create mode 100644 src/layouts/endorsements-page/endorsements-page.vue

diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/endorsements-page/endorsements-page.vue
new file mode 100644
index 00000000..1e2513b4
--- /dev/null
+++ b/src/layouts/endorsements-page/endorsements-page.vue
@@ -0,0 +1,70 @@
+<template>
+    <Form
+        ref="theForm"
+        v-slot="{ meta }"
+        @submit="onSubmit"
+        @invalidSubmit="onInvalidSubmit">
+        <div class="page-container-grouped-styles">
+            <div class="fade-on-route-transition position-relative">
+                <siteHeader cmsWidgetName="SiteHeaderWidget" />
+                <div class="container-fluid pb-2">
+                    <siteFooter
+                    ref="siteFooter"
+                    cmsWidgetName="SiteFooterWidget"
+                    :isForwardActionDisabled="!meta.valid"
+                    @ForwardClicked="forwardButtonAction"
+                    @backClicked="backButtonAction" />
+                </div>
+            </div>
+        </div>
+    </Form>
+</template>
+<script>
+// Components
+import siteHeader from '@/iss-components/site-header/site-header.vue';
+import siteFooter from '@/iss-components/site-footer/site-footer.vue';
+// Supporting files
+import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
+import { settleAllPromises } from '@/helpers/layout-helper';
+import { Form } from 'vee-validate';
+import BaseFormMixin from '@/mixins/base-form-mixin.js';
+
+export default {
+    name: 'endorsements-page',
+    components: {
+        siteHeader,
+        siteFooter,
+        // eslint-disable-next-line vue/no-reserved-component-names
+        Form
+    },
+    mixins: [BaseFormMixin],
+    async beforeRouteEnter(to, from, next) {
+        // Call APIs
+        const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
+        // Settle promises and get results
+        const promiseResultMap = [
+            {
+                resultKey: 'cmsContent',
+                promise: cmsContentPromise
+            }];
+            // use resultMap to populate layout content.
+        const resultMap = await settleAllPromises(promiseResultMap);
+        next((vm) => {
+            vm.setCmsContent(resultMap.cmsContent);
+        });
+    },
+    methods:
+        {
+            backButtonAction() {
+                this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
+            },
+            forwardButtonAction() {
+                return this.navigateForward();
+            },
+            navigateForward() {
+                this.$router.navigate(this.navigationScenarios.CLICKED_FORWARD,
+                    this.$route);
+            }
+        }
+};
+</script>
diff --git a/src/router/router-constants/issPage-values.js b/src/router/router-constants/issPage-values.js
index 9ddfab8c..4c98b188 100644
--- a/src/router/router-constants/issPage-values.js
+++ b/src/router/router-constants/issPage-values.js
@@ -8,6 +8,7 @@ const issPageValues = Object.freeze({
     BAILOUT_PAGE: 'bailout-page',
     CAPABILITY_QUESTIONS: 'capability-questions',
     CONTACT_DETAILS: 'contact-details',
+    ENDORSEMENTS_PAGE: 'endorsements-page',
     ESTIMATE: 'estimate',
     COVERAGE_STATEMENT: 'coverage-statement',
     LICENSE_PLATE_LOOKUP: 'license-plate-lookup',
diff --git a/src/router/router-constants/routing-table.js b/src/router/router-constants/routing-table.js
index a4093eaf..b61db6d8 100644
--- a/src/router/router-constants/routing-table.js
+++ b/src/router/router-constants/routing-table.js
@@ -603,7 +603,21 @@ const routingTable = () => [
                 destinationIssPageValue: issPageValues.BAILOUT_CONFIRMATION
             }
         ]
-    }
+    },
+    {
+        issPageValue: issPageValues.ENDORSEMENTS_PAGE,
+        maps: [
+            {
+                scenario: navigationScenarios.CLICKED_BACK,
+                destinationIssPageValue: issPageValues.POLICY_VEHICLES
+            },
+            {
+                scenario: navigationScenarios.CLICKED_FORWARD,
+                destinationIssPageValue: issPageValues.VEHICLE_DAMAGE
+            }
+        ]
+    },
+
 ];
 
 export { routingTable };

From b523e2c976beda9be6daaf2c259776d69fbc4464 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Thu, 24 Aug 2023 11:57:00 -0400
Subject: [PATCH 02/20] add subheader to page

---
 src/layouts/endorsements-page/endorsements-page.vue | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/endorsements-page/endorsements-page.vue
index 1e2513b4..dc92f80a 100644
--- a/src/layouts/endorsements-page/endorsements-page.vue
+++ b/src/layouts/endorsements-page/endorsements-page.vue
@@ -7,6 +7,7 @@
         <div class="page-container-grouped-styles">
             <div class="fade-on-route-transition position-relative">
                 <siteHeader cmsWidgetName="SiteHeaderWidget" />
+                <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />
                 <div class="container-fluid pb-2">
                     <siteFooter
                     ref="siteFooter"
@@ -22,6 +23,7 @@
 <script>
 // Components
 import siteHeader from '@/iss-components/site-header/site-header.vue';
+import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
 import siteFooter from '@/iss-components/site-footer/site-footer.vue';
 // Supporting files
 import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
@@ -33,6 +35,7 @@ export default {
     name: 'endorsements-page',
     components: {
         siteHeader,
+        siteSubHeader,
         siteFooter,
         // eslint-disable-next-line vue/no-reserved-component-names
         Form

From 606b43ef8e316baa855cff0eb94e8221a317d60d Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Thu, 24 Aug 2023 11:57:23 -0400
Subject: [PATCH 03/20] navigation from policy-vehicles to endorsements

---
 src/layouts/policy-vehicles/policy-vehicles.vue     | 10 ++++++++++
 src/router/router-constants/navigation-scenarios.js |  1 +
 src/router/router-constants/routing-table.js        |  7 ++++++-
 3 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/src/layouts/policy-vehicles/policy-vehicles.vue b/src/layouts/policy-vehicles/policy-vehicles.vue
index e10df300..dcd70af7 100644
--- a/src/layouts/policy-vehicles/policy-vehicles.vue
+++ b/src/layouts/policy-vehicles/policy-vehicles.vue
@@ -118,6 +118,10 @@ export default {
                 ? vehicle?.coverages[0].deductible
                 : 0;
         },
+        endorsementsForSelectedVehicle() {
+            // hardcoded until endorsements service is ready
+            return true;
+        },
         repairWaivedForSelectedVehicle() {
             const vehicle = this.policyVehicles.find((policyVehicle) =>
                 policyVehicle.vin === this.selectedVehicleVin);
@@ -148,6 +152,7 @@ export default {
                     // save selected vehicle to the store
                     this.mainStore.updateVehicle(vehicle.data);
                     this.displayGeneric = false;
+                    console.log(this.endorsementsForSelectedVehicle);
                 }
             }
         }
@@ -194,6 +199,11 @@ export default {
                             this.$route,
                             {},
                             {});
+                } else if (!!this.endorsementsForSelectedVehicle) {
+                    this.$router.navigate(this.navigationScenarios.CLICKED_FORWARD_WITH_ENDORSEMENTS, 
+                        this.$route,
+                        {},
+                        {});
                 } else {
                     this.$router.navigate(this.navigationScenarios.CLICKED_FORWARD_LISTED_VEHICLE,
                         this.$route,
diff --git a/src/router/router-constants/navigation-scenarios.js b/src/router/router-constants/navigation-scenarios.js
index 934065c1..2d2d4be3 100644
--- a/src/router/router-constants/navigation-scenarios.js
+++ b/src/router/router-constants/navigation-scenarios.js
@@ -24,6 +24,7 @@ const navigationScenarios = {
     // Policy Vehicle
     CLICKED_FORWARD_LISTED_VEHICLE: 'CLICKED_FORWARD_LISTED_VEHICLE',
     CLICKED_FORWARD_NON_LISTED_VEHICLE: 'CLICKED_FORWARD_NON_LISTED_VEHICLE',
+    CLICKED_FORWARD_WITH_ENDORSEMENTS: 'CLICKED_FORWARD_WITH_ENDORSEMENTS',
 
     // Vehicle Damage
     CLICKED_FORWARD_WITH_REPAIR: 'CLICKED_FORWARD_WITH_REPAIR',
diff --git a/src/router/router-constants/routing-table.js b/src/router/router-constants/routing-table.js
index b61db6d8..a0622319 100644
--- a/src/router/router-constants/routing-table.js
+++ b/src/router/router-constants/routing-table.js
@@ -392,7 +392,12 @@ const routingTable = () => [
             {
                 scenario: navigationScenarios.CLICKED_FORWARD_WITH_BAILOUT,
                 destinationIssPageValue: issPageValues.BAILOUT_PAGE
-            }
+            },
+            {
+                scenario: navigationScenarios.CLICKED_FORWARD_WITH_ENDORSEMENTS,
+                destinationIssPageValue: issPageValues.ENDORSEMENTS_PAGE
+            },
+
         ]
     },
     {

From ccda6519419b584e88593b8ad144ad818d73bf0c Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Thu, 24 Aug 2023 14:37:23 -0400
Subject: [PATCH 04/20] endorsements WIP

---
 .../endorsements-page/endorsements-page.vue   | 67 ++++++++++++++++++-
 1 file changed, 66 insertions(+), 1 deletion(-)

diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/endorsements-page/endorsements-page.vue
index dc92f80a..720b86f9 100644
--- a/src/layouts/endorsements-page/endorsements-page.vue
+++ b/src/layouts/endorsements-page/endorsements-page.vue
@@ -7,7 +7,25 @@
         <div class="page-container-grouped-styles">
             <div class="fade-on-route-transition position-relative">
                 <siteHeader cmsWidgetName="SiteHeaderWidget" />
-                <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" />
+                <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" class="mt-5 mb-5 endorsements" />
+                <buttonQuestion
+                    v-model="schoolPropertyAnswer"
+                    cmsWidgetName="SchoolPropertyQuestion"
+                    :questionText="schoolPropertyQuestionText"
+                    :answers="schoolPropertyAnswersFromCms"
+                    buttonTypeString="listButton"
+                    isRequired
+                    :validationRules="rules.selectionRequired">
+                </buttonQuestion>
+                <buttonQuestion
+                    v-model="parkingLotAnswer"
+                    cmsWidgetName="ParkingLotQuestion"
+                    :questionText="parkingLotQuestionText"
+                    :answers="parkingLotAnswersFromCms"
+                    buttonTypeString="listButton"
+                    isRequired
+                    :validationRules="rules.selectionRequired">
+                </buttonQuestion>
                 <div class="container-fluid pb-2">
                     <siteFooter
                     ref="siteFooter"
@@ -25,11 +43,13 @@
 import siteHeader from '@/iss-components/site-header/site-header.vue';
 import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
 import siteFooter from '@/iss-components/site-footer/site-footer.vue';
+import buttonQuestion from '@/digital-components/button-question/button-question.vue';
 // Supporting files
 import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
 import { settleAllPromises } from '@/helpers/layout-helper';
 import { Form } from 'vee-validate';
 import BaseFormMixin from '@/mixins/base-form-mixin.js';
+import globalRules from '@/constants/global-rules.js';
 
 export default {
     name: 'endorsements-page',
@@ -37,6 +57,7 @@ export default {
         siteHeader,
         siteSubHeader,
         siteFooter,
+        buttonQuestion,
         // eslint-disable-next-line vue/no-reserved-component-names
         Form
     },
@@ -56,6 +77,29 @@ export default {
             vm.setCmsContent(resultMap.cmsContent);
         });
     },
+    data() {
+        return {
+            schoolPropertyAnswer: '',
+            parkingLotAnswer: '',
+            rules: {
+                selectionRequired: globalRules.OPTION_REQUIRED
+            }
+        }
+    },
+    computed: {
+        schoolPropertyQuestionText() {
+            return this.getCmsContent('SchoolPropertyQuestion', 'QuestionText');
+        },
+        schoolPropertyAnswersFromCms() {
+            return this.getCmsContent('SchoolPropertyQuestion', 'Answers');
+        },
+        parkingLotQuestionText() {
+            return this.getCmsContent('ParkingLotQuestion', 'QuestionText');
+        },
+        parkingLotAnswersFromCms() {
+            return this.getCmsContent('ParkingLotQuestion', 'Answers');
+        },
+    },
     methods:
         {
             backButtonAction() {
@@ -71,3 +115,24 @@ export default {
         }
 };
 </script>
+
+<style lang="scss" scoped>
+:deep .endorsements {
+    .subheader-primary {
+        span {
+            font-size: 20px;
+            line-height: 32px;
+        }
+    }
+    .subheader-secondary {
+        p {
+            margin-top: 0.5rem;
+            font-size: 14px;
+            line-height: 24px;
+        }
+        span {
+            text-align: left;
+        }
+    }
+}
+</style>

From 25fa11629b3e66789d958f4dda4ddd4818af945a Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Thu, 24 Aug 2023 14:50:22 -0400
Subject: [PATCH 05/20] commit

---
 src/layouts/endorsements-page/endorsements-page.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/endorsements-page/endorsements-page.vue
index 720b86f9..46dac883 100644
--- a/src/layouts/endorsements-page/endorsements-page.vue
+++ b/src/layouts/endorsements-page/endorsements-page.vue
@@ -8,6 +8,7 @@
             <div class="fade-on-route-transition position-relative">
                 <siteHeader cmsWidgetName="SiteHeaderWidget" />
                 <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" class="mt-5 mb-5 endorsements" />
+                <div class="container-fluid pb-2">
                 <buttonQuestion
                     v-model="schoolPropertyAnswer"
                     cmsWidgetName="SchoolPropertyQuestion"
@@ -26,7 +27,6 @@
                     isRequired
                     :validationRules="rules.selectionRequired">
                 </buttonQuestion>
-                <div class="container-fluid pb-2">
                     <siteFooter
                     ref="siteFooter"
                     cmsWidgetName="SiteFooterWidget"

From 7c06add8e3c14ddb70c6b4872119e54cbacd6c51 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Mon, 28 Aug 2023 11:12:25 -0400
Subject: [PATCH 06/20] WIP

---
 .../endorsements-page/endorsements-page.vue   | 40 +++++++++++++++++--
 1 file changed, 36 insertions(+), 4 deletions(-)

diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/endorsements-page/endorsements-page.vue
index 46dac883..17410a15 100644
--- a/src/layouts/endorsements-page/endorsements-page.vue
+++ b/src/layouts/endorsements-page/endorsements-page.vue
@@ -9,24 +9,39 @@
                 <siteHeader cmsWidgetName="SiteHeaderWidget" />
                 <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" class="mt-5 mb-5 endorsements" />
                 <div class="container-fluid pb-2">
-                <buttonQuestion
+                <div
+                    v-for="(q, i) in questions"
+                    :key="i"
+                    class="questionBlock">
+                        <buttonQuestion
+                            class="radioQuestion"
+                            :questionText="q.questionText"
+                            :answers="q.answers"
+                            :modelValue="q.answerSelected"
+                            isRequired
+                            :validationRules="validationRules"
+                            @update:modelValue="handleAnswer(q, $event)" />
+                </div>  
+                <!-- <buttonQuestion
                     v-model="schoolPropertyAnswer"
+                    class="radioQuestion"
                     cmsWidgetName="SchoolPropertyQuestion"
                     :questionText="schoolPropertyQuestionText"
                     :answers="schoolPropertyAnswersFromCms"
-                    buttonTypeString="listButton"
+                    buttonTypeString="listButtonHorizontal"
                     isRequired
                     :validationRules="rules.selectionRequired">
                 </buttonQuestion>
                 <buttonQuestion
                     v-model="parkingLotAnswer"
+                    class="radioQuestion"
                     cmsWidgetName="ParkingLotQuestion"
                     :questionText="parkingLotQuestionText"
                     :answers="parkingLotAnswersFromCms"
-                    buttonTypeString="listButton"
+                    buttonTypeString="listButtonHorizontal"
                     isRequired
                     :validationRules="rules.selectionRequired">
-                </buttonQuestion>
+                </buttonQuestion> -->
                     <siteFooter
                     ref="siteFooter"
                     cmsWidgetName="SiteFooterWidget"
@@ -44,6 +59,9 @@ import siteHeader from '@/iss-components/site-header/site-header.vue';
 import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
 import siteFooter from '@/iss-components/site-footer/site-footer.vue';
 import buttonQuestion from '@/digital-components/button-question/button-question.vue';
+import questionsPageLayout from '@/iss-components/questions-page-layout/questions-page-layout.vue';
+import questionChain from '@/digital-components/question-chain/question-chain.vue';
+
 // Supporting files
 import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
 import { settleAllPromises } from '@/helpers/layout-helper';
@@ -58,6 +76,8 @@ export default {
         siteSubHeader,
         siteFooter,
         buttonQuestion,
+        questionsPageLayout,
+        questionChain,
         // eslint-disable-next-line vue/no-reserved-component-names
         Form
     },
@@ -77,8 +97,20 @@ export default {
             vm.setCmsContent(resultMap.cmsContent);
         });
     },
+    emits: ['update:modelValue'],
     data() {
         return {
+            questions: [
+                {
+                    questionText: "test question?",
+                    answers: ["Yes", "No"]
+                },
+                {
+                    questionText: "test question 2?",
+                    answers: ["Yes", "No"]
+                }
+            ],
+            selectedAnswers: {},
             schoolPropertyAnswer: '',
             parkingLotAnswer: '',
             rules: {

From 921b358a9a605faf75103cf1a7b4b1d26841720f Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Mon, 28 Aug 2023 16:07:24 -0400
Subject: [PATCH 07/20] button question functionality

---
 .../endorsements-page/endorsements-page.vue   | 32 ++++---------------
 1 file changed, 6 insertions(+), 26 deletions(-)

diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/endorsements-page/endorsements-page.vue
index 17410a15..4277b73b 100644
--- a/src/layouts/endorsements-page/endorsements-page.vue
+++ b/src/layouts/endorsements-page/endorsements-page.vue
@@ -9,25 +9,14 @@
                 <siteHeader cmsWidgetName="SiteHeaderWidget" />
                 <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" class="mt-5 mb-5 endorsements" />
                 <div class="container-fluid pb-2">
-                <div
-                    v-for="(q, i) in questions"
-                    :key="i"
-                    class="questionBlock">
-                        <buttonQuestion
-                            class="radioQuestion"
-                            :questionText="q.questionText"
-                            :answers="q.answers"
-                            :modelValue="q.answerSelected"
-                            isRequired
-                            :validationRules="validationRules"
-                            @update:modelValue="handleAnswer(q, $event)" />
-                </div>  
-                <!-- <buttonQuestion
+                <buttonQuestion
                     v-model="schoolPropertyAnswer"
                     class="radioQuestion"
                     cmsWidgetName="SchoolPropertyQuestion"
                     :questionText="schoolPropertyQuestionText"
                     :answers="schoolPropertyAnswersFromCms"
+                    groupName="schoolProperty"
+                    buttonID="schoolPropertyQuestion"
                     buttonTypeString="listButtonHorizontal"
                     isRequired
                     :validationRules="rules.selectionRequired">
@@ -38,10 +27,12 @@
                     cmsWidgetName="ParkingLotQuestion"
                     :questionText="parkingLotQuestionText"
                     :answers="parkingLotAnswersFromCms"
+                    groupName="parkingLot"
+                    buttonID="parkingLotQuestion"
                     buttonTypeString="listButtonHorizontal"
                     isRequired
                     :validationRules="rules.selectionRequired">
-                </buttonQuestion> -->
+                </buttonQuestion>
                     <siteFooter
                     ref="siteFooter"
                     cmsWidgetName="SiteFooterWidget"
@@ -100,17 +91,6 @@ export default {
     emits: ['update:modelValue'],
     data() {
         return {
-            questions: [
-                {
-                    questionText: "test question?",
-                    answers: ["Yes", "No"]
-                },
-                {
-                    questionText: "test question 2?",
-                    answers: ["Yes", "No"]
-                }
-            ],
-            selectedAnswers: {},
             schoolPropertyAnswer: '',
             parkingLotAnswer: '',
             rules: {

From 2f384140e01c845a552ea3ae46b7129ae5a4c677 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Mon, 11 Sep 2023 10:56:15 -0400
Subject: [PATCH 08/20] remove console log

---
 src/layouts/policy-vehicles/policy-vehicles.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/layouts/policy-vehicles/policy-vehicles.vue b/src/layouts/policy-vehicles/policy-vehicles.vue
index 5bc511f3..54f19ce9 100644
--- a/src/layouts/policy-vehicles/policy-vehicles.vue
+++ b/src/layouts/policy-vehicles/policy-vehicles.vue
@@ -152,7 +152,6 @@ export default {
                     // save selected vehicle to the store
                     this.mainStore.updateVehicle(vehicle.data);
                     this.displayGeneric = false;
-                    console.log(this.endorsementsForSelectedVehicle);
                 }
             }
         }

From 0f3a9a18d923131cdb3fa45973cce83a5d45c4a2 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Mon, 11 Sep 2023 10:56:33 -0400
Subject: [PATCH 09/20] fix importing of settleAllPromises

---
 src/layouts/endorsements-page/endorsements-page.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/endorsements-page/endorsements-page.vue
index 4277b73b..bbe57f4e 100644
--- a/src/layouts/endorsements-page/endorsements-page.vue
+++ b/src/layouts/endorsements-page/endorsements-page.vue
@@ -55,7 +55,7 @@ import questionChain from '@/digital-components/question-chain/question-chain.vu
 
 // Supporting files
 import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
-import { settleAllPromises } from '@/helpers/layout-helper';
+import settleAllPromises from '@/helpers/layout-helper';
 import { Form } from 'vee-validate';
 import BaseFormMixin from '@/mixins/base-form-mixin.js';
 import globalRules from '@/constants/global-rules.js';

From 60b7fe5d53c78f37475b5c8a5352950ef67436b7 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Mon, 11 Sep 2023 11:16:09 -0400
Subject: [PATCH 10/20] save endorsements answers to store

---
 src/store/index.js | 22 +++++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

diff --git a/src/store/index.js b/src/store/index.js
index a2bfbcd7..f213b2a8 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -58,7 +58,8 @@ const getDefaultState = () => ({
             deductible: {
                 repair: null, // numerical value; how much customer owes on deductible in repair case
                 replace: null // numerical value; how much customer owes on deductible in replace case,
-            }
+            },
+            endorsementQuestionAnswers: null,
         },
         customer: {
             address: {
@@ -817,6 +818,21 @@ export const useMainStore = defineStore({
             this.applicationUser.saveSessionPromise = null;
         },
 
+        saveEndorsementQuestionAnswers(endorsementQuestionAnswersArray) {
+            // if endorsement question answers have changed, reset question answers
+            const sortedPreviousResultsArray = sortArrayOfObjectsByPropertyValue(this.order.policy.endorsementQuestionAnswers, 'result');
+            const sortedEndorsementQuestionAnswersArray = sortArrayOfObjectsByPropertyValue(endorsementQuestionAnswersArray, 'result'); 
+            const haveEndorsementQuestionAnswersChanged = sortedPreviousResultsArray?.length !== sortedEndorsementQuestionAnswersArray.length
+                || !sortedPreviousResultsArray?.every((x, i) => x.result === sortedEndorsementQuestionAnswersArray[i].result);
+            
+            if (haveEndorsementQuestionAnswersChanged) {
+                this.updateEndorsementQuestionAnswers(null);
+            }
+
+            // Save new values
+            this.updateEndorsementQuestionAnswers(endorsementQuestionAnswersArray);
+        },
+
         saveVehicleDamage(isWindshieldRepair, selectedGlassToReplace, selectedWindshieldChipCount) {
             const selectedGlassPassedInSorted = selectedGlassToReplace.slice().sort();
             const isGlassToReplaceTheSame = this.order.damage.glassToReplace?.length === selectedGlassToReplace.length
@@ -1014,6 +1030,10 @@ export const useMainStore = defineStore({
             }
         },
 
+        updateEndorsementQuestionAnswers(answersArray) {
+            this.order.policy.endorsementQuestionAnswers = answersArray;
+        },
+
         updateIsRepair(isRepair) {
             this.order.damage.isRepair = isRepair;
         },

From 3af5a3a204032dc8d1b0ed96638ca440f0349e4b Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Mon, 11 Sep 2023 14:46:38 -0400
Subject: [PATCH 11/20] create answer array and call method to save to store

---
 .../endorsements-page/endorsements-page.vue   | 22 ++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/endorsements-page/endorsements-page.vue
index bbe57f4e..7b7f1977 100644
--- a/src/layouts/endorsements-page/endorsements-page.vue
+++ b/src/layouts/endorsements-page/endorsements-page.vue
@@ -59,6 +59,7 @@ import settleAllPromises from '@/helpers/layout-helper';
 import { Form } from 'vee-validate';
 import BaseFormMixin from '@/mixins/base-form-mixin.js';
 import globalRules from '@/constants/global-rules.js';
+import { useMainStore } from '@/store';
 
 export default {
     name: 'endorsements-page',
@@ -117,7 +118,26 @@ export default {
             backButtonAction() {
                 this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
             },
-            forwardButtonAction() {
+            async forwardButtonAction() {
+                // manually creating the array for now, will revise once service returns questions
+                const questionAnswersArray = [];
+                
+                questionAnswersArray.push(
+                    {   
+                        questionNum: 1,
+                        questionText: this.schoolPropertyQuestionText,
+                        selectedAnswer: this.schoolPropertyAnswer
+                    },
+                    {
+                        questionNum: 2,
+                        questionText: this.parkingLotQuestionText,
+                        selectedAnswer: this.parkingLotAnswer
+                    }
+                );
+    
+                // save answers to store as order.policy.endorsementQuestionAnswers
+                await this.mainStore.saveEndorsementQuestionAnswers(questionAnswersArray);
+
                 return this.navigateForward();
             },
             navigateForward() {

From e1cf8e9d6317bd86707c937ca719d3de069d8952 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Mon, 11 Sep 2023 16:36:44 -0400
Subject: [PATCH 12/20] endorsements page styling WIP

---
 .../endorsements-page/endorsements-page.vue   | 52 +++++++++++--------
 1 file changed, 30 insertions(+), 22 deletions(-)

diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/endorsements-page/endorsements-page.vue
index 7b7f1977..510fda8b 100644
--- a/src/layouts/endorsements-page/endorsements-page.vue
+++ b/src/layouts/endorsements-page/endorsements-page.vue
@@ -7,11 +7,11 @@
         <div class="page-container-grouped-styles">
             <div class="fade-on-route-transition position-relative">
                 <siteHeader cmsWidgetName="SiteHeaderWidget" />
-                <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" class="mt-5 mb-5 endorsements" />
-                <div class="container-fluid pb-2">
+                <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" class="mt-5" />
+                <div class="container-fluid px-5 mt-0">
                 <buttonQuestion
                     v-model="schoolPropertyAnswer"
-                    class="radioQuestion"
+                    class="radioQuestion windshield-chip-count-question mb-4"
                     cmsWidgetName="SchoolPropertyQuestion"
                     :questionText="schoolPropertyQuestionText"
                     :answers="schoolPropertyAnswersFromCms"
@@ -23,7 +23,7 @@
                 </buttonQuestion>
                 <buttonQuestion
                     v-model="parkingLotAnswer"
-                    class="radioQuestion"
+                    class="radioQuestion windshield-chip-count-question"
                     cmsWidgetName="ParkingLotQuestion"
                     :questionText="parkingLotQuestionText"
                     :answers="parkingLotAnswersFromCms"
@@ -33,12 +33,13 @@
                     isRequired
                     :validationRules="rules.selectionRequired">
                 </buttonQuestion>
-                    <siteFooter
+                <siteFooter
                     ref="siteFooter"
                     cmsWidgetName="SiteFooterWidget"
                     :isForwardActionDisabled="!meta.valid"
                     @ForwardClicked="forwardButtonAction"
-                    @backClicked="backButtonAction" />
+                    @backClicked="backButtonAction"
+                    class="pt-5" />
                 </div>
             </div>
         </div>
@@ -149,22 +150,29 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-:deep .endorsements {
-    .subheader-primary {
-        span {
-            font-size: 20px;
-            line-height: 32px;
-        }
-    }
-    .subheader-secondary {
-        p {
-            margin-top: 0.5rem;
-            font-size: 14px;
-            line-height: 24px;
-        }
-        span {
-            text-align: left;
-        }
+
+:deep .subheader-primary {
+    margin-bottom: 0.5rem;
+}
+
+:deep .subheader-secondary {
+    p {
+        font-size: 0.875rem;
+        line-height: 1.5rem;
     }
 }
+
+:deep .question-text {
+    & > span {
+        text-align: left;
+        line-height: 1.5rem;
+    }
+    margin-bottom: 0.5rem;
+}
+
+:deep div.question-text.d-flex {
+    margin-top: 1rem;
+}
+
+
 </style>

From edd5d4fc4ee284dbf52e3cbbc241572893f8a186 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Tue, 12 Sep 2023 14:58:34 -0400
Subject: [PATCH 13/20] linting

---
 .../endorsements-page/endorsements-page.vue   | 31 +++++++++----------
 1 file changed, 15 insertions(+), 16 deletions(-)

diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/endorsements-page/endorsements-page.vue
index 510fda8b..de2ee33b 100644
--- a/src/layouts/endorsements-page/endorsements-page.vue
+++ b/src/layouts/endorsements-page/endorsements-page.vue
@@ -7,7 +7,9 @@
         <div class="page-container-grouped-styles">
             <div class="fade-on-route-transition position-relative">
                 <siteHeader cmsWidgetName="SiteHeaderWidget" />
-                <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" class="mt-5" />
+                <siteSubHeader
+                    cmsWidgetName="SiteSubHeaderWidget"
+                    class="mt-5" />
                 <div class="container-fluid px-5 mt-0">
                 <buttonQuestion
                     v-model="schoolPropertyAnswer"
@@ -35,11 +37,11 @@
                 </buttonQuestion>
                 <siteFooter
                     ref="siteFooter"
+                    class="pt-5"
                     cmsWidgetName="SiteFooterWidget"
                     :isForwardActionDisabled="!meta.valid"
                     @ForwardClicked="forwardButtonAction"
-                    @backClicked="backButtonAction"
-                    class="pt-5" />
+                    @backClicked="backButtonAction" />
                 </div>
             </div>
         </div>
@@ -51,8 +53,6 @@ import siteHeader from '@/iss-components/site-header/site-header.vue';
 import siteSubHeader from '@/iss-components/site-sub-header/site-sub-header.vue';
 import siteFooter from '@/iss-components/site-footer/site-footer.vue';
 import buttonQuestion from '@/digital-components/button-question/button-question.vue';
-import questionsPageLayout from '@/iss-components/questions-page-layout/questions-page-layout.vue';
-import questionChain from '@/digital-components/question-chain/question-chain.vue';
 
 // Supporting files
 import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
@@ -69,8 +69,6 @@ export default {
         siteSubHeader,
         siteFooter,
         buttonQuestion,
-        questionsPageLayout,
-        questionChain,
         // eslint-disable-next-line vue/no-reserved-component-names
         Form
     },
@@ -98,7 +96,7 @@ export default {
             rules: {
                 selectionRequired: globalRules.OPTION_REQUIRED
             }
-        }
+        };
     },
     computed: {
         schoolPropertyQuestionText() {
@@ -112,7 +110,7 @@ export default {
         },
         parkingLotAnswersFromCms() {
             return this.getCmsContent('ParkingLotQuestion', 'Answers');
-        },
+        }
     },
     methods:
         {
@@ -122,9 +120,9 @@ export default {
             async forwardButtonAction() {
                 // manually creating the array for now, will revise once service returns questions
                 const questionAnswersArray = [];
-                
+
                 questionAnswersArray.push(
-                    {   
+                    {
                         questionNum: 1,
                         questionText: this.schoolPropertyQuestionText,
                         selectedAnswer: this.schoolPropertyAnswer
@@ -135,15 +133,17 @@ export default {
                         selectedAnswer: this.parkingLotAnswer
                     }
                 );
-    
+
                 // save answers to store as order.policy.endorsementQuestionAnswers
-                await this.mainStore.saveEndorsementQuestionAnswers(questionAnswersArray);
+                await useMainStore().saveEndorsementQuestionAnswers(questionAnswersArray);
 
                 return this.navigateForward();
             },
             navigateForward() {
-                this.$router.navigate(this.navigationScenarios.CLICKED_FORWARD,
-                    this.$route);
+                this.$router.navigate(
+                    this.navigationScenarios.CLICKED_FORWARD,
+                    this.$route
+                );
             }
         }
 };
@@ -174,5 +174,4 @@ export default {
     margin-top: 1rem;
 }
 
-
 </style>

From fc8ec1745df61698285ab91e1c558228de04f13b Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Tue, 12 Sep 2023 16:29:25 -0400
Subject: [PATCH 14/20] endorsements page unit tests so far

---
 .../endorsements-page.spec.js                 | 111 ++++++++++++++++++
 .../endorsements-page/endorsements-page.vue   |  10 +-
 2 files changed, 118 insertions(+), 3 deletions(-)
 create mode 100644 src/layouts/endorsements-page/endorsements-page.spec.js

diff --git a/src/layouts/endorsements-page/endorsements-page.spec.js b/src/layouts/endorsements-page/endorsements-page.spec.js
new file mode 100644
index 00000000..119bba29
--- /dev/null
+++ b/src/layouts/endorsements-page/endorsements-page.spec.js
@@ -0,0 +1,111 @@
+// Components
+import endorsementsPage from '@/layouts/endorsements-page/endorsements-page.vue';
+
+// Supporting Files
+import { shallowMount } from '@vue/test-utils';
+import { getMountOptions } from '@/helpers/unit-test-helper.js';
+import navigationScenarios from '@/router/router-constants/navigation-scenarios';
+import { createTestingPinia } from '@pinia/testing';
+import { getRandomString, getRandomInt } from '@/helpers/data-generation.js';
+import { useMainStore } from '@/store';
+
+// import { useMainStore } from '@/store/index.js';
+
+describe('endorsementsPage.vue', () => {
+    describe('Rendering', () => {
+        test('Should render site header', () => {
+            // Arrange
+            const wrapper = shallowMount(endorsementsPage, getMountOptions());
+
+            // Act
+            const siteHeader = wrapper.findComponent({ ref: 'siteHeader' });
+
+            // Assert
+            expect(siteHeader.exists()).toBe(true);
+        });
+        test('Should render site subheader', () => {
+            // Arrange
+            const wrapper = shallowMount(endorsementsPage, getMountOptions());
+
+            // Act
+            const siteSubHeader = wrapper.findComponent({ ref: 'siteSubHeader' });
+
+            // Assert
+            expect(siteSubHeader.exists()).toBe(true);
+        });
+        test('Should render buttonQuestion component', () => {
+            // Arrange
+            const wrapper = shallowMount(endorsementsPage, getMountOptions());
+
+            // Act
+            const buttonQuestion = wrapper.findComponent({ ref: 'endorsementQuestion' });
+
+            // Assert
+            expect(buttonQuestion.exists()).toBe(true);
+        });
+        test('Should render site footer', () => {
+            // Arrange
+            const wrapper = shallowMount(endorsementsPage, getMountOptions());
+
+            // Act
+            const siteFooter = wrapper.findComponent({ ref: 'siteFooter' });
+
+            // Assert
+            expect(siteFooter.exists()).toBe(true);
+        });
+    });
+    describe('Navigation', () => {
+        test('Back button clicked triggers navigation', () => {
+            // Arrange
+            const wrapper = shallowMount(endorsementsPage, getMountOptions({
+                router: {
+                    navigate: jest.fn()
+                }
+            }));
+
+            // Act
+            wrapper.vm.backButtonAction();
+
+            // Assert
+            expect(wrapper.vm.$router.navigate).toHaveBeenCalled();
+            expect(wrapper.vm.$router.navigate)
+                .toHaveBeenCalledWith(navigationScenarios.CLICKED_BACK, undefined);
+        });
+        test('Forward button clicked triggers navigation', () => {
+            // Arrange
+            const wrapper = shallowMount(endorsementsPage, getMountOptions({
+                router: {
+                    navigate: jest.fn()
+                }
+            }));
+
+            // Act
+            wrapper.vm.forwardButtonAction();
+            wrapper.vm.navigateForward();
+
+            // Assert
+            expect(wrapper.vm.$router.navigate).toHaveBeenCalled();
+            expect(wrapper.vm.$router.navigate)
+                .toHaveBeenCalledWith(navigationScenarios.CLICKED_FORWARD, undefined);
+        });
+        // *TO DO: once service is ready, revise this test to ensure data is saved to the store
+        test('Forward button clicked saves endorsement question answers', () => {
+            // Arrange
+            const mountOptions = getMountOptions({
+                router: {
+                    navigate: jest.fn()
+                },
+                global: {
+                    plugins: [createTestingPinia()]
+                }
+            });
+            const wrapper = shallowMount(endorsementsPage, mountOptions);
+
+            // Act
+            wrapper.vm.forwardButtonAction();
+
+            // Assert
+            expect(useMainStore().saveEndorsementQuestionAnswers).toHaveBeenCalled();
+        });
+    });
+});
diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/endorsements-page/endorsements-page.vue
index de2ee33b..4b779dca 100644
--- a/src/layouts/endorsements-page/endorsements-page.vue
+++ b/src/layouts/endorsements-page/endorsements-page.vue
@@ -6,12 +6,16 @@
         @invalidSubmit="onInvalidSubmit">
         <div class="page-container-grouped-styles">
             <div class="fade-on-route-transition position-relative">
-                <siteHeader cmsWidgetName="SiteHeaderWidget" />
+                <siteHeader
+                    ref="siteHeader"
+                    cmsWidgetName="SiteHeaderWidget" />
                 <siteSubHeader
+                    ref="siteSubHeader"
                     cmsWidgetName="SiteSubHeaderWidget"
                     class="mt-5" />
                 <div class="container-fluid px-5 mt-0">
                 <buttonQuestion
+                    ref="endorsementQuestion"
                     v-model="schoolPropertyAnswer"
                     class="radioQuestion windshield-chip-count-question mb-4"
                     cmsWidgetName="SchoolPropertyQuestion"
@@ -40,7 +44,7 @@
                     class="pt-5"
                     cmsWidgetName="SiteFooterWidget"
                     :isForwardActionDisabled="!meta.valid"
-                    @ForwardClicked="forwardButtonAction"
+                    @forwardClicked="forwardButtonAction"
                     @backClicked="backButtonAction" />
                 </div>
             </div>
@@ -135,7 +139,7 @@ export default {
                 );
 
                 // save answers to store as order.policy.endorsementQuestionAnswers
-                await useMainStore().saveEndorsementQuestionAnswers(questionAnswersArray);
+                useMainStore().saveEndorsementQuestionAnswers(questionAnswersArray);
 
                 return this.navigateForward();
             },

From c90ef8b7c2b340da72e1a90c55c235c6c25cc153 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Tue, 12 Sep 2023 17:02:57 -0400
Subject: [PATCH 15/20] linting

---
 .../endorsements-page/endorsements-page.spec.js       |  1 -
 src/layouts/policy-vehicles/policy-vehicles.vue       | 11 +++++++----
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/layouts/endorsements-page/endorsements-page.spec.js b/src/layouts/endorsements-page/endorsements-page.spec.js
index 119bba29..a7eaa593 100644
--- a/src/layouts/endorsements-page/endorsements-page.spec.js
+++ b/src/layouts/endorsements-page/endorsements-page.spec.js
@@ -6,7 +6,6 @@ import { shallowMount } from '@vue/test-utils';
 import { getMountOptions } from '@/helpers/unit-test-helper.js';
 import navigationScenarios from '@/router/router-constants/navigation-scenarios';
 import { createTestingPinia } from '@pinia/testing';
-import { getRandomString, getRandomInt } from '@/helpers/data-generation.js';
 import { useMainStore } from '@/store';
 
 // import { useMainStore } from '@/store/index.js';
diff --git a/src/layouts/policy-vehicles/policy-vehicles.vue b/src/layouts/policy-vehicles/policy-vehicles.vue
index 54f19ce9..5287be82 100644
--- a/src/layouts/policy-vehicles/policy-vehicles.vue
+++ b/src/layouts/policy-vehicles/policy-vehicles.vue
@@ -200,12 +200,15 @@ export default {
                             this.navigationScenarios.CLICKED_FORWARD_NON_LISTED_VEHICLE,
                             this.$route,
                             {},
-                            {});
-                } else if (!!this.endorsementsForSelectedVehicle) {
-                    this.$router.navigate(this.navigationScenarios.CLICKED_FORWARD_WITH_ENDORSEMENTS, 
+                            {}
+                        );
+                } else if (this.endorsementsForSelectedVehicle) {
+                    this.$router.navigate(
+                        this.navigationScenarios.CLICKED_FORWARD_WITH_ENDORSEMENTS,
                         this.$route,
                         {},
-                        {});
+                        {}
+                    );
                 } else {
                     this.$router.navigate(
                         this.navigationScenarios.CLICKED_FORWARD_LISTED_VEHICLE,

From 020bb84704072d700ffe2c1f71ada2e08f5d85c5 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Wed, 13 Sep 2023 11:17:22 -0400
Subject: [PATCH 16/20] final styling fixes

---
 src/layouts/endorsements-page/endorsements-page.vue | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/endorsements-page/endorsements-page.vue
index 4b779dca..b01a15f2 100644
--- a/src/layouts/endorsements-page/endorsements-page.vue
+++ b/src/layouts/endorsements-page/endorsements-page.vue
@@ -9,11 +9,11 @@
                 <siteHeader
                     ref="siteHeader"
                     cmsWidgetName="SiteHeaderWidget" />
+                <div class="container-fluid mt-0 px-5">
                 <siteSubHeader
                     ref="siteSubHeader"
                     cmsWidgetName="SiteSubHeaderWidget"
                     class="mt-5" />
-                <div class="container-fluid px-5 mt-0">
                 <buttonQuestion
                     ref="endorsementQuestion"
                     v-model="schoolPropertyAnswer"
@@ -166,6 +166,16 @@ export default {
     }
 }
 
+:deep .subheader-secondary.justify-content-center {
+    p {
+        text-align: left;
+    }
+    justify-content: left !important;
+    padding-left: 0;
+    padding-right: 0;
+    margin-bottom: 1.5rem;
+}
+
 :deep .question-text {
     & > span {
         text-align: left;

From ddb394e0b5a8e6724c86336adc21141d8525ce01 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Wed, 13 Sep 2023 15:18:03 -0400
Subject: [PATCH 17/20] change page name

---
 .../policy-endorsements.spec.js}              | 20 +++++++++----------
 .../policy-endorsements.vue}                  |  2 +-
 src/router/router-constants/issPage-values.js |  2 +-
 src/router/router-constants/routing-table.js  |  8 ++++----
 4 files changed, 15 insertions(+), 17 deletions(-)
 rename src/layouts/{endorsements-page/endorsements-page.spec.js => policy-endorsements/policy-endorsements.spec.js} (81%)
 rename src/layouts/{endorsements-page/endorsements-page.vue => policy-endorsements/policy-endorsements.vue} (99%)

diff --git a/src/layouts/endorsements-page/endorsements-page.spec.js b/src/layouts/policy-endorsements/policy-endorsements.spec.js
similarity index 81%
rename from src/layouts/endorsements-page/endorsements-page.spec.js
rename to src/layouts/policy-endorsements/policy-endorsements.spec.js
index a7eaa593..ca26edb1 100644
--- a/src/layouts/endorsements-page/endorsements-page.spec.js
+++ b/src/layouts/policy-endorsements/policy-endorsements.spec.js
@@ -1,5 +1,5 @@
 // Components
-import endorsementsPage from '@/layouts/endorsements-page/endorsements-page.vue';
+import policyEndorsements from '@/layouts/policy-endorsements/policy-endorsements.vue';
 
 // Supporting Files
 import { shallowMount } from '@vue/test-utils';
@@ -8,13 +8,11 @@ import navigationScenarios from '@/router/router-constants/navigation-scenarios'
 import { createTestingPinia } from '@pinia/testing';
 import { useMainStore } from '@/store';
 
-// import { useMainStore } from '@/store/index.js';
-
-describe('endorsementsPage.vue', () => {
+describe('policyEndorsements.vue', () => {
     describe('Rendering', () => {
         test('Should render site header', () => {
             // Arrange
-            const wrapper = shallowMount(endorsementsPage, getMountOptions());
+            const wrapper = shallowMount(policyEndorsements, getMountOptions());
 
             // Act
             const siteHeader = wrapper.findComponent({ ref: 'siteHeader' });
@@ -24,7 +22,7 @@ describe('endorsementsPage.vue', () => {
         });
         test('Should render site subheader', () => {
             // Arrange
-            const wrapper = shallowMount(endorsementsPage, getMountOptions());
+            const wrapper = shallowMount(policyEndorsements, getMountOptions());
 
             // Act
             const siteSubHeader = wrapper.findComponent({ ref: 'siteSubHeader' });
@@ -34,7 +32,7 @@ describe('endorsementsPage.vue', () => {
         });
         test('Should render buttonQuestion component', () => {
             // Arrange
-            const wrapper = shallowMount(endorsementsPage, getMountOptions());
+            const wrapper = shallowMount(policyEndorsements, getMountOptions());
 
             // Act
             const buttonQuestion = wrapper.findComponent({ ref: 'endorsementQuestion' });
@@ -44,7 +42,7 @@ describe('endorsementsPage.vue', () => {
         });
         test('Should render site footer', () => {
             // Arrange
-            const wrapper = shallowMount(endorsementsPage, getMountOptions());
+            const wrapper = shallowMount(policyEndorsements, getMountOptions());
 
             // Act
             const siteFooter = wrapper.findComponent({ ref: 'siteFooter' });
@@ -56,7 +54,7 @@ describe('endorsementsPage.vue', () => {
     describe('Navigation', () => {
         test('Back button clicked triggers navigation', () => {
             // Arrange
-            const wrapper = shallowMount(endorsementsPage, getMountOptions({
+            const wrapper = shallowMount(policyEndorsements, getMountOptions({
                 router: {
                     navigate: jest.fn()
                 }
@@ -72,7 +70,7 @@ describe('endorsementsPage.vue', () => {
         });
         test('Forward button clicked triggers navigation', () => {
             // Arrange
-            const wrapper = shallowMount(endorsementsPage, getMountOptions({
+            const wrapper = shallowMount(policyEndorsements, getMountOptions({
                 router: {
                     navigate: jest.fn()
                 }
@@ -98,7 +96,7 @@ describe('endorsementsPage.vue', () => {
                     plugins: [createTestingPinia()]
                 }
             });
-            const wrapper = shallowMount(endorsementsPage, mountOptions);
+            const wrapper = shallowMount(policyEndorsements, mountOptions);
 
             // Act
             wrapper.vm.forwardButtonAction();
diff --git a/src/layouts/endorsements-page/endorsements-page.vue b/src/layouts/policy-endorsements/policy-endorsements.vue
similarity index 99%
rename from src/layouts/endorsements-page/endorsements-page.vue
rename to src/layouts/policy-endorsements/policy-endorsements.vue
index b01a15f2..70b77298 100644
--- a/src/layouts/endorsements-page/endorsements-page.vue
+++ b/src/layouts/policy-endorsements/policy-endorsements.vue
@@ -67,7 +67,7 @@ import globalRules from '@/constants/global-rules.js';
 import { useMainStore } from '@/store';
 
 export default {
-    name: 'endorsements-page',
+    name: 'policy-endorsements',
     components: {
         siteHeader,
         siteSubHeader,
diff --git a/src/router/router-constants/issPage-values.js b/src/router/router-constants/issPage-values.js
index 36a3df39..db5b783f 100644
--- a/src/router/router-constants/issPage-values.js
+++ b/src/router/router-constants/issPage-values.js
@@ -9,7 +9,7 @@ const issPageValues = Object.freeze({
     CAPABILITY_QUESTIONS: 'capability-questions',
     CONTACT_CONFIRMATION: 'contact-confirmation',
     CONTACT_DETAILS: 'contact-details',
-    ENDORSEMENTS_PAGE: 'endorsements-page',
+    POLICY_ENDORSEMENTS: 'policy-endorsements',
     ESTIMATE: 'estimate',
     COVERAGE_STATEMENT: 'coverage-statement',
     LICENSE_PLATE_LOOKUP: 'license-plate-lookup',
diff --git a/src/router/router-constants/routing-table.js b/src/router/router-constants/routing-table.js
index 13593453..bc5d762c 100644
--- a/src/router/router-constants/routing-table.js
+++ b/src/router/router-constants/routing-table.js
@@ -408,8 +408,8 @@ const routingTable = () => [
             },
             {
                 scenario: navigationScenarios.CLICKED_FORWARD_WITH_ENDORSEMENTS,
-                destinationIssPageValue: issPageValues.ENDORSEMENTS_PAGE
-            },
+                destinationIssPageValue: issPageValues.POLICY_ENDORSEMENTS
+            }
 
         ]
     },
@@ -623,7 +623,7 @@ const routingTable = () => [
         ]
     },
     {
-        issPageValue: issPageValues.ENDORSEMENTS_PAGE,
+        issPageValue: issPageValues.POLICY_ENDORSEMENTS,
         maps: [
             {
                 scenario: navigationScenarios.CLICKED_BACK,
@@ -634,7 +634,7 @@ const routingTable = () => [
                 destinationIssPageValue: issPageValues.VEHICLE_DAMAGE
             }
         ]
-    },
+    }
 
 ];
 

From 60abf0697e9cfb4a70b54a8862220d9807e171e8 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Thu, 14 Sep 2023 14:16:37 -0400
Subject: [PATCH 18/20] update computed property for endorsements

---
 src/layouts/policy-vehicles/policy-vehicles.vue | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/layouts/policy-vehicles/policy-vehicles.vue b/src/layouts/policy-vehicles/policy-vehicles.vue
index 5287be82..869aa864 100644
--- a/src/layouts/policy-vehicles/policy-vehicles.vue
+++ b/src/layouts/policy-vehicles/policy-vehicles.vue
@@ -119,8 +119,12 @@ export default {
                 : 0;
         },
         endorsementsForSelectedVehicle() {
-            // hardcoded until endorsements service is ready
-            return true;
+            const vehicle = this.policyVehicles.find((policyVehicle) =>
+                policyVehicle?.vin === this.selectedVehicleVin);
+            if (!vehicle) {
+                return undefined;
+            }
+            return vehicle.endorsements?.length > 0;
         },
         repairWaivedForSelectedVehicle() {
             const vehicle = this.policyVehicles.find((policyVehicle) =>

From 96462fd087a597f4ea57cf70f2fc542276eb8368 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Fri, 15 Sep 2023 14:57:26 -0400
Subject: [PATCH 19/20] add test for save endorsements method

---
 src/store/index.js      |  5 ++---
 src/store/store.spec.js | 22 ++++++++++++++++++++++
 2 files changed, 24 insertions(+), 3 deletions(-)

diff --git a/src/store/index.js b/src/store/index.js
index 65051c35..9ef2f3ec 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -60,7 +60,7 @@ const getDefaultState = () => ({
                 repair: null, // numerical value; how much customer owes on deductible in repair case
                 replace: null // numerical value; how much customer owes on deductible in replace case,
             },
-            endorsementQuestionAnswers: null,
+            endorsementQuestionAnswers: null
         },
         customer: {
             address: {
@@ -917,12 +917,11 @@ export const useMainStore = defineStore({
             const sortedEndorsementQuestionAnswersArray = sortArrayOfObjectsByPropertyValue(endorsementQuestionAnswersArray, 'result'); 
             const haveEndorsementQuestionAnswersChanged = sortedPreviousResultsArray?.length !== sortedEndorsementQuestionAnswersArray.length
                 || !sortedPreviousResultsArray?.every((x, i) => x.result === sortedEndorsementQuestionAnswersArray[i].result);
-            
+
             if (haveEndorsementQuestionAnswersChanged) {
                 this.updateEndorsementQuestionAnswers(null);
             }
 
-            // Save new values
             this.updateEndorsementQuestionAnswers(endorsementQuestionAnswersArray);
         },
 
diff --git a/src/store/store.spec.js b/src/store/store.spec.js
index d03784f5..5ee963ab 100644
--- a/src/store/store.spec.js
+++ b/src/store/store.spec.js
@@ -955,4 +955,26 @@ describe('Store', () => {
             );
         });
     });
+
+    describe('saveEndorsementQuestionAnswers method', () => {
+        it('method should update endorsement question data in store', () => {
+            // Arrange
+            const questionNum = getRandomInt(1, 100);
+            const questionText = getRandomString(50, 300);
+            const selectedAnswer = getRandomString(2, 3);
+            const endorsementQuestionAnswersArray = [
+                {
+                    questionNum,
+                    questionText,
+                    selectedAnswer
+                }
+            ];
+
+            // Act
+            store.saveEndorsementQuestionAnswers(endorsementQuestionAnswersArray);
+
+            // Assert
+            expect(store.order.policy.endorsementQuestionAnswers).toEqual(endorsementQuestionAnswersArray);
+        });
+    });
 });

From f21a75f5d7969e8b0c376168a31d69a5464fd257 Mon Sep 17 00:00:00 2001
From: Katie Kroell <Katie.Kroell@safelite.com>
Date: Fri, 15 Sep 2023 14:58:09 -0400
Subject: [PATCH 20/20] revisions based on PR feedback

---
 .../policy-endorsements.spec.js               | 18 +++-
 .../policy-endorsements.vue                   | 99 ++++++++++---------
 .../policy-vehicles/policy-vehicles.vue       | 10 +-
 3 files changed, 68 insertions(+), 59 deletions(-)

diff --git a/src/layouts/policy-endorsements/policy-endorsements.spec.js b/src/layouts/policy-endorsements/policy-endorsements.spec.js
index ca26edb1..86b8fa73 100644
--- a/src/layouts/policy-endorsements/policy-endorsements.spec.js
+++ b/src/layouts/policy-endorsements/policy-endorsements.spec.js
@@ -30,12 +30,22 @@ describe('policyEndorsements.vue', () => {
             // Assert
             expect(siteSubHeader.exists()).toBe(true);
         });
-        test('Should render buttonQuestion component', () => {
+        test('Should render schoolProperty buttonQuestion component', () => {
             // Arrange
             const wrapper = shallowMount(policyEndorsements, getMountOptions());
 
             // Act
-            const buttonQuestion = wrapper.findComponent({ ref: 'endorsementQuestion' });
+            const buttonQuestion = wrapper.findComponent({ ref: 'schoolPropertyQuestion' });
+
+            // Assert
+            expect(buttonQuestion.exists()).toBe(true);
+        });
+        test('Should render parkingLot buttonQuestion component', () => {
+            // Arrange
+            const wrapper = shallowMount(policyEndorsements, getMountOptions());
+
+            // Act
+            const buttonQuestion = wrapper.findComponent({ ref: 'parkingLotQuestion' });
 
             // Assert
             expect(buttonQuestion.exists()).toBe(true);
@@ -85,7 +95,6 @@ describe('policyEndorsements.vue', () => {
             expect(wrapper.vm.$router.navigate)
                 .toHaveBeenCalledWith(navigationScenarios.CLICKED_FORWARD, undefined);
         });
-        // *TO DO: once service is ready, revise this test to ensure data is saved to the store
         test('Forward button clicked saves endorsement question answers', () => {
             // Arrange
             const mountOptions = getMountOptions({
@@ -96,13 +105,14 @@ describe('policyEndorsements.vue', () => {
                     plugins: [createTestingPinia()]
                 }
             });
+
             const wrapper = shallowMount(policyEndorsements, mountOptions);
 
             // Act
             wrapper.vm.forwardButtonAction();
 
             // Assert
-            expect(useMainStore().saveEndorsementQuestionAnswers).toHaveBeenCalled();
+            expect(useMainStore().saveEndorsementQuestionAnswers).toHaveBeenCalledWith(wrapper.vm.questionAnswersArray);
         });
     });
 });
diff --git a/src/layouts/policy-endorsements/policy-endorsements.vue b/src/layouts/policy-endorsements/policy-endorsements.vue
index 70b77298..22154818 100644
--- a/src/layouts/policy-endorsements/policy-endorsements.vue
+++ b/src/layouts/policy-endorsements/policy-endorsements.vue
@@ -4,48 +4,50 @@
         v-slot="{ meta }"
         @submit="onSubmit"
         @invalidSubmit="onInvalidSubmit">
-        <div class="page-container-grouped-styles">
+        <div
+            class="page-container-grouped-styles">
             <div class="fade-on-route-transition position-relative">
                 <siteHeader
                     ref="siteHeader"
                     cmsWidgetName="SiteHeaderWidget" />
                 <div class="container-fluid mt-0 px-5">
-                <siteSubHeader
-                    ref="siteSubHeader"
-                    cmsWidgetName="SiteSubHeaderWidget"
-                    class="mt-5" />
-                <buttonQuestion
-                    ref="endorsementQuestion"
-                    v-model="schoolPropertyAnswer"
-                    class="radioQuestion windshield-chip-count-question mb-4"
-                    cmsWidgetName="SchoolPropertyQuestion"
-                    :questionText="schoolPropertyQuestionText"
-                    :answers="schoolPropertyAnswersFromCms"
-                    groupName="schoolProperty"
-                    buttonID="schoolPropertyQuestion"
-                    buttonTypeString="listButtonHorizontal"
-                    isRequired
-                    :validationRules="rules.selectionRequired">
-                </buttonQuestion>
-                <buttonQuestion
-                    v-model="parkingLotAnswer"
-                    class="radioQuestion windshield-chip-count-question"
-                    cmsWidgetName="ParkingLotQuestion"
-                    :questionText="parkingLotQuestionText"
-                    :answers="parkingLotAnswersFromCms"
-                    groupName="parkingLot"
-                    buttonID="parkingLotQuestion"
-                    buttonTypeString="listButtonHorizontal"
-                    isRequired
-                    :validationRules="rules.selectionRequired">
-                </buttonQuestion>
-                <siteFooter
-                    ref="siteFooter"
-                    class="pt-5"
-                    cmsWidgetName="SiteFooterWidget"
-                    :isForwardActionDisabled="!meta.valid"
-                    @forwardClicked="forwardButtonAction"
-                    @backClicked="backButtonAction" />
+                    <siteSubHeader
+                        ref="siteSubHeader"
+                        cmsWidgetName="SiteSubHeaderWidget"
+                        class="mt-5" />
+                    <buttonQuestion
+                        ref="schoolPropertyQuestion"
+                        v-model="schoolPropertyAnswer"
+                        class="radioQuestion windshield-chip-count-question mb-4"
+                        cmsWidgetName="SchoolPropertyQuestion"
+                        :questionText="schoolPropertyQuestionText"
+                        :answers="schoolPropertyAnswersFromCms"
+                        groupName="schoolProperty"
+                        buttonID="schoolPropertyQuestion"
+                        buttonTypeString="listButtonHorizontal"
+                        isRequired
+                        :validationRules="rules.selectionRequired">
+                    </buttonQuestion>
+                    <buttonQuestion
+                        ref="parkingLotQuestion"
+                        v-model="parkingLotAnswer"
+                        class="radioQuestion windshield-chip-count-question"
+                        cmsWidgetName="ParkingLotQuestion"
+                        :questionText="parkingLotQuestionText"
+                        :answers="parkingLotAnswersFromCms"
+                        groupName="parkingLot"
+                        buttonID="parkingLotQuestion"
+                        buttonTypeString="listButtonHorizontal"
+                        isRequired
+                        :validationRules="rules.selectionRequired">
+                    </buttonQuestion>
+                    <siteFooter
+                        ref="siteFooter"
+                        class="pt-5"
+                        cmsWidgetName="SiteFooterWidget"
+                        :isForwardActionDisabled="!meta.valid"
+                        @forwardClicked="forwardButtonAction"
+                        @backClicked="backButtonAction" />
                 </div>
             </div>
         </div>
@@ -95,6 +97,7 @@ export default {
     emits: ['update:modelValue'],
     data() {
         return {
+            questionAnswersArray: [],
             schoolPropertyAnswer: '',
             parkingLotAnswer: '',
             rules: {
@@ -122,10 +125,8 @@ export default {
                 this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
             },
             async forwardButtonAction() {
-                // manually creating the array for now, will revise once service returns questions
-                const questionAnswersArray = [];
-
-                questionAnswersArray.push(
+                // TO DO: remove hard coding and update data format once service returns endorsement questions
+                this.questionAnswersArray.push(
                     {
                         questionNum: 1,
                         questionText: this.schoolPropertyQuestionText,
@@ -139,7 +140,7 @@ export default {
                 );
 
                 // save answers to store as order.policy.endorsementQuestionAnswers
-                useMainStore().saveEndorsementQuestionAnswers(questionAnswersArray);
+                useMainStore().saveEndorsementQuestionAnswers(this.questionAnswersArray);
 
                 return this.navigateForward();
             },
@@ -156,13 +157,13 @@ export default {
 <style lang="scss" scoped>
 
 :deep .subheader-primary {
-    margin-bottom: 0.5rem;
+    margin-bottom: map-get($spacers, 3);
 }
 
 :deep .subheader-secondary {
     p {
-        font-size: 0.875rem;
-        line-height: 1.5rem;
+        font-size: $h6-font-size;
+        line-height: map-get($spacers, 5);
     }
 }
 
@@ -173,19 +174,19 @@ export default {
     justify-content: left !important;
     padding-left: 0;
     padding-right: 0;
-    margin-bottom: 1.5rem;
+    margin-bottom: map-get($spacers, 5);
 }
 
 :deep .question-text {
     & > span {
         text-align: left;
-        line-height: 1.5rem;
+        line-height: map-get($spacers, 5);
     }
-    margin-bottom: 0.5rem;
+    margin-bottom: map-get($spacers, 2);
 }
 
 :deep div.question-text.d-flex {
-    margin-top: 1rem;
+    margin-top: map-get($spacers, 4);
 }
 
 </style>
diff --git a/src/layouts/policy-vehicles/policy-vehicles.vue b/src/layouts/policy-vehicles/policy-vehicles.vue
index 869aa864..f92a8475 100644
--- a/src/layouts/policy-vehicles/policy-vehicles.vue
+++ b/src/layouts/policy-vehicles/policy-vehicles.vue
@@ -118,11 +118,11 @@ export default {
                 ? vehicle?.coverages[0].deductible
                 : 0;
         },
-        endorsementsForSelectedVehicle() {
+        selectedVehicleHasEndorsements() {
             const vehicle = this.policyVehicles.find((policyVehicle) =>
                 policyVehicle?.vin === this.selectedVehicleVin);
             if (!vehicle) {
-                return undefined;
+                return false;
             }
             return vehicle.endorsements?.length > 0;
         },
@@ -206,12 +206,10 @@ export default {
                             {},
                             {}
                         );
-                } else if (this.endorsementsForSelectedVehicle) {
+                } else if (this.selectedVehicleHasEndorsements) {
                     this.$router.navigate(
                         this.navigationScenarios.CLICKED_FORWARD_WITH_ENDORSEMENTS,
-                        this.$route,
-                        {},
-                        {}
+                        this.$route
                     );
                 } else {
                     this.$router.navigate(