FE - removed isDevelopedInBC field, autocomplete component updated

Signed-off-by: Sanjay Babu <sanjaytkbabu@gmail.com>

Author: sanjaytkbabu

frontend/src/components/form/AutoComplete.vue

@@ -4,7 +4,7 @@ import { onBeforeMount } from 'vue';
 
 import { AutoComplete } from '@/lib/primevue';
 
-import type { AutoCompleteCompleteEvent } from 'primevue/autocomplete';
+import type { AutoCompleteChangeEvent, AutoCompleteCompleteEvent } from 'primevue/autocomplete';
 
 // Props
 
@@ -37,7 +37,7 @@ const {
 }>();
 
 // Emits
-const emit = defineEmits(['onComplete', 'onSelect']);
+const emit = defineEmits(['onChange', 'onComplete', 'onSelect']);
 const { errorMessage, handleBlur, value, resetField } = useField<string>(name);
 
 onBeforeMount(() => {
@@ -72,6 +72,7 @@ onBeforeMount(() => {
       :placeholder="placeholder"
       :suggestions="suggestions"
       @blur="handleBlur"
+      @change="(e: AutoCompleteChangeEvent) => emit('onChange', e)"
       @complete="(e: AutoCompleteCompleteEvent) => emit('onComplete', e)"
       @option-select="(e) => emit('onSelect', e.value)"
     />

frontend/src/components/housing/project/ProjectForm.vue

@@ -208,7 +208,6 @@ function initializeFormValues(project: HousingProject) {
     project: {
       companyIdRegistered: project.companyIdRegistered,
       companyNameRegistered: project.companyNameRegistered,
-      isDevelopedInBc: project.companyIdRegistered ? BasicResponse.YES : BasicResponse.NO,
       projectName: project.projectName
     },
 
@@ -431,7 +430,6 @@ const onSubmit = async (values: any) => {
         'contactPreference',
         'contactUserId',
         'assignedUser',
-        'isDevelopedInBc',
         'submissionState',
         'locationAddress',
         'relatedEnquiries'
@@ -547,22 +545,14 @@ onBeforeMount(async () => {
               </h3>
             </div>
           </template>
-          <div class="grid grid-cols-2 gap-x-6 gap-y-6">
-            <Select
-              name="project.isDevelopedInBc"
-              :label="t('i.housing.project.projectForm.companyRegisteredInBC')"
-              :disabled="!editable"
-              :options="YES_NO_LIST"
-              @on-change="setFieldValue('project.companyIdRegistered', null)"
-            />
+          <div class="grid grid-cols-3 gap-x-6 gap-y-6">
             <InputText
               name="project.projectName"
               :label="t('i.housing.project.projectForm.projectNameLabel')"
               :disabled="!editable"
               @on-input="emitProjectNameChange"
             />
             <AutoComplete
-              v-if="values.project.isDevelopedInBc === BasicResponse.YES"
               name="project.companyNameRegistered"
               :label="t('i.housing.project.projectForm.companyLabel')"
               :bold="true"
@@ -571,6 +561,7 @@ onBeforeMount(async () => {
               :placeholder="t('i.common.projectForm.searchBCRegistered')"
               :get-option-label="(option: OrgBookOption) => option.registeredName"
               :suggestions="orgBookOptions"
+              @on-change="setFieldValue('project.companyIdRegistered', null)"
               @on-complete="onRegisteredNameInput"
               @on-select="
                 (orgBookOption: OrgBookOption) => {
@@ -580,23 +571,6 @@ onBeforeMount(async () => {
               "
             />
             <InputText
-              v-else
-              name="project.companyNameRegistered"
-              :label="t('i.housing.project.projectForm.companyLabel')"
-              :disabled="!editable"
-              @on-change="
-                (e) => {
-                  setFieldValue('project.companyIdRegistered', null);
-                  if (!e.target.value) {
-                    setFieldValue('project.companyNameRegistered', null);
-                    setFieldValue('project.isDevelopedInBc', null);
-                  }
-                }
-              "
-            />
-
-            <InputText
-              v-if="values.project.isDevelopedInBc === BasicResponse.YES"
               name="project.companyIdRegistered"
               :label="t('i.common.projectForm.bcRegistryId')"
               :disabled="true"

frontend/src/components/housing/project/ProjectFormSchema.ts

@@ -108,12 +108,6 @@ export function createProjectFormSchema() {
         .notRequired()
         .max(255)
         .label(t('i.housing.project.projectFormSchema.projectCompanyNameRegistered')),
-      isDevelopedInBc: string().when('companyNameRegistered', {
-        is: (val: string) => val,
-        then: (schema) =>
-          schema.required().oneOf(YES_NO_LIST).label(t('i.housing.project.projectFormSchema.projectIsDevelopedInBc')),
-        otherwise: () => string().notRequired()
-      }),
       projectName: string().required().max(255).label(t('i.housing.project.projectFormSchema.projectProjectName'))
     }),
     projectDescription: string().notRequired().label(t('i.housing.project.projectFormSchema.projectDescription')),

frontend/src/locales/en-CA.json

@@ -462,7 +462,6 @@
           "priorityNumber": "Priority must be a number",
           "projectLocationDescription": "Additional information about location",
           "projectCompanyNameRegistered": "Company name",
-          "projectIsDevelopedInBc": "Company registered in B.C",
           "projectProjectName": "Project name",
           "projectDescription": "Additional information about project",
           "relatedEnquiries": "Related enquiries",

frontend/tests/unit/components/housing/project/ProjectForm.spec.ts

@@ -187,7 +187,7 @@ describe('ProjectForm.vue', () => {
     await nextTick();
 
     const elements = wrapper.findAll('.p-select-dropdown');
-    expect(elements.length).toBe(17);
+    expect(elements.length).toBe(16);
   });
 
   it('renders the correct amount of input components', async () => {
@@ -266,6 +266,9 @@ describe('ProjectForm.vue', () => {
       }));
 
     expect(notDisabled).toEqual([]);
+    const elements = wrapper.findAll('.p-disabled');
+    expect(wrapper.vm.$props?.editable).toBe(false);
+    expect(elements.length).toBe(21);
   });
 
   it('geojson download btn not visible when no geojson', async () => {
@@ -312,8 +315,7 @@ describe('onRegisteredNameInput', () => {
   });
 
   it('should not call searchOrgBook when query length is less than 2', async () => {
-    const modifiedSubmission = { ...testSubmission };
-    const wrapper = mount(ProjectForm, wrapperSettings(modifiedSubmission));
+    const wrapper = mount(ProjectForm, wrapperSettings(testSubmission));
     await nextTick();
     await nextTick();
 
@@ -340,8 +342,7 @@ describe('onRegisteredNameInput', () => {
 
     searchOrgBookSpy.mockResolvedValue(mockResponse as AxiosResponse);
 
-    const modifiedSubmission = { ...testSubmission };
-    const wrapper = mount(ProjectForm, wrapperSettings(modifiedSubmission));
+    const wrapper = mount(ProjectForm, wrapperSettings(testSubmission));
     await nextTick();
     await nextTick();
 
@@ -371,8 +372,7 @@ describe('onRegisteredNameInput', () => {
 
     searchOrgBookSpy.mockResolvedValue(mockResponse as AxiosResponse);
 
-    const modifiedSubmission = { ...testSubmission };
-    const wrapper = mount(ProjectForm, wrapperSettings(modifiedSubmission));
+    const wrapper = mount(ProjectForm, wrapperSettings(testSubmission));
     await nextTick();
     await nextTick();
 
@@ -407,8 +407,7 @@ describe('onRegisteredNameInput', () => {
 
     searchOrgBookSpy.mockResolvedValue(mockResponse as AxiosResponse);
 
-    const modifiedSubmission = { ...testSubmission };
-    const wrapper = mount(ProjectForm, wrapperSettings(modifiedSubmission));
+    const wrapper = mount(ProjectForm, wrapperSettings(testSubmission));
     await nextTick();
     await nextTick();
 
@@ -432,8 +431,7 @@ describe('onRegisteredNameInput', () => {
 
     searchOrgBookSpy.mockResolvedValue(mockResponse as AxiosResponse);
 
-    const modifiedSubmission = { ...testSubmission };
-    const wrapper = mount(ProjectForm, wrapperSettings(modifiedSubmission));
+    const wrapper = mount(ProjectForm, wrapperSettings(testSubmission));
     await nextTick();
     await nextTick();
 
@@ -462,8 +460,7 @@ describe('onRegisteredNameInput', () => {
 
     searchOrgBookSpy.mockResolvedValue(mockResponse as AxiosResponse);
 
-    const modifiedSubmission = { ...testSubmission };
-    const wrapper = mount(ProjectForm, wrapperSettings(modifiedSubmission));
+    const wrapper = mount(ProjectForm, wrapperSettings(testSubmission));
     await nextTick();
     await nextTick();
 
@@ -489,8 +486,7 @@ describe('onRegisteredNameInput', () => {
 
     searchOrgBookSpy.mockResolvedValue(mockResponse as AxiosResponse);
 
-    const modifiedSubmission = { ...testSubmission };
-    const wrapper = mount(ProjectForm, wrapperSettings(modifiedSubmission));
+    const wrapper = mount(ProjectForm, wrapperSettings(testSubmission));
     await nextTick();
     await nextTick();