Unit Testing Refactors (#2096)

* Unit testing updates

* Unit Testing Updates

* version bump

* updated import name

ppr-ui/nuxt.config.ts

@@ -85,16 +85,6 @@ export default defineNuxtConfig({
     icons: ['mdi']
   },
   ssr: false,
-  server: {
-    hmr: {
-      overlay: false, // Disable the error overlay
-      clientPort: 443, // Specify the client port if needed
-    },
-    watch: {
-      usePolling: true, // Use polling for file changes
-      interval: 1000, // Polling interval in milliseconds
-    },
-  },
   modules: ['@pinia/nuxt', '@nuxt/eslint', 'nuxt-lodash', '@nuxt/test-utils/module',
     (_options, nuxt) => {
       nuxt.hooks.hook('vite:extendConfig', (config) => {

ppr-ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ppr-ui",
-  "version": "4.0.0",
+  "version": "4.0.1",
   "private": true,
   "appName": "Assets UI",
   "sbcName": "SBC Common Components",
@@ -82,8 +82,8 @@
     "eslint-plugin-promise": "^6.1.1",
     "eslint-plugin-vue": "^9.17.0",
     "eslint-plugin-vuetify": "^2.0.5",
-    "jsdom": "^22.1.0",
     "happy-dom": "^14.12.0",
+    "jsdom": "^22.1.0",
     "maska": "^2.1.10",
     "nuxt-lodash": "^2.5.3",
     "sass": "~1.32.13",

ppr-ui/src/app.vue

@@ -16,12 +16,12 @@ import {
   getFees,
   getFeatureFlag,
   getKeycloakRoles,
-  getPPRUserSettings,
   getSbcFromAuth,
   updateLdUser,
   axios,
   parsePayDetail
 } from '@/utils'
+import { getPPRUserSettings  } from '@/utils/ppr-api-helper'
 import { FeeCodes } from '@/composables/fees/enums'
 import {
   APIRegistrationTypes,

ppr-ui/src/components/collateral/Collateral.vue

@@ -11,7 +11,7 @@
       flat
     >
       <v-row
-        noGutters
+        no-gutters
         class="summary-header py-2"
       >
         <v-col
@@ -31,7 +31,7 @@
         :class="{ 'border-error-left': !valid }"
       >
         <v-row
-          noGutters
+          no-gutters
           class="pa-6 pl-4"
         >
           <v-col cols="auto">
@@ -49,16 +49,16 @@
       </v-container>
       <VehicleCollateral
         v-if="vehicleCollateralLength > 0 || !summaryView"
-        :isSummary="summaryView"
-        :showInvalid="collateral.showInvalid"
-        :setShowErrorBar="showErrorBar && vehicleCollateralOpen"
-        @collateralOpen="setVehicleCollateralOpen($event)"
+        :is-summary="summaryView"
+        :show-invalid="collateral.showInvalid"
+        :set-show-error-bar="showErrorBar && vehicleCollateralOpen"
+        @collateral-open="setVehicleCollateralOpen($event)"
       />
       <GeneralCollateral
         v-if="showGeneralCollateral"
-        :isSummary="summaryView"
-        :setShowErrorBar="showErrorBar && generalCollateralOpen"
-        @collateralOpen="setGeneralCollateralOpen($event)"
+        :is-summary="summaryView"
+        :set-show-error-bar="showErrorBar && generalCollateralOpen"
+        @collateral-open="setGeneralCollateralOpen($event)"
       />
     </v-card>
   </v-container>
@@ -68,7 +68,7 @@
     class="pa-0 noGutters"
     fluid
   >
-    <v-row noGutters>
+    <v-row no-gutters>
       <v-col
         cols="auto"
         class="generic-label"
@@ -79,7 +79,7 @@
     <v-row
       id="collateral-edit-description"
       class="pt-6"
-      noGutters
+      no-gutters
     >
       <v-col cols="auto">
         <ul
@@ -98,16 +98,16 @@
       </v-col>
     </v-row>
     <VehicleCollateral
-      :isSummary="false"
-      :showInvalid="collateral.showInvalid && !valid && hasVehicleCollateral()"
-      @collateralOpen="setVehicleCollateralOpen($event)"
+      :is-summary="false"
+      :show-invalid="collateral.showInvalid && !valid && hasVehicleCollateral()"
+      @collateral-open="setVehicleCollateralOpen($event)"
     />
     <GeneralCollateral
       v-if="hasGeneralCollateral(registrationType)"
       class="pt-8"
-      :isSummary="false"
-      :setShowInvalid="collateral.showInvalid && !valid"
-      @collateralOpen="setGeneralCollateralOpen($event)"
+      :is-summary="false"
+      :set-show-invalid="collateral.showInvalid && !valid"
+      @collateral-open="setGeneralCollateralOpen($event)"
     />
   </v-container>
 </template>
@@ -124,15 +124,15 @@ import {
 } from 'vue'
 import { useStore } from '@/store/store'
 import { useRouter } from 'vue-router'
-import { GeneralCollateral } from './generalCollateral'
-import { VehicleCollateral } from './vehicleCollateral'
+import { GeneralCollateral } from './general'
+import { VehicleCollateral } from './vehicle'
 import { ActionTypes, APIRegistrationTypes, RegistrationFlowType } from '@/enums'
-import {
+import type {
   AddCollateralIF,
   GeneralCollateralIF,
 } from '@/interfaces'
-import { useGeneralCollateral } from './generalCollateral/factories'
-import { useVehicle } from './vehicleCollateral/factories'
+import { useGeneralCollateral } from './general/factories'
+import { useVehicle } from './vehicle/factories'
 import { storeToRefs } from 'pinia'
 
 export default defineComponent({

ppr-ui/src/components/collateral/generalCollateral/GeneralCollateral.vue → ppr-ui/src/components/collateral/general/GeneralCollateral.vue

@@ -1,27 +1,33 @@
 <template>
   <div class="pa-0 ma-0">
+    <GenColSummary
+      :set-show-history="false"
+      :set-show-amend-link="!amendMode"
+      @init-gen-col-amend="amendMode = $event"
+    />
     <v-container
       v-if="registrationFlowType === RegistrationFlowType.AMENDMENT && amendMode"
     >
       <GenColAmend
-        :setShowErrorBar="showErrorBar"
-        @closeGenColAmend="amendMode = false"
+        :set-show-error-bar="showErrorBar"
+        @close-gen-col-amend="amendMode = false"
       />
     </v-container>
     <v-container
       v-if="summaryView || registrationFlowType === RegistrationFlowType.AMENDMENT"
+      id="gen-col-summary-container"
     >
       <GenColSummary
-        :setShowHistory="false"
-        :setShowAmendLink="!amendMode"
-        @initGenColAmend="amendMode = $event"
+        :set-show-history="false"
+        :set-show-amend-link="!amendMode"
+        @init-gen-col-amend="amendMode = $event"
       />
     </v-container>
     <v-container
       v-else
       class="px-0"
     >
-      <GenColEdit :showInvalid="showInvalid" />
+      <GenColEdit :show-invalid="showInvalid" />
     </v-container>
   </div>
 </template>
@@ -34,8 +40,10 @@ import {
   watch,
   toRefs
 } from 'vue'
-import { GenColEdit, GenColSummary, GenColAmend } from '.'
-import { APIRegistrationTypes, RegistrationFlowType } from '@/enums'
+import GenColSummary from './GenColSummary.vue'
+import { GenColEdit, GenColAmend } from './'
+import type { APIRegistrationTypes} from '@/enums';
+import { RegistrationFlowType } from '@/enums'
 import { useStore } from '@/store/store'
 import { storeToRefs } from 'pinia'
 

ppr-ui/src/components/collateral/index.ts

@@ -1,3 +1,3 @@
-export * from './generalCollateral'
-export * from './vehicleCollateral'
+export * from './general'
+export * from './vehicle'
 export { default as Collateral } from './Collateral.vue'

ppr-ui/src/components/collateral/vehicleCollateral/VehicleCollateral.vue → ppr-ui/src/components/collateral/vehicle/VehicleCollateral.vue

@@ -6,7 +6,7 @@
   >
     <v-row
       v-if="vehicleCollateral && vehicleCollateral.length > 0"
-      noGutters
+      no-gutters
       :class="registrationFlowType !== RegistrationFlowType.AMENDMENT ? 'ps-6' : ''"
     >
       <v-col
@@ -52,15 +52,15 @@
                   <div v-if="item.action && registrationFlowType === RegistrationFlowType.AMENDMENT">
                     <v-chip
                       v-if="item.action === ActionTypes.REMOVED"
-                      xSmall
+                      x-small
                       variant="elevated"
                       color="greyLighten"
                     >
                       {{ item.action }}
                     </v-chip>
                     <v-chip
                       v-else
-                      xSmall
+                      x-small
                       variant="elevated"
                       color="#1669BB"
                     >
@@ -109,7 +109,7 @@
   >
     <v-row
       v-if="(hasVehicleCollateral() || hasOptionalVehicleCollateral()) && !isRepairersLienAmendment"
-      noGutters
+      no-gutters
       class="pb-4 pt-10 pl-1"
     >
       <v-col>
@@ -128,7 +128,7 @@
     <v-row
       v-if="(hasVehicleCollateral() || hasOptionalVehicleCollateral())"
       :class="showErrorBar ? 'error-margin' : ''"
-      noGutters
+      no-gutters
     >
       <v-col>
         <div>
@@ -139,10 +139,10 @@
               class="add-collateral-container"
             >
               <EditCollateral
-                :activeIndex="activeIndex"
-                :invalidSection="invalidSection"
-                :setShowErrorBar="showErrorBar"
-                @resetEvent="resetData"
+                :active-index="activeIndex"
+                :invalid-section="invalidSection"
+                :set-show-error-bar="showErrorBar"
+                @reset-event="resetData"
               />
             </v-card>
           </v-expand-transition>
@@ -151,7 +151,7 @@
     </v-row>
     <v-row
       v-if="(hasVehicleCollateral() || hasOptionalVehicleCollateral())"
-      noGutters
+      no-gutters
       class="pt-4"
     >
       <v-col :class="{ 'box-shadow-left': showErrorBar && activeIndex >= 0 }">
@@ -187,11 +187,11 @@
                   <td :colspan="getNumCols">
                     <div class="edit-vehicle-container col-12">
                       <edit-collateral
-                        :activeIndex="activeIndex"
-                        :invalidSection="invalidSection"
-                        :setShowErrorBar="showErrorBar"
-                        @removeVehicle="removeVehicle($event)"
-                        @resetEvent="resetData"
+                        :active-index="activeIndex"
+                        :invalid-section="invalidSection"
+                        :set-show-error-bar="showErrorBar"
+                        @remove-vehicle="removeVehicle($event)"
+                        @reset-event="resetData"
                       />
                     </div>
                   </td>
@@ -205,15 +205,15 @@
                     <div v-if="item.action && registrationFlowType === RegistrationFlowType.AMENDMENT">
                       <v-chip
                         v-if="item.action === ActionTypes.REMOVED"
-                        xSmall
+                        x-small
                         variant="elevated"
                         color="greyLighten"
                       >
                         {{ item.action }}
                       </v-chip>
                       <v-chip
                         v-else
-                        xSmall
+                        x-small
                         variant="elevated"
                         color="#1669BB"
                       >
@@ -237,7 +237,7 @@
                       <span v-if="isRepairersLienAmendment && !item.action">
                         <v-tooltip
                           location="top"
-                          contentClass="top-tooltip pa-4 mr-2"
+                          content-class="top-tooltip pa-4 mr-2"
                           transition="fade-transition"
                           :disabled="!isLastDelete"
                         >
@@ -419,7 +419,7 @@ import {
 import { useStore } from '@/store/store'
 import { EditCollateral } from '.'
 import { ActionTypes, APIVehicleTypes, RegistrationFlowType, APIRegistrationTypes } from '@/enums'
-import { VehicleCollateralIF } from '@/interfaces'
+import type { VehicleCollateralIF } from '@/interfaces'
 import { vehicleTableHeaders, VehicleTypes } from '@/resources'
 import { useVehicle } from './factories/useVehicle'
 import { cloneDeep } from 'lodash'
@@ -555,7 +555,7 @@ export default defineComponent({
         currentVehicle.action = ActionTypes.REMOVED
         newVCollateral.splice(index, 1, currentVehicle)
       } else {
-        // eslint-disable-line
+         
         newVCollateral.splice(index, 1)
       }
       setVehicleCollateral(newVCollateral)

ppr-ui/src/components/common/DocumentId.vue

@@ -19,7 +19,7 @@
         :class="[{ 'border-error-left': showBorderError }, { 'pb-8': content.hintText }]"
         flat
       >
-        <v-row noGutters>
+        <v-row no-gutters>
           <v-col
             cols="12"
             sm="3"
@@ -46,9 +46,9 @@
               :disabled="generateDocumentId"
               :rules="documentIdRules"
               :error="!isUniqueDocId && validate && !generateDocumentId"
-              :errorMessages="uniqueDocIdError"
+              :error-messages="uniqueDocIdError"
               :hint="content.hintText"
-              :persistentHint="Boolean(content.hintText)"
+              :persistent-hint="Boolean(content.hintText)"
             >
               <template #append-inner>
                 <v-progress-circular
@@ -78,7 +78,7 @@
                 <p>Generate a Document ID Number upon filing.</p>
                 <v-tooltip
                   location="top"
-                  contentClass="top-tooltip"
+                  content-class="top-tooltip"
                   transition="fade-transition"
                 >
                   <template #activator="{ props }">
@@ -107,8 +107,8 @@
 
 <script lang="ts">
 import { computed, defineComponent, nextTick, reactive, ref, toRefs, watch } from 'vue'
-import { validateDocumentID } from '@/utils'
-import { ContentIF, FormIF, MhrDocIdResponseIF } from '@/interfaces'
+import { validateDocumentID } from '@/utils/mhr-api-helper'
+import type { ContentIF, FormIF, MhrDocIdResponseIF } from '@/interfaces'
 import { useInputRules } from '@/composables'
 import { storeToRefs } from 'pinia'
 import { useStore } from '@/store/store'