✨ Create a new contact form for Equinor pension

FeatureFlags.js

@@ -44,6 +44,7 @@ const CAREERS_CONTACT_FORM = [...GLOBAL_PROD, ...GLOBAL_DEV]
 const CONTACT_EQUINOR_FORM = [...GLOBAL_PROD, ...GLOBAL_DEV]
 const ORDER_REPORT_FORM = [...GLOBAL_PROD, ...GLOBAL_DEV]
 const CAREER_FAIR_AND_VISITS_FORM = [...GLOBAL_PROD, ...GLOBAL_DEV, 'brazil']
+const PENSION_FORM = [...GLOBAL_PROD, ...GLOBAL_DEV]
 
 const FANCY_MENU = [...GLOBAL_PROD, ...GLOBAL_DEV]
 /* LANDING_PAGE requires FANCY_MENU to work */
@@ -73,13 +74,15 @@ export default (dataset) => ({
     CAREER_FAIR_AND_VISITS_FORM.includes(dataset) ||
     CONTACT_EQUINOR_FORM.includes(dataset) ||
     ORDER_REPORT_FORM.includes(dataset) ||
-    SUBSCRIBE_FORM.includes(dataset),
+    SUBSCRIBE_FORM.includes(dataset) ||
+    PENSION_FORM.includes(dataset),
 
   HAS_SUBSCRIBE_FORM: SUBSCRIBE_FORM.includes(dataset),
   HAS_CAREERS_CONTACT_FORM: CAREERS_CONTACT_FORM.includes(dataset),
   HAS_CAREER_FAIR_AND_VISITS_FORM: CAREER_FAIR_AND_VISITS_FORM.includes(dataset),
   HAS_ORDER_REPORT_FORM: ORDER_REPORT_FORM.includes(dataset),
   HAS_CONTACT_EQUINOR_FORM: CONTACT_EQUINOR_FORM.includes(dataset),
+  HAS_PENSION_FORM: PENSION_FORM.includes(dataset),
 
   HAS_FANCY_MENU: FANCY_MENU.includes(dataset),
   /* LANDING_PAGE requires FANCY_MENU to work */

sanityv3/schemas/objects/form.tsx

@@ -22,6 +22,7 @@ type FormType =
   | 'careersContactForm'
   | 'orderReportsForm'
   | 'careerFairAndVisitsForm'
+  | 'pensionForm'
 
 const ingressContentType = configureBlockContent({
   h2: false,
@@ -67,6 +68,7 @@ export default {
             title: 'Career fairs and visits',
             value: 'careerFairAndVisitsForm',
           },
+          Flags.HAS_PENSION_FORM && { title: 'Pension form', value: 'pensionForm' },
         ].filter((e) => e),
         layout: 'dropdown',
       },
@@ -110,6 +112,8 @@ export default {
           return 'Careers contact form'
         } else if (type == 'orderReportsForm') {
           return 'Order reports'
+        } else if(type == 'pensionForm') {
+          return 'Pension form'
         }
         return 'Career fairs and visits'
       }

sanityv3/schemas/textSnippets.ts

@@ -10,6 +10,7 @@ export const groups = {
   contactForm: { title: 'Contact form', hidden: !Flags.HAS_CONTACT_EQUINOR_FORM },
   careerContactForm: { title: 'Careers Contact Form', hidden: !Flags.HAS_CAREERS_CONTACT_FORM },
   orderAnnualReportsForm: { title: 'Order annual reports form', hidden: !Flags.HAS_ORDER_REPORT_FORM },
+  pensionForm: { title: 'Pension form', hidden: !Flags.HAS_PENSION_FORM },
   form: { title: 'Form', hidden: !Flags.HAS_FORMS },
   cookie: { title: 'Cookie' },
   others: { title: 'Others' },
@@ -304,6 +305,81 @@ const snippets: textSnippet = {
     defaultValue: 'Submit form',
     group: groups.contactForm,
   },
+  pension_form_name: {
+    title: 'Name',
+    defaultValue: 'Name *',
+    group: groups.pensionForm,
+  },
+  pension_form_name_placeholder: {
+    title: 'Name Placeholder',
+    defaultValue: 'Jane Doe',
+    group: groups.pensionForm,
+  },
+  pension_form_name_validation: {
+    title: 'Name validation',
+    defaultValue: 'Please fill out your name',
+    group: groups.pensionForm,
+  },
+
+  pension_form_email: {
+    title: 'Email',
+    defaultValue: 'Email *',
+    group: groups.pensionForm,
+  },
+  pension_form_email_validation: {
+    title: 'Email validation',
+    defaultValue: 'Please fill out a valid email address',
+    group: groups.pensionForm,
+  },  
+  pension_form_category: {
+    title: 'Category',
+    defaultValue: 'Category',
+    group: groups.pensionForm,
+  },
+  pension_form_category_pension: {
+    title: 'Pension Category',
+    defaultValue: 'Pension',
+    group: groups.pensionForm,
+  },
+  pension_form_category_travel_insurance: {
+    title: 'Travel Insurance Category',
+    defaultValue: 'Travel Insurance',
+    group: groups.pensionForm,
+  },
+  pension_form_category_other: {
+    title: 'Other Pension/Insurance Related Category',
+    defaultValue: 'Other Pension/Insurance Related',
+    group: groups.pensionForm,
+  },
+
+  pension_form_what_is_your_request: {
+    title: 'What is your request?',
+    defaultValue: 'What is your request?',
+    group: groups.pensionForm,
+  },
+  pension_form_what_is_your_request_placeholder: {
+    title: `Requests Placeholder`,
+    defaultValue: `Please don't enter any personal information`,
+    group: groups.pensionForm,
+  },
+  pension_form_what_is_your_request_validation: {
+    title: 'Requests Validation',
+    defaultValue: 'Please let us know how we may help you',
+    group: groups.pensionForm,
+  },
+
+  pension_form_submit: {
+    title: 'Submit Button Text',
+    defaultValue: 'Submit Form',
+    group: groups.pensionForm,
+  },
+
+  pension_form_all_fields_mandatory: {
+    title: 'All fields with * are mandatory',
+    defaultValue: 'All fields with * are mandatory',
+    group: groups.pensionForm,
+  },
+
   career_fair_form_organisation: {
     title: 'Organisation',
     defaultValue: 'School / Organisation',

web/pageComponents/topicPages/Form/Form.tsx

@@ -9,6 +9,8 @@ import CareersContactForm from './careersContactForm/CareersContactForm'
 import type { FormData } from '../../../types/types'
 import { twMerge } from 'tailwind-merge'
 import CallToActions from '@sections/CallToActions'
+import PensionForm from './PensionForm'
+import React from 'react'
 
 const StyledHeading = styled(TitleText)`
   padding: 0 0 var(--space-large) 0;
@@ -32,6 +34,8 @@ const Form = ({ data, anchor, className }: { data: FormData; anchor?: string; cl
         return <CareerFairForm />
       case 'careersContactForm':
         return <CareersContactForm />
+      case 'pensionForm':
+        return <PensionForm />
       case 'orderReportsForm':
         return (
           <>