From 5be4bb88cdabd2f7a5d5f81c44d4a5b76cf85db1 Mon Sep 17 00:00:00 2001
From: CarlNation <Carl.Nation@safelite.com>
Date: Tue, 12 May 2026 09:52:37 -0400
Subject: [PATCH 1/3] CASH-619 DupCheck page layout

CASH-619 DupCheck page layout
---
 .../duplicate-check/duplicate-check.vue       | 92 ++++++++++++++++++-
 src/ux-components/list-button/list-button.vue |  7 +-
 2 files changed, 93 insertions(+), 6 deletions(-)

diff --git a/src/layouts/duplicate-check/duplicate-check.vue b/src/layouts/duplicate-check/duplicate-check.vue
index aa1f80bb9..3d3318cac 100644
--- a/src/layouts/duplicate-check/duplicate-check.vue
+++ b/src/layouts/duplicate-check/duplicate-check.vue
@@ -5,9 +5,40 @@
             <div class="row">
                 <div class="col-12 col-md-10 col-lg-8 col-xl-7">
                     <funnelSubHeader class="pb-4" cmsWidgetName="FunnelSubHeaderWidget" />
-                    <!--
-                            ... Page code goes here.
-                    -->
+                    
+                    <textBlock
+                        cmsWidgetName="DupCheckPageTitleWidget"
+                        typeStyle="h1"
+                        :customText="pageTitleText"
+                        class="mb-5 text-left text-md-left cc-page-title" />
+
+                    <textBlock
+                        cmsWidgetName="DupCheckPageInstructionsWidget"
+                        typeStyle="body"
+                        :customText="pageInstructionsText"
+                        class="mb-5 text-left text-md-left cc-page-instructions" />
+
+                    <buttonQuestion
+                        :questionText="existingClaimsQuestionText"
+                        :answers="existingClaimsAnswers"
+                        class="mb-4"
+                        groupName="existingClaimsQuestion"
+                        buttonTypeString="listButton"
+                        isRequired
+                        v-model="existingClaimsSelectedValue" />
+
+                    <div class="or-divider mb-4" role="separator" aria-label="or">
+                        <span class="or-divider-text">or</span>
+                    </div>
+
+                    <buttonQuestion
+                        :answers="startNewClaimAnswers"
+                        class="mb-4"
+                        groupName="existingClaimsQuestion"
+                        buttonTypeString="listButton"
+                        isRequired
+                        v-model="startNewClaimSelectedValue" />
+
                     <navbar
                         cmsWidgetName="FunnelFooterWidget"
                         ref="navbar"
@@ -24,6 +55,8 @@
 import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
 import navbar from "@/fmg-components/nav-bar/nav-bar";
 import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
+import textBlock from "@/digital-components/text-block/text-block";
+import buttonQuestion from "@/digital-components/button-question/button-question";
 import { Form } from "vee-validate";
 
 import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
@@ -40,6 +73,8 @@ export default {
         funnelHeader,
         navbar,
         funnelSubHeader,
+        textBlock,
+        buttonQuestion,
     },
     // Ensure CMS content is fetched during route navigation without depending on `to`/`from`
     async beforeRouteEnter(to, from, next) {
@@ -56,6 +91,30 @@ export default {
             vm.setCmsContent(resultMap.cmsContent);
         });
     },
