✨ New inputs #2105 (#2238)

* ✨ New inputs #2105 * ✨ Add to params #2105 * 🎨 Fix camel case #2105 * 🐛 Fix url #2105 * 🐛 Route career contact form to different ci #2105 * 🚨 Fix lint issues #2105
equinor · Apr 29, 2024 · 7a4029e · 7a4029e
1 parent c958041
commit 7a4029e
Show file tree

Hide file tree

Showing 4 changed files with 161 additions and 4 deletions.
diff --git a/sanityv3/schemas/textSnippets.ts b/sanityv3/schemas/textSnippets.ts
@@ -525,6 +525,11 @@ const snippets: textSnippet = {
     defaultValue: 'Technical issue when applying for a specific position',
     group: groups.careerContactForm,
   },
+  careers_contact_form_suspected_recruitment_scam: {
+    title: 'Suspected recruitment scam',
+    defaultValue: 'Suspected recruitment scam',
+    group: groups.careerContactForm,
+  },
   careers_contact_form_phone: {
     title: 'Phone number',
     defaultValue: 'Phone number',
@@ -565,6 +570,43 @@ const snippets: textSnippet = {
     defaultValue: 'Please enter a question',
     group: groups.careerContactForm,
   },
+  careers_contact_form_candidate_type: {
+    title: 'Candidate type',
+    defaultValue: 'Candidate type',
+    group: groups.careerContactForm,
+  },
+
+  careers_contact_form_experienced_professionals: {
+    title: 'Experienced professionals',
+    defaultValue: 'Experienced professionals',
+    group: groups.careerContactForm,
+  },
+  careers_contact_form_graduates: {
+    title: 'Graduates',
+    defaultValue: 'Graduates',
+    group: groups.careerContactForm,
+  },
+  careers_contact_form_interns: {
+    title: 'Interns (e.g. summer, academic)',
+    defaultValue: 'Interns (e.g. summer, academic)',
+    group: groups.careerContactForm,
+  },
+  careers_contact_form_apprentices: {
+    title: 'Apprentices/lærlinger',
+    defaultValue: 'Apprentices/lærlinger',
+    group: groups.careerContactForm,
+  },
+  careers_contact_form_other: {
+    title: 'Other',
+    defaultValue: 'Other',
+    group: groups.careerContactForm,
+  },
+  careers_contact_form_supporting_documents: {
+    title: 'Supporting Documents checkbox',
+    defaultValue: 'Tick the box if you would like to send supporting documents, and we will get in touch with you',
+    group: groups.careerFairForm,
+  },
+
   form_sending: {
     title: 'Sending...',
     defaultValue: 'Sending...',

diff --git a/web/pageComponents/topicPages/Form/CareersContactForm.tsx b/web/pageComponents/topicPages/Form/CareersContactForm.tsx
@@ -3,9 +3,18 @@ import { Icon } from '@equinor/eds-core-react'
 import { useForm, Controller } from 'react-hook-form'
 import { error_filled } from '@equinor/eds-icons'
 import { FormattedMessage, useIntl } from 'react-intl'
-import { FormButton, FormTextField, FormSelect, FormSubmitSuccessBox, FormSubmitFailureBox } from '@components'
+import {
+  FormButton,
+  FormTextField,
+  Checkbox,
+  FormSelect,
+  FormSubmitSuccessBox,
+  FormSubmitFailureBox,
+} from '@components'
 import { BaseSyntheticEvent, useState } from 'react'
 import FriendlyCaptcha from './FriendlyCaptcha'
+import styled from 'styled-components'
+import { CareersContactFormCatalogType } from '../../../types'
 
 type FormValues = {
   name: string
@@ -15,8 +24,14 @@ type FormValues = {
   questions: string
   positionId: string
   preferredLang: string
+  candidateType: string
+  supportingDocuments: string
 }
 
+const StyledCheckBox = styled(Checkbox)`
+  padding-bottom: var(--space-medium);
+`
+
 const CareersContactForm = () => {
   const intl = useIntl()
   const [submitButtonEnabled, setSubmitButtonEnabled] = useState(false)
@@ -28,6 +43,7 @@ const CareersContactForm = () => {
       body: JSON.stringify({
         data,
         frcCaptchaSolution: (event?.target as any)['frc-captcha-solution'].value,
+        catalogType: getCatalog(data.category),
       }),
       headers: {
         'Content-Type': 'application/json',
@@ -37,11 +53,24 @@ const CareersContactForm = () => {
     setSuccessfullySubmitted(res.status == 200)
     setServerError(res.status != 200)
   }
+  const getCatalog = (category: string): CareersContactFormCatalogType | null => {
+    if (
+      category.includes(
+        intl.formatMessage({
+          id: 'careers_contact_form_suspected_recruitment_scam',
+          defaultMessage: 'Suspected recruitment scam',
+        }),
+      )
+    )
+      return 'suspectedRecruitmentScamRequest'
+    else return 'others'
+  }
 
   const {
     handleSubmit,
     control,
     reset,
+    register,
     formState: { isSubmitted, isSubmitting, isSubmitSuccessful },
   } = useForm({
     defaultValues: {
@@ -56,6 +85,11 @@ const CareersContactForm = () => {
         defaultMessage: 'Thesis writing',
       }),
       preferredLang: '',
+      candidateType: intl.formatMessage({
+        id: 'careers_contact_form_experienced_professionals',
+        defaultMessage: 'Experienced professionals',
+      }),
+      supportingDocuments: '',
     },
   })
   return (
@@ -195,6 +229,12 @@ const CareersContactForm = () => {
                       defaultMessage: 'Technical issue when applying for a specific position',
                     })}
                   </option>
+                  <option>
+                    {intl.formatMessage({
+                      id: 'careers_contact_form_suspected_recruitment_scam',
+                      defaultMessage: 'Suspected recruitment scam',
+                    })}
+                  </option>
                 </FormSelect>
               )}
             />
@@ -230,7 +270,7 @@ const CareersContactForm = () => {
                   id={props.name}
                   label={intl.formatMessage({
                     id: 'careers_contact_form_location',
-                    defaultMessage: 'Locaton',
+                    defaultMessage: 'Location',
                   })}
                   placeholder={intl.formatMessage({
                     id: 'careers_contact_form_location_placeholder',
@@ -244,6 +284,54 @@ const CareersContactForm = () => {
                 />
               )}
             />
+
+            <Controller
+              name="candidateType"
+              control={control}
+              render={({ field: { ref, ...props } }) => (
+                <FormSelect
+                  {...props}
+                  selectRef={ref}
+                  id={props.name}
+                  label={intl.formatMessage({
+                    id: 'careers_contact_form_candidate_type',
+                    defaultMessage: 'Candidate type',
+                  })}
+                >
+                  <option>
+                    {intl.formatMessage({
+                      id: 'careers_contact_form_experienced_professionals',
+                      defaultMessage: 'Experienced professionals',
+                    })}
+                  </option>
+                  <option>
+                    {intl.formatMessage({
+                      id: ' careers_contact_form_graduates',
+                      defaultMessage: 'Graduates',
+                    })}
+                  </option>
+                  <option>
+                    {intl.formatMessage({
+                      id: 'careers_contact_form_interns',
+                      defaultMessage: 'Interns (e.g. summer, academic)',
+                    })}
+                  </option>
+                  <option>
+                    {intl.formatMessage({
+                      id: 'careers_contact_form_apprentices',
+                      defaultMessage: 'Apprentices/lærlinger',
+                    })}
+                  </option>
+                  <option>
+                    {intl.formatMessage({
+                      id: 'careers_contact_form_other',
+                      defaultMessage: 'Other',
+                    })}
+                  </option>
+                </FormSelect>
+              )}
+            />
+
             <Controller
               name="questions"
               control={control}
@@ -271,6 +359,15 @@ const CareersContactForm = () => {
                 />
               )}
             />
+            <StyledCheckBox
+              label={intl.formatMessage({
+                id: 'career_fair_form_supporting_documents',
+                defaultMessage:
+                  'Tick the box if you would like to send supporting documents, and we will get in touch with you',
+              })}
+              value="Yes"
+              {...register('supportingDocuments')}
+            />
 
             <FriendlyCaptcha
               doneCallback={() => {

diff --git a/web/pages/api/forms/service-now-careers-contact.ts b/web/pages/api/forms/service-now-careers-contact.ts
@@ -1,23 +1,35 @@
 import { NextApiRequest, NextApiResponse } from 'next'
 import { sendRequestToServiceNow } from './service-now-base'
 import { validateFormRequest } from './validateFormRequest'
+import { CareersContactFormCatalogType } from '../../../types'
+
+const getCatalogIdentifier = (catalogType: CareersContactFormCatalogType | null) => {
+  switch (catalogType) {
+    case 'suspectedRecruitmentScamRequest':
+      return 'b04a9748832d8610347af830feaad382'
+    default:
+      return '59e02ac8375a3640615af01643990e7c'
+  }
+}
 
 export default async function handler(req: NextApiRequest, res: NextApiResponse) {
   const result = await validateFormRequest(req, 'careers contact form')
   if (result.status !== 200) {
     return res.status(result.status).json({ msg: result.message })
   }
 
-  const catalogIdentifier = '59e02ac8375a3640615af01643990e7c'
+  const catalogIdentifier = getCatalogIdentifier(req.body.catalogType)
   const data = req.body.data
   const phone = encodeURI(data.phone)
   const email = encodeURI(data.email)
   const category = encodeURI(data.category)
+  const candidateType = encodeURI(data.candidateType)
   const questions = encodeURI(data.questions)
   const location = encodeURI(data.location)
   const name = encodeURI(data.name)
   const positionDetails = encodeURI(data.positionId)
   const preferredLang = encodeURI(data.preferredLang)
+  const sendSupportingDocuments = data.supportingDocuments !== '' ? 'Yes' : 'No'
 
   const urlString =
     process.env.SERVICE_NOW_FORM_URL +
@@ -40,7 +52,11 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
     '&Questions=' +
     questions +
     '&PreferredLang=' +
-    preferredLang
+    preferredLang +
+    '&SupportingDocuments=' +
+    sendSupportingDocuments +
+    '&CandidateType=' +
+    candidateType
 
   await sendRequestToServiceNow(urlString)
     .then((response) => {

diff --git a/web/types/types.ts b/web/types/types.ts
@@ -794,6 +794,8 @@ export type IframeCarouselData = {
 
 export type ContactFormCatalogType = 'humanRightsInformationRequest' | 'loginIssues'
 
+export type CareersContactFormCatalogType = 'suspectedRecruitmentScamRequest' | 'others'
+
 export type KeyNumberItemData = {
   type: 'keyNumberItem'
   id: string