Adding props to pass alert data to child components and updating dropdown question to new format for retrieving CMS data

src/common-components/dropdown-question/dropdown-question.vue

@@ -37,6 +37,7 @@ export default {
 		isRequired: Boolean,
 		disableAutoFill: Boolean,
 		validationRules: String, 
+		cmsWidgetName: String,
 	},
 	setup(props) {
 		const fieldOptions = {
@@ -58,17 +59,10 @@ export default {
 			meta, 
 		};
 	},  
-	data() {
-		return {
-			questionText: "",
-		}
-	},
-	methods: {
-		initializeComponent(cmsContent) {
-			this.questionText = cmsContent;
-		}
-	},    
 	computed: {
+		questionText(){
+			return this.getCmsContent(this.cmsWidgetName, 'QuestionText');
+		},
 		selectedOption: {
 			get: function() {
 				return this.modelValue;

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

@@ -9,7 +9,7 @@
 			<funnelHeader cmsWidgetName="FunnelHeaderWidget" ref="funnelHeader" />
 			<vehicleBanner ref="vehicleBanner" :displayGenericVehicleImage=false />
 			<funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" ref="funnelSubHeader" />		
-			<customerQuestions ref="customerQuestions" v-model="customerQuestions" />
+			<customerQuestions ref="customerQuestions" v-model="customerQuestions" :alertNotifications="{alertVerification: alertVerificationWidget, alertNoMatchWarning: alertNoMatchWarningWidget}" />
 			<funnel-footer
 				cmsWidgetName="FunnelFooterWidget"
 				ref="funnelFooter"
@@ -55,6 +55,14 @@ export default {
 		// Call the "next" function to complete the transition to this page.
 		next((vm) => {
 			vm.setCmsContent(resultMap.cmsContent);
+			vm.alertVerificationWidget = {
+				headline: resultMap.cmsContent.AlertVerificationWarningWidget.HeadlineText,
+				copy: resultMap.cmsContent.AlertVerificationWarningWidget.BodyText,
+			};
+			vm.alertNoMatchWarningWidget = {
+				headline: resultMap.cmsContent.AlertNoMatchWarningWidget.HeadlineText,
+				copy: resultMap.cmsContent.AlertNoMatchWarningWidget.BodyText,
+			}
 			// vm.$refs.funnelHeader.initializeComponent(
 			// 	resultMap.cmsContent.FunnelHeaderWidget
 			// );

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

@@ -21,16 +21,16 @@
 			</div> 
 		</div>
 	</transition>
-	<alert cmsWidgetName="AlertVerificationWarningWidget" ref="alertVerificationWarning" v-show="displayVerificationWarning"
+	<alert ref="alertVerificationWarning" v-show="displayVerificationWarning"
 		alertClass="alert-warning"
-		:alertHeadline="alertHeadlineVerificationWarning"
+		:alertHeadline="alertNotifications?.alertVerification?.headline"
-		:alertCopy="alertCopyVerificationWarning"
+		:alertCopy="alertNotifications?.alertVerification?.copy"
 		v-bind:isDismissible="false"
 	/>
-	<alert cmsWidgetName="AlertNoMatchWarningWidget" ref="alertNoMatchWarning" v-show="displayNoMatchWarning"
+	<alert ref="alertNoMatchWarning" v-show="displayNoMatchWarning"
 		alertClass="alert-warning"
-		:alertHeadline="alertHeadlineNoMatchWarning"
+		:alertHeadline="alertNotifications?.alertNoMatchWarning?.headline"
-		:alertCopy="alertCopyNoMatchWarning"
+		:alertCopy="alertNotifications?.alertNoMatchWarning?.copy"
 		v-bind:isDismissible="false"
 	/>
 </template>
@@ -69,6 +69,7 @@ export default ({
 			}),
 		},
 		validationRules: String,
+		alertNotifications: {},       
 	},          
 	data() {
 		return {

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

@@ -1,5 +1,5 @@
 <template>
-	<addressQuestions ref="addressQuestions" v-model="customerModel.addressQuestions" />
+	<addressQuestions ref="addressQuestions" v-model="customerModel.addressQuestions" :alertNotifications="alertNotifications" />
 	<div class="row my-4">
 		<div class="col">
 			<textboxQuestion cmsWidgetName="FirstNameQuestionWidget" v-model="customerModel.firstName" ref="firstName" inputId="08497a2efd9a4a73a70360ab47b4838d" disableAutoFill validationRules="first-name-required" />
@@ -52,6 +52,7 @@ export default ({
 			}),
 		},
 		validationRules: String, 
+		alertNotifications: {},      
 	},    
 	computed: {
 		customerModel: {