18538 Resulting Business Name and Type component (WIP) (bcgov#591)

* PR (TODO fix unit tests)

* Added unit tests for numbered am

* Fixed test case and update from comments

* Added additional test case

* Updated unit test formatting.

* Updated package.json

* Added bullet points for numberd AML

* Fixed test cases

package.json

@@ -1,6 +1,6 @@
 {
   "name": "business-create-ui",
-  "version": "5.6.9",
+  "version": "5.6.10",
   "private": true,
   "appName": "Create UI",
   "sbcName": "SBC Common Components",

src/components/Amalgamation/BusinessTypeHelp.vue

@@ -0,0 +1,35 @@
+<template>
+  <section class="business-type-help mt-0">
+    <header>
+      <h3 class="text-center">
+        Help with Resulting Business Type
+      </h3>
+      <div class="mt-6">
+        <p class="ml-1">
+          A BC Limited Company and BC Community Contribution Company can amalgamate
+          but must form a BC Community Contribution Company. - BCA s. 51.98
+        </p>
+        <p class="ml-1">
+          A BC Unlimited Liability Company and BC Community Contribution
+          Company can amalgamate but must form a BC Community Contribution Company. - BCA s. 51.98
+        </p>
+        <p class="ml-1">
+          For assistance with amalgamations involving extraprovincial corporations, please contact BC Registries staff:
+        </p>
+      </div>
+      <br>
+      <RegistriesContactInfo />
+    </header>
+  </section>
+</template>
+<script lang="ts">
+import { Component, Vue } from 'vue-property-decorator'
+import RegistriesContactInfo from '@/components/common/RegistriesContactInfo.vue'
+
+@Component({
+  components: {
+    RegistriesContactInfo
+  }
+})
+export default class BusinessTypeHelp extends Vue {}
+</script>

src/components/common/NameRequestInfo.vue

@@ -97,7 +97,63 @@
         </v-row>
       </div>
     </template>
+    <template v-else-if="isAmalgamationFiling && !getNameRequestNumber">
+      <!-- Numbered Amalgamation-->
+      <div class="section-container">
+        <v-row
+          id="numbered-amalgamation-info"
+          no-gutters
+        >
+          <v-col
+            cols="12"
+            sm="3"
+            class="pr-4"
+          >
+            <label>Resulting Business Name</label>
+          </v-col>
 
+          <v-col
+            cols="12"
+            sm="9"
+          >
+            <ul class="numbered-company-list-items">
+              <li id="numbered-company-title">
+                <strong>[Incorporation Number]</strong> B.C. LTD.
+              </li>
+              <li class="bullet-point mt-4 ml-6">
+                You will be filing this Incorporation Application for a company
+                created by adding "B.C. LTD." after the Incorporation Number.
+              </li>
+              <li class="bullet-point ml-6">
+                Your Incorporation Number will be generated at the end of the filing
+                transaction.
+              </li>
+              <li class="bullet-point ml-6">
+                It is not possible to request a specific Incorporation Number.
+              </li>
+            </ul>
+          </v-col>
+          <v-col
+            cols="12"
+            sm="3"
+            class="pr-4 mt-4"
+          >
+            <label>Resulting Business Type</label>
+          </v-col>
+          <v-col
+            cols="12"
+            sm="9"
+            class="mt-4"
+          >
+            <ul class="entity-type-description">
+              <li>
+                {{ getEntityTypeDescription }}
+              </li>
+            </ul>
+          </v-col>
+        </v-row>
+      </div>
+    </template>
     <template v-else>
       <!-- Numbered Company -->
       <div class="section-container">
@@ -171,6 +227,7 @@ export default class NameRequestInfo extends Mixins(CommonMixin, DateMixin) {
   @Getter(useStore) getNameRequestApprovedName!: string
   @Getter(useStore) getNameRequestNumber!: string
   @Getter(useStore) isTypeSoleProp: boolean
+  @Getter(useStore) isAmalgamationFiling!: boolean
 
   /** The entity type description.  */
   get getEntityTypeDescription (): string {
@@ -186,6 +243,7 @@ export default class NameRequestInfo extends Mixins(CommonMixin, DateMixin) {
     switch (this.getNameRequest.request_action_cd) {
       case NrRequestActionCodes.NEW_BUSINESS: return 'New Business'
       case NrRequestActionCodes.RESTORE: return 'Restoration Request'
+      case NrRequestActionCodes.AMALGAMATE: return 'Amalgamation'
     }
     return '' // should never happen
   }

src/views/AmalgamationRegular/Information.vue

@@ -27,7 +27,7 @@
         helpLabel="Help with Business Type"
       >
         <template #content>
-          [*** TODO: help text component ***]
+          <BusinessTypeHelp />
         </template>
       </ExpandableHelp>
 
@@ -50,13 +50,15 @@ import { DefineCompanyIF } from '@/interfaces'
 import { CommonMixin } from '@/mixins'
 import { RouteNames } from '@/enums'
 import { ExpandableHelp } from '@bcrs-shared-components/expandable-help'
+import AmalgamatingBusinesses from '@/components/Amalgamation/AmalgamatingBusinesses.vue'
+import BusinessTypeHelp from '@/components/Amalgamation/BusinessTypeHelp.vue'
 import NameRequestInfo from '@/components/common/NameRequestInfo.vue'
 import NameTranslations from '@/components/common/NameTranslations.vue'
-import AmalgamatingBusinesses from '@/components/Amalgamation/AmalgamatingBusinesses.vue'
 
 @Component({
   components: {
     AmalgamatingBusinesses,
+    BusinessTypeHelp,
     ExpandableHelp,
     NameRequestInfo,
     NameTranslations

tests/unit/NameRequestInfo.spec.ts

@@ -4,7 +4,7 @@ import { mount } from '@vue/test-utils'
 import { createPinia, setActivePinia } from 'pinia'
 import { useStore } from '@/store/store'
 import NameRequestInfo from '@/components/common/NameRequestInfo.vue'
-import { NameRequestStates } from '@/enums'
+import { NameRequestStates, FilingTypes } from '@/enums'
 import { CorpTypeCd } from '@bcrs-shared-components/corp-type-module'
 import { NameRequestIF } from '@/interfaces'
 
@@ -216,6 +216,47 @@ describe('Name Request Info with a NR', () => {
   })
 })
 
+describe('Numbered Amalgamation Info component', () => {
+  let wrapper: any
+
+  beforeEach(() => {
+    store.stateModel.tombstone.filingType = FilingTypes.AMALGAMATION
+    store.stateModel.tempId = 'T1234567'
+    store.stateModel.entityType = CorpTypeCd.BENEFIT_COMPANY
+    store.stateModel.nameRequest.nrNum = null
+    store.stateModel.nameRequestApprovedName = null
+    wrapper = mount(NameRequestInfo, { vuetify })
+  })
+
+  afterEach(() => {
+    wrapper.destroy()
+  })
+
+  it('renders numbered company info', () => {
+    expect(wrapper.vm.$el.querySelector('#numbered-amalgamation-info').textContent)
+      .toContain('Resulting Business Name')
+
+    expect(wrapper.vm.$el.querySelector('.numbered-company-list-items')).toBeDefined()
+  })
+
+  it('renders the numbered amalgamation content', () => {
+    const listItems = wrapper.vm.$el.querySelectorAll('.numbered-company-list-items li')
+    expect(listItems.length).toEqual(4)
+
+    expect(listItems[0].textContent).toContain('[Incorporation Number] B.C. LTD.')
+    expect(listItems[1].textContent).toContain('You will be filing this Incorporation Application')
+    expect(listItems[2].textContent).toContain('Your Incorporation Number will be generated at the end')
+    expect(listItems[3].textContent).toContain('It is not possible to request a specific Incorporation Number')
+  })
+
+  it('renders the entity type description content', () => {
+    const listItems = wrapper.vm.$el.querySelectorAll('.entity-type-description li')
+    expect(listItems.length).toEqual(1)
+
+    expect(listItems[0].textContent).toContain(' BC Benefit Company ')
+  })
+})
+
 describe('Name Request Info component without a NR', () => {
   let wrapper: any
 
@@ -226,6 +267,7 @@ describe('Name Request Info component without a NR', () => {
     store.stateModel.tempId = 'T1234567'
     store.stateModel.nameRequest.nrNum = null
     store.stateModel.nameRequestApprovedName = null
+    store.stateModel.tombstone.filingType = FilingTypes.REGISTRATION
     wrapper = mount(NameRequestInfo, { vuetify })
   })