Document Delivery: Shared component#11408 (#357)

* Document Delivery: Shared component#11408 * Document Delivery: Shared component#11408 * Document Delivery: Shared component#11408 * Document Delivery: Shared component#11408 * Document Delivery: Shared component#11408
bcgov · Mar 18, 2022 · 68f98cb · 68f98cb
1 parent bcecbe8
commit 68f98cb
Show file tree

Hide file tree

Showing 8 changed files with 47 additions and 19 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "business-create-ui",
-  "version": "3.4.10",
+  "version": "3.4.11",
   "private": true,
   "appName": "Create UI",
   "sbcName": "SBC Common Components",

diff --git a/src/components/common/DocumentDelivery.vue b/src/components/common/DocumentDelivery.vue
@@ -3,10 +3,10 @@
     <!-- Registered Office -->
     <v-row no-gutters>
       <v-col cols="12" sm="3" class="pr-4">
-        <label class="title-label">Registered Office</label>
+        <label class="title-label">{{contactLabel}}</label>
       </v-col>
       <v-col cols="12" sm="9">
-        <span id="office-email">{{registeredOfficeEmail || '(Not entered)'}}</span>
+        <span id="office-email">{{contactValue || '(Not entered)'}}</span>
       </v-col>
     </v-row>
 
@@ -41,6 +41,15 @@
         <span id="custodian-email">{{custodianEmail || '(Not entered)'}}</span>
       </v-col>
     </v-row>
+
+     <v-row no-gutters v-if="additionalLabel" class="pt-3">
+      <v-col cols="12" sm="3" class="pr-4">
+        <label class="title-label">{{additionalLabel}}</label>
+      </v-col>
+      <v-col cols="12" sm="9">
+        <span id="additonal-email">{{additionalValue || '(Not entered)'}}</span>
+      </v-col>
+    </v-row>
   </div>
 </template>
 
