Moved 'useForm' into modal component

src/digital-components/modal/modal.spec.js

@@ -1,10 +1,14 @@
 import { shallowMount } from "@vue/test-utils";
 import Modal from "./modal";
+import crypto from "crypto";
+import { useForm } from "vee-validate";
 
 const modalId = "modal-one";
 const footerButtonText = "Sample footer text here.";
 const headerText = "Sample header text here.";
 
+global.crypto = crypto;
+
 describe("modal.vue", () => {
     it("Should display footer button text when footerButtonText is defined", async () => {
         const wrapper = shallowMount(Modal, {

src/digital-components/modal/modal.vue

@@ -43,7 +43,7 @@
 <script>
 import buttonMain from "@/ux-components/button-main/button-main";
 import { Modal } from "bootstrap";
-import { useIsFormTouched, useIsFormDirty, useIsFormValid } from "vee-validate";
+import { useForm, useIsFormTouched, useIsFormDirty, useIsFormValid } from "vee-validate";
 
 export default {
     name: "modal",
@@ -60,12 +60,14 @@ export default {
     setup() {
         const modalId = `modal-${crypto.randomUUID()}`;
 
+        const modalForm = useForm();
         const isTouched = useIsFormTouched();
         const isDirty = useIsFormDirty();
         const isValid = useIsFormValid();
 
         return {
             modalId,
+            modalForm,
             isTouched,
             isDirty,
             isValid,

src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue

@@ -68,13 +68,6 @@ export default {
             },
         };
     },
-    setup() {
-        const modalForm = useForm();
-
-        return {
-            modalForm,
-        };
-    },
     props: {
         modelValue: {
             type: Object,

src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.vue

@@ -71,13 +71,6 @@ export default {
         textboxQuestionWidgetName: String,
         alertInvalidZipWidgetName: String,
     },
-    setup() {
-        const modalForm = useForm();
-
-        return {
-            modalForm,
-        };
-    },
     computed: {
         serviceZipLinkText() {
             if (this.modelValue.zipCode && this.modelValue.zipCode.length > 0) {