Add i18n and update logic to EnquiryForm, update columns for submissi…

…on and enquiry tables for ats_client_number

app/src/db/migrations/20250203000000_022-enquiry-ats-integration.ts

@@ -2,19 +2,31 @@
 import type { Knex } from 'knex';
 
 export async function up(knex: Knex): Promise<void> {
-  return Promise.resolve().then(() =>
-    knex.schema.alterTable('enquiry', (table) => {
-      table.text('ats_client_number');
-      table.boolean('added_to_ats').notNullable().defaultTo(false);
-    })
-  );
+  return Promise.resolve()
+    .then(() =>
+      knex.schema.alterTable('enquiry', (table) => {
+        table.integer('ats_client_number');
+        table.boolean('added_to_ats').notNullable().defaultTo(false);
+      })
+    )
+    .then(() =>
+      knex.schema.alterTable('submission', (table) => {
+        table.integer('ats_client_number').alter();
+      })
+    );
 }
 
 export async function down(knex: Knex): Promise<void> {
-  return Promise.resolve().then(() =>
-    knex.schema.alterTable('enquiry', (table) => {
-      table.dropColumn('added_to_ats');
-      table.dropColumn('ats_client_number');
-    })
-  );
+  return Promise.resolve()
+    .then(() =>
+      knex.schema.alterTable('submission', (table) => {
+        table.text('ats_client_number').alter();
+      })
+    )
+    .then(() =>
+      knex.schema.alterTable('enquiry', (table) => {
+        table.dropColumn('added_to_ats');
+        table.dropColumn('ats_client_number');
+      })
+    );
 }

app/src/db/prisma/schema.prisma