@@ -50,7 +59,8 @@ import { Component, Emit, Prop, Vue, Watch } from 'vue-property-decorator'
 
 @Component({})
 export default class DocumentDelivery extends Vue {
-  @Prop({ default: null }) readonly registeredOfficeEmail: string
+  @Prop({ required: true }) readonly contactLabel: string
+  @Prop({ default: null }) readonly contactValue: string
   @Prop({ default: null }) readonly custodianEmail: string
   @Prop({ default: null }) readonly completingPartyEmail: string
   @Prop({ default: null }) readonly documentOptionalEmail: string
@@ -59,6 +69,9 @@ export default class DocumentDelivery extends Vue {
   @Prop({ default: false }) readonly showCustodianEmail: boolean
   @Prop({ default: false }) readonly invalidSection: boolean
 
+  @Prop({ default: null }) readonly additionalLabel: string // for additon fields.
+  @Prop({ default: null }) readonly additionalValue: string
+
   // Local properties
   private optionalEmail: string = ''
 

diff --git a/src/views/Dissolution/DissolutionReviewConfirm.vue b/src/views/Dissolution/DissolutionReviewConfirm.vue
@@ -175,12 +175,13 @@
           :editableCompletingParty="isRoleStaff"
           :showCustodianEmail="true"
           :invalidSection="isDocumentDeliveryInvalid"
-          :registeredOfficeEmail="getBusinessContact.email"
+          :contactValue="getBusinessContact.email"
           :custodianEmail="getDissolutionCustodianEmail"
           :completingPartyEmail="getUserEmail"
           :documentOptionalEmail="getDocumentDelivery.documentOptionalEmail"
           @update:optionalEmail="setDocumentOptionalEmail($event)"
           @valid="setDocumentOptionalEmailValidity($event)"
+          contactLabel="Registered Office"
         />
       </v-card>
     </section>

diff --git a/src/views/DissolutionFirm/DissolutionFirm.vue b/src/views/DissolutionFirm/DissolutionFirm.vue
@@ -27,18 +27,22 @@
         </p>
       </header>
       <v-card flat class="mt-6">
+
       <DocumentDelivery
         :class="{ 'invalid-section': isDocumentDeliveryInvalid }"
         :editableCompletingParty="isRoleStaff"
         :showCustodianEmail="false"
         :invalidSection="isDocumentDeliveryInvalid"
-        :registeredOfficeEmail="getBusinessContact.email"
+        :contactValue="getBusinessContact.email"
         :custodianEmail="getDissolutionCustodianEmail"
         :completingPartyEmail="getUserEmail"
         :documentOptionalEmail="getDocumentDelivery.documentOptionalEmail"
         @update:optionalEmail="setDocumentOptionalEmail($event)"
         @valid="setDocumentOptionalEmailValidity($event)"
+        additionalLabel="partners"
+        contactLabel="Business Contact"
       />
+      <!-- TODO change: additionalEmail & additionalLabel are sample data-->
       </v-card>
     </section>
 

diff --git a/src/views/Incorporation/IncorporationReviewConfirm.vue b/src/views/Incorporation/IncorporationReviewConfirm.vue
@@ -55,8 +55,9 @@
       <v-card flat class="mt-6">
         <DocumentDelivery
           class="py-8 px-6"
-          :registeredOfficeEmail="getBusinessContact.email"
+          :contactValue="getBusinessContact.email"
           :completingPartyEmail="getUserEmail"
+          contactLabel="Registered Office"
         />
       </v-card>
     </section>

diff --git a/src/views/Registration/RegistrationReviewConfirm.vue b/src/views/Registration/RegistrationReviewConfirm.vue
@@ -37,10 +37,11 @@
           class="py-8 px-6"
           :class="{ 'invalid-section': isDocumentDeliveryInvalid }"
           :editableCompletingParty="isRoleStaff || isSbcStaff"
-          :registeredOfficeEmail="getBusinessContact.email"
+          :contactValue="getBusinessContact.email"
           :completingPartyEmail="getUserEmail"
           :invalidSection="isDocumentDeliveryInvalid"
           @valid="setDocumentOptionalEmailValidity($event)"
+          contactLabel="Registered Office"
         />
       </v-card>
     </section>

diff --git a/tests/unit/DocumentDelivery.spec.ts b/tests/unit/DocumentDelivery.spec.ts
@@ -43,20 +43,25 @@ for (const mock of documentDeliveryCases) {
     let wrapper: any
 
     it('renders the component properly', () => {
-      wrapper = shallowWrapperFactory(DocumentDelivery)
+      wrapper = shallowWrapperFactory(DocumentDelivery, {
+        contactLabel: 'Registered Office'
+      })
       expect(wrapper.find('#document-delivery').exists()).toBe(true)
     })
 
     it('displays email labels', () => {
-      wrapper = shallowWrapperFactory(DocumentDelivery)
+      wrapper = shallowWrapperFactory(DocumentDelivery, {
+        contactLabel: 'Registered Office'
+      })
       expect(wrapper.findAll('label').at(0).text()).toBe('Registered Office')
       expect(wrapper.findAll('label').at(1).text()).toBe('Completing Party')
     })
 
     it('displays email computed values', () => {
       wrapper = shallowWrapperFactory(DocumentDelivery, {
-        registeredOfficeEmail: mock.businessContact.email,
-        completingPartyEmail: mock.tombstone.userEmail
+        contactValue: mock.businessContact.email,
+        completingPartyEmail: mock.tombstone.userEmail,
+        contactLabel: 'Registered Office'
       })
       expect(wrapper.find('#completing-party-email').text()).toBe(mock.tombstone.userEmail)
       expect(wrapper.find('#office-email').text()).toBe(mock.businessContact.email)
@@ -67,27 +72,30 @@ for (const mock of documentDeliveryCases) {
       mock.businessContact.email = ''
 
       wrapper = shallowWrapperFactory(DocumentDelivery, {
-        registeredOfficeEmail: mock.businessContact.email,
-        completingPartyEmail: mock.tombstone.userEmail
+        contactValue: mock.businessContact.email,
+        completingPartyEmail: mock.tombstone.userEmail,
+        contactLabel: 'Registered Office'
       })
       expect(wrapper.find('#completing-party-email').text()).toBe('(Not entered)')
       expect(wrapper.find('#office-email').text()).toBe('(Not entered)')
     })
 
     it('displays optionalEmail', () => {
       wrapper = shallowWrapperFactory(DocumentDelivery, {
-        registeredOfficeEmail: mock.businessContact.email,
+        contactValue: mock.businessContact.email,
         completingPartyEmail: mock.tombstone.userEmail,
-        editableCompletingParty: mock.optionalEmail
+        editableCompletingParty: mock.optionalEmail,
+        contactLabel: 'Registered Office'
       })
       expect(wrapper.find('#optionalEmail').exists()).toBe(mock.optionalEmail)
     })
 
     it('displays showCustodianEmail', () => {
       wrapper = shallowWrapperFactory(DocumentDelivery, {
-        registeredOfficeEmail: mock.businessContact.email,
+        contactValue: mock.businessContact.email,
         completingPartyEmail: mock.tombstone.userEmail,
-        showCustodianEmail: mock.custodianEmail
+        showCustodianEmail: mock.custodianEmail,
+        contactLabel: 'Registered Office'
       })
       expect(wrapper.find('#custodian-email').exists()).toBe(mock.custodianEmail)
     })