Optional International Address

ppr-ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ppr-ui",
-  "version": "3.2.69",
+  "version": "3.2.70",
   "private": true,
   "appName": "Assets UI",
   "sbcName": "SBC Common Components",

ppr-ui/src/composables/address/BaseAddress.vue

@@ -242,6 +242,7 @@ export default defineComponent({
     } = useAddress(toRef(addressProp), localSchema)
     const origPostalCodeRules = localSchema.postalCode
     const origRegionRules = localSchema.region
+    const origCityRules = localSchema.city
 
     const { addressForm, validate } = useBaseValidations()
 
@@ -256,12 +257,16 @@ export default defineComponent({
       if (val === 'CA') {
         localSchema.postalCode = origPostalCodeRules.concat([baseRules.postalCode])
         localSchema.region = origRegionRules
+        localSchema.city = origCityRules
       } else if (val === 'US') {
         localSchema.postalCode = origPostalCodeRules.concat([baseRules.zipCode])
         localSchema.region = origRegionRules
+        localSchema.city = origCityRules
       } else {
-        localSchema.postalCode = origPostalCodeRules.concat([baseRules.maxLength(15)])
+        // Convert to optional rules for non-CA/US countries
+        localSchema.postalCode = [baseRules.maxLength(15), ...spaceRules]
         localSchema.region = [baseRules.maxLength(2), ...spaceRules]
+        localSchema.city = [baseRules.maxLength(40), ...spaceRules]
       }
       // reset other address fields (check is for loading an existing address)
       if (oldVal) {

ppr-ui/src/views/newRegistration/AddCollateral.vue

@@ -1,7 +1,7 @@
 <template>
-  <span
+  <v-container
     v-if="dataLoaded"
-    class="footer-view-container pa-0"
+    class="pa-0 footer-view-container"
   >
     <div class="py-0">
       <div class="container pa-0 pt-4">
@@ -65,19 +65,12 @@
         </v-row>
       </div>
     </div>
-    <v-row
-      noGutters
-      class="pt-10"
-    >
-      <v-col cols="12">
-        <ButtonFooter
-          :navConfig="getFooterButtonConfig"
-          :currentStepName="stepName"
-          @error="emitError($event)"
-        />
-      </v-col>
-    </v-row>
-  </span>
+    <ButtonFooter
+      :navConfig="getFooterButtonConfig"
+      :currentStepName="stepName"
+      @error="emitError($event)"
+    />
+  </v-container>
 </template>
 
 <script lang="ts">

ppr-ui/tests/unit/ContactInformation.spec.ts

@@ -184,7 +184,7 @@ describe('Contact Information', () => {
 
     expect(wrapper.vm.contactInfoType).toBe(ContactTypes.PERSON)
     expect(wrapper.find(BORDER_ERROR).exists()).toBe(true)
-    // errors: first name, last name, country, address, city, postal code
-    expect(wrapper.findAll(ERROR_MSG).length).toBe(6)
+    // With no country selected - errors: first name, last name, country, address line 1
+    expect(wrapper.findAll(ERROR_MSG).length).toBe(4)
   })
 })

ppr-ui/tests/unit/SecuredPartyValidation.spec.ts

@@ -32,7 +32,8 @@ describe('Secured Party validation tests - business', () => {
     await flushPromises()
     await nextTick()
     const messages = wrapper.findAll(ERROR_MSG)
-    expect(messages.length).toBe(5)
+    // With no country selected - errors: business name, country, address line 1
+    expect(messages.length).toBe(3)
     expect(messages.at(0).text()).toBe('Please enter a business name')
   })
 })
@@ -55,7 +56,8 @@ describe('Secured Party validation tests - individual', () => {
     await flushPromises()
 
     const messages = wrapper.findAll(ERROR_MSG)
-    expect(messages.length).toBe(6)
+    // With no country selected - errors: first name, last name, country, address line 1
+    expect(messages.length).toBe(4)
     expect(messages.at(0).text()).toBe('Please enter a first name')
     expect(messages.at(1).text()).toBe('Please enter a last name')
   })