+    computed: {
+        pageTitleText() {
+            return this.getCmsContent("DupCheckPageTitleWidget", "Text");
+        },
+        pageInstructionsText() {
+            return this.getCmsContent("DupCheckPageInstructionsWidget", "Text");
+        },
+        existingClaimsQuestionText() {
+            return this.getCmsContent("ExistingClaimsListWidget", "QuestionText");
+        },
+        existingClaimsAnswers() {
+            return this.getCmsContent("ExistingClaimsListWidget", "Answers");
+        },
+        startNewClaimQuestionText() {
+            return this.getCmsContent("StartNewClaimWidget", "QuestionText");
+        },
+        startNewClaimAnswers() {
+            const answers = this.getCmsContent("StartNewClaimWidget", "Answers");
+            return answers.map(answer => ({
+                buttonLabel: answer.Text,
+                value: answer.Name,
+            }));
+        },
+    },
 
     methods: {
         backButtonAction() {
@@ -76,3 +135,30 @@ export default {
     },
 };
 </script>
+<style lang="scss">
+.cc-page-title {
+    font-size: 20px !important;
+    line-height: 1.325;
+    font-weight: 300;
+    color: $black;
+}
+.or-divider {
+    display: flex;
+    align-items: center;
+    text-align: center;
+    color: $gray-600;
+
+    &::before,
+    &::after {
+        content: "";
+        flex: 1;
+        border-bottom: 1px solid $gray-500;
+    }
+
+    .or-divider-text {
+        padding: 0 0.75rem;
+        font-size: 0.875rem;
+        text-transform: lowercase;
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/ux-components/list-button/list-button.vue b/src/ux-components/list-button/list-button.vue
index 293f29d73..df71f9800 100644
--- a/src/ux-components/list-button/list-button.vue
+++ b/src/ux-components/list-button/list-button.vue
@@ -6,9 +6,10 @@
         <div
             :aria-label="buttonLabel"
             class="button-content list-button-content d-flex flex-column justify-content-center py-3 px-4 p-md-4">
-            <span class="m-0" :class="[textPosition, labelBold ? 'span-bold' : '']">
-                {{ buttonLabel }}
-            </span>
+            <span
+                class="m-0"
+                :class="[textPosition, labelBold ? 'span-bold' : '']"
+                v-html="buttonLabel"></span>
             <span v-if="buttonLabelSubCopy" class="m-0 small" :class="textPosition">
                 {{ buttonLabelSubCopy }}
             </span>

From 79732a079e10cbbb34a8c6c56dbc0f54834cef20 Mon Sep 17 00:00:00 2001
From: Carl Nation <Carl.Nation@safelite.com>
Date: Wed, 27 May 2026 09:35:38 -0400
Subject: [PATCH 2/3] CASH-619 test fixes

CASH-619 test fixes
---
 src/layouts/duplicate-check/duplicate-check.spec.js | 11 +++++++++++
 src/layouts/duplicate-check/duplicate-check.vue     |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/layouts/duplicate-check/duplicate-check.spec.js b/src/layouts/duplicate-check/duplicate-check.spec.js
index e28a749e6..c6ef54ff8 100644
--- a/src/layouts/duplicate-check/duplicate-check.spec.js
+++ b/src/layouts/duplicate-check/duplicate-check.spec.js
@@ -55,6 +55,16 @@ function setupMocks() {
     fetchCmsContentForPage.mockResolvedValue(mockCmsContent);
     settleAllPromises.mockResolvedValue({ cmsContent: mockCmsContent });
 
+
+    const mockMixin = {
+        methods: {
+            getCmsContent: jest.fn((widgetName, fieldName) => {
+                return mockCmsContent?.[widgetName]?.[fieldName] ?? "";
+            }),
+            setCmsContent: jest.fn(),
+        },
+    };
+
     const mountOptions = getMountOptions({
         route: { name: "duplicate-check", query: {}, params: {} },
         router: {
@@ -62,6 +72,7 @@ function setupMocks() {
             navigateWithSaving: jest.fn(),
             navigateWithoutSaving: jest.fn(),
         },
+        mixins: [mockMixin],
     });
 
     const wrapper = shallowMount(duplicateCheck, mountOptions);
diff --git a/src/layouts/duplicate-check/duplicate-check.vue b/src/layouts/duplicate-check/duplicate-check.vue
index 3d3318cac..ab3358ee6 100644
--- a/src/layouts/duplicate-check/duplicate-check.vue
+++ b/src/layouts/duplicate-check/duplicate-check.vue
@@ -109,7 +109,8 @@ export default {
         },
         startNewClaimAnswers() {
             const answers = this.getCmsContent("StartNewClaimWidget", "Answers");
-            return answers.map(answer => ({
+            if (!Array.isArray(answers)) return [];
+            return answers.map((answer) => ({
                 buttonLabel: answer.Text,
                 value: answer.Name,
             }));

From 581b236bc346d98f65a493c9beb5cd429b271882 Mon Sep 17 00:00:00 2001
From: Carl Nation <Carl.Nation@safelite.com>
Date: Wed, 27 May 2026 09:41:23 -0400
Subject: [PATCH 3/3] CASH-619 prettier

CASH-619 prettier
---
 src/layouts/duplicate-check/duplicate-check.spec.js | 1 -
 src/layouts/duplicate-check/duplicate-check.vue     | 4 ++--
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/layouts/duplicate-check/duplicate-check.spec.js b/src/layouts/duplicate-check/duplicate-check.spec.js
index c6ef54ff8..3f5d6cca2 100644
--- a/src/layouts/duplicate-check/duplicate-check.spec.js
+++ b/src/layouts/duplicate-check/duplicate-check.spec.js
@@ -55,7 +55,6 @@ function setupMocks() {
     fetchCmsContentForPage.mockResolvedValue(mockCmsContent);
     settleAllPromises.mockResolvedValue({ cmsContent: mockCmsContent });
 
-
     const mockMixin = {
         methods: {
             getCmsContent: jest.fn((widgetName, fieldName) => {
diff --git a/src/layouts/duplicate-check/duplicate-check.vue b/src/layouts/duplicate-check/duplicate-check.vue
index ab3358ee6..6cbc56e5b 100644
--- a/src/layouts/duplicate-check/duplicate-check.vue
+++ b/src/layouts/duplicate-check/duplicate-check.vue
@@ -5,7 +5,7 @@
             <div class="row">
                 <div class="col-12 col-md-10 col-lg-8 col-xl-7">
                     <funnelSubHeader class="pb-4" cmsWidgetName="FunnelSubHeaderWidget" />
-                    
+
                     <textBlock
                         cmsWidgetName="DupCheckPageTitleWidget"
                         typeStyle="h1"
@@ -162,4 +162,4 @@ export default {
         text-transform: lowercase;
     }
 }
-</style>
\ No newline at end of file
+</style>