@@ -109,7 +109,7 @@ model enquiry {
   created_at          DateTime? @default(now()) @db.Timestamptz(6)
   updated_by          String?
   updated_at          DateTime? @db.Timestamptz(6)
-  ats_client_number   String?
+  ats_client_number   Int?
   added_to_ats        Boolean   @default(false)
   activity            activity  @relation(fields: [activity_id], references: [activity_id], onDelete: Cascade, map: "enquiry_activity_id_foreign")
   user                user?     @relation(fields: [assigned_user_id], references: [user_id], onDelete: Cascade, map: "enquiry_assigned_user_id_foreign")
@@ -257,7 +257,7 @@ model submission {
   ast_notes                          String?
   ast_updated                        Boolean   @default(false)
   added_to_ats                       Boolean   @default(false)
-  ats_client_number                  String?
+  ats_client_number                  Int?
   ltsa_completed                     Boolean   @default(false)
   bc_online_completed                Boolean   @default(false)
   natural_disaster                   Boolean   @default(false)

app/src/types/Enquiry.ts

@@ -7,7 +7,7 @@ export type Enquiry = {
   activityId: string;
   addedToATS: boolean;
   assignedUserId: string | null;
-  atsClientNumber: string | null;
+  atsClientNumber: number | null;
   enquiryType: string | null;
   submittedAt: string;
   submittedBy: string;

app/src/types/Submission.ts

@@ -24,7 +24,7 @@ export type Submission = {
   astNotes: string | null;
   astUpdated: boolean;
   addedToATS: boolean;
-  atsClientNumber: string | null;
+  atsClientNumber: number | null;
   ltsaCompleted: boolean;
   bcOnlineCompleted: boolean;
   naturalDisaster: string;

app/src/validators/ats.ts

@@ -24,7 +24,7 @@ const clientBody = {
 
 const atsEnquirySubmissionFields = {
   addedToATS: Joi.boolean().required(),
-  atsClientNumber: Joi.string().allow(null).max(255)
+  atsClientNumber: Joi.number().allow(null).max(999999)
 };
 
 const schema = {

frontend/src/components/form/CancelButton.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { useIsFormDirty } from 'vee-validate';
+import { useI18n } from 'vue-i18n';
 
 import { Button } from '@/lib/primevue';
 
@@ -13,15 +14,18 @@ const emit = defineEmits(['clicked']);
 
 // State
 const isDirty = useIsFormDirty();
+
+// Actions
+const { t } = useI18n();
 </script>
 
 <template>
   <Button
-    label="Cancel"
     outlined
     class="ml-2 p-button-danger"
     icon="pi pi-times"
     :disabled="!editable || !isDirty"
+    :label="t('cancelButton.btnText')"
     @click="emit('clicked')"
   />
 </template>

frontend/src/components/housing/enquiry/EnquiryForm.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { Form } from 'vee-validate';
 import { computed, onMounted, ref } from 'vue';
+import { useI18n } from 'vue-i18n';
 import { date, mixed, object, string } from 'yup';
 
 import {
@@ -96,6 +97,7 @@ const intakeSchema = object({
 });
 
 // Actions
+const { t } = useI18n();
 const confirm = useConfirm();
 const enquiryStore = useEnquiryStore();
 const toast = useToast();
@@ -126,13 +128,12 @@ const onAssigneeInput = async (e: IInputEvent) => {
 };
 
 const showUserLinkModelCheck = (values: Enquiry) => {
-  if (relatedAtsNumber || values.atsClientNumber) return true;
-  else false;
+  return relatedAtsNumber || values.atsClientNumber;
 };
 
-const handleDetailsModalClick = computed(() => (values: Enquiry) => {
+const handleDetailsModalClick = (values: Enquiry) => {
   if (showUserLinkModelCheck(values)) atsUserDetailsModalVisible.value = true;
-});
+};
 
 function onCancel() {
   formRef.value?.resetForm();
@@ -315,7 +316,7 @@ onMounted(async () => {
       />
       <div class="col-span-3" />
 
-      <SectionHeader title="Basic information" />
+      <SectionHeader :title="t('enquiryForm.basicInfoHeader')" />
 
       <InputText
         class="col-span-3"
@@ -357,7 +358,7 @@ onMounted(async () => {
         :disabled="!editable"
       />
 
-      <SectionHeader title="Enquiry detail" />
+      <SectionHeader :title="t('enquiryForm.enquiryDetailHeader')" />
 
       <TextArea
         class="col-span-12"
@@ -366,7 +367,8 @@ onMounted(async () => {
         :disabled="!editable"
       />
 
-      <SectionHeader title="ATS" />
+      <SectionHeader :title="t('enquiryForm.atsHeader')" />
+
       <div class="grid grid-cols-subgrid gap-4 col-span-12">
         <div class="col-start-1 col-span-12">
           <div class="flex items-center">
@@ -393,7 +395,7 @@ onMounted(async () => {
           :disabled="!editable"
           @click="atsUserLinkModalVisible = true"
         >
-          Search ATS
+          {{ t('enquiryForm.atsSearchBtn') }}
         </Button>
         <Button
           v-if="!values.atsClientNumber && !values.relatedActivityId"
@@ -402,7 +404,7 @@ onMounted(async () => {
           :disabled="!editable"
           @click="atsUserCreateModalVisible = true"
         >
-          New ATS Client
+          {{ t('enquiryForm.atsNewClientBtn') }}
         </Button>
       </div>
       <Checkbox
@@ -447,10 +449,10 @@ onMounted(async () => {
       <div class="field col-span-12 mt-8">
         <Button
           v-if="!isCompleted"
-          label="Save"
           type="submit"
           icon="pi pi-check"
           :disabled="!editable"
+          :label="t('enquiryForm.formSaveBtn')"
         />
         <CancelButton
           v-if="!isCompleted"
@@ -459,8 +461,8 @@ onMounted(async () => {
         />
         <Button
           v-if="isCompleted"
-          label="Re-open enquiry"
           icon="pi pi-check"
+          :label="t('enquiryForm.formReopenBtn')"
           @click="onReOpen()"
         />
       </div>

frontend/src/locales/en-CA.json

@@ -1,4 +1,7 @@
 {
+  "cancelButton": {
+    "btnText": "Cancel"
+  },
   "collectionDisclaimer": {
     "disclaimer": "This information is being collected under the legal authority of section 26 (c)(e) and 27 (1)(a)(i) of the Freedom of Information and Protection of Privacy Act (the Act) and is being used for the purpose of creating a client relationship between you or your organization and Government of British Columbia. It may also be shared when strictly necessary with partner agencies that are also subject to the provisions of the Act. Personal information may be used by the Permitting Solutions Branch for survey purposes. If you have any questions regarding the use of this personal information, please contact the Navigator Service at"
   },
@@ -21,6 +24,15 @@
   "deleteDocument": {
     "deleteTooltip": "Delete document"
   },
+  "enquiryForm": {
+    "basicInfoHeader": "Basic information",
+    "enquiryDetailHeader": "Enquiry detail",
+    "atsHeader": "ATS",
+    "atsSearchBtn": "Search ATS",
+    "atsNewClientBtn": "New ATS Client",
+    "formSaveBtn": "Save",
+    "formReopenBtn": "Re-open enquiry"
+  },
   "enquiryIntakeForm": {
     "contactTooltip": "To update your contact details, click on your username in the top right corner of the page and select “contact profile.”",
     "about": "This enquiry is about",

frontend/tests/unit/components/form/CancelButton.spec.ts

@@ -3,6 +3,12 @@ import { shallowMount } from '@vue/test-utils';
 import CancelButton from '@/components/form/CancelButton.vue';
 import PrimeVue from 'primevue/config';
 
+vi.mock('vue-i18n', () => ({
+  useI18n: () => ({
+    t: vi.fn()
+  })
+}));
+
 beforeEach(() => {
   vi.clearAllMocks();
 });

frontend/tests/unit/components/housing/enquiry/EnquiryForm.spec.ts

@@ -8,6 +8,12 @@ import ToastService from 'primevue/toastservice';
 import { shallowMount } from '@vue/test-utils';
 import type { AxiosResponse } from 'axios';
 
+vi.mock('vue-i18n', () => ({
+  useI18n: () => ({
+    t: vi.fn()
+  })
+}));
+
 const useUserService = vi.spyOn(userService, 'searchUsers');
 const useEnquiryService = vi.spyOn(enquiryService, 'updateEnquiry');
 const useSubmissionService = vi.spyOn(submissionService, 'getActivityIds');