Merge pull request #212 from DTS-STN/develop

Release 2022-03-07

__tests__/client-state/mst.test.ts

@@ -167,19 +167,19 @@ describe('test the mobx state tree nodes', () => {
     expect(form.progress.legal).toBe(true)
   })
 
-  it('can build a consistent querystring', async () => {
+  it('can build a consistent input object', async () => {
     const res = await instantiateFormFields()
     const form: Instance<typeof Form> = root.form
     form.setupForm(res.body.fieldData)
-    let qs = form.buildQueryStringWithFormData()
-    expect(qs).toBe('_language=EN&livingCountry=CAN') // Canada is selected by default, and locale is EN
+    let input = form.buildObjectWithFormData()
+    expect(input).toEqual({ _language: 'EN' })
     fillOutForm(form)
-    qs = form.buildQueryStringWithFormData()
-    expect(qs).toContain('income=20000')
-    expect(qs).toContain('age=65')
-    expect(qs).toContain('maritalStatus=single')
-    expect(qs).toContain('livingCountry=CAN')
-    expect(qs).toContain('legalStatus=canadianCitizen')
-    expect(qs).toContain('canadaWholeLife=true')
+    input = form.buildObjectWithFormData()
+    expect(input.income).toEqual('20000')
+    expect(input.age).toEqual('65')
+    expect(input.maritalStatus).toEqual('single')
+    expect(input.livingCountry).toEqual('CAN')
+    expect(input.legalStatus).toEqual('canadianCitizen')
+    expect(input.canadaWholeLife).toEqual('true')
   })
 })

client-state/models/Form.ts

@@ -2,10 +2,7 @@ import { flow, getParent, Instance, SnapshotIn, types } from 'mobx-state-tree'
 import { webDictionary } from '../../i18n/web'
 import { FieldCategory } from '../../utils/api/definitions/enums'
 import { FieldData, FieldKey } from '../../utils/api/definitions/fields'
-import {
-  ResponseError,
-  ResponseSuccess,
-} from '../../utils/api/definitions/types'
+import MainHandler from '../../utils/api/mainHandler'
 import { legalValues } from '../../utils/api/scrapers/output'
 import { fixedEncodeURIComponent } from '../../utils/web/helpers/utils'
 import { RootStore } from '../store'
@@ -160,31 +157,33 @@ export const Form = types
         self.fields.sort((a, b) => a.order - b.order)
       })
     },
+    // used for calling the main benefit processor
+    buildObjectWithFormData(): { [key: string]: string } {
+      const parent = getParent(self) as Instance<typeof RootStore>
+      let input = { _language: parent.lang }
+      if (!self.getFieldByKey(FieldKey.INCOME).filled) return input // guard against income being empty
+      for (const field of self.fields) {
+        if (!field.value) continue
+        input[field.key] = field.sanitizeInput()
+      }
+      return input
+    },
+    // used for API requests, which is currently for the CSV function
     buildQueryStringWithFormData(): string {
       const parent = getParent(self) as Instance<typeof RootStore>
-
       let qs = `_language=${parent.lang}`
-
+      if (!self.getFieldByKey(FieldKey.INCOME).filled) return qs // guard against income being empty
       for (const field of self.fields) {
         if (!field.value) continue
-
-        // remove masking from currency and use object keys for react-select
-        let val = field.sanitizeInput()
-
-        if (qs !== '') qs += '&'
-        //encodeURI and fix for encodeURIComponent and circle brackets
-        qs += `${field.key}=${fixedEncodeURIComponent(val)}`
+        qs += `&${field.key}=${fixedEncodeURIComponent(field.sanitizeInput())}`
       }
       return qs
     },
   }))
   .actions((self) => ({
     sendAPIRequest: flow(function* () {
-      // build query  string
-      const queryString = self.buildQueryStringWithFormData()
-
-      const apiData = yield fetch(`/${self.API_URL}?${queryString}`)
-      const data: ResponseSuccess | ResponseError = yield apiData.json()
+      const input = self.buildObjectWithFormData()
+      const data = new MainHandler(input).results
 
       if ('error' in data) {
         self.clearAllErrors()
@@ -194,7 +193,6 @@ export const Form = types
           field.setError(d.message)
         }
       } else {
-        console.log(data)
         self.clearAllErrors()
         const parent = getParent(self) as Instance<typeof RootStore>
         parent.setOAS(data.results.oas)

components/ContactCTA/index.tsx

@@ -26,17 +26,26 @@ export const ContactCTA: React.VFC = () => {
         className="!mt-6 !md:mt-8 summary-link"
         dangerouslySetInnerHTML={{ __html: tsln.contactCTA }}
       />
+
       {root.summary?.nextStepsLinks && (
-        <div className="flex flex-col gap-y-1">
+        <div className="flex flex-col">
           {root.summary.nextStepsLinks.map((link, index) => (
-            <Link key={index} href={link.url} passHref>
-              <a
-                className="btn btn-primary !mt-5 whitespace-normal md:whitespace-nowrap md:min-w-min md:px-8 md:max-w-[480px]"
-                target="_blank"
-              >
-                {link.text}
-              </a>
-            </Link>
+            <>
+              {index == 0 && (
+                <>
+                  <h2 className="h2">{tsln.applyHeader}</h2>
+                  <p>{tsln.applyText}</p>
+                </>
+              )}
+              <Link key={index} href={link.url} passHref>
+                <a
+                  className="btn btn-primary !mt-5 whitespace-normal md:whitespace-nowrap md:min-w-min md:px-8 md:max-w-[400px]"
+                  target="_blank"
+                >
+                  {link.text}
+                </a>
+              </Link>
+            </>
           ))}
         </div>
       )}

components/Document/index.tsx

@@ -10,12 +10,15 @@ export const HeadDoc = () => {
       <title>{tsln.title}</title>
       <meta name="viewport" content="initial-scale=1.0, width=device-width" />
       <link rel="preconnect" href="https://fonts.googleapis.com"></link>
-      <link rel="preconnect" href="https://fonts.gstatic.com"></link>
       <link
-        href="https://fonts.googleapis.com/css2?family=Lato:wght@700&family=Noto+Sans&family=Patua+One&display=swap"
-        rel="stylesheet"
+        rel="preconnect"
+        href="https://fonts.gstatic.com"
         crossOrigin="anonymous"
       ></link>
+      <link
+        href="https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Noto+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap"
+        rel="stylesheet"
+      ></link>
       <script src="//assets.adobedtm.com/be5dfd287373/0127575cd23a/launch-913b1beddf7a-staging.min.js"></script>
     </Head>
   )