[Type of FI] Update page content

src/pages/Filing/UpdateFinancialProfile/TypesFinancialInstitutionSection.tsx

@@ -95,8 +95,7 @@ function TypesFinancialInstitutionSection({
         {...register('sbl_institution_types_other', {
           value: typeOtherData?.details,
         })}
-        helperText='You must enter a type of financial institution in the text field when
-        “Other” is selected. Separate multiple entries with a comma and a space.'
+        helperText='You must enter a type of financial institution in the text field when “Other” is selected. Separate multiple entries with a comma and a space.'
         errorMessage={formErrors.sbl_institution_types_other?.message}
         showError
         isLast

src/pages/TypesFinancialInstitutions/index.tsx

@@ -13,14 +13,14 @@ import FormHeaderWrapper from 'components/FormHeaderWrapper';
 import FormMain from 'components/FormMain';
 import FormWrapper from 'components/FormWrapper';
 import { LoadingContent } from 'components/Loading';
-import { Alert, Paragraph, TextIntroduction } from 'design-system-react';
+import { Alert, Link, Paragraph, TextIntroduction } from 'design-system-react';
 import FilingNavButtons from 'pages/Filing/FilingApp/FilingNavButtons';
 import TypesFinancialInstitutionSection from 'pages/Filing/UpdateFinancialProfile/TypesFinancialInstitutionSection';
 import type { UpdateTypeOfInstitutionType } from 'pages/Filing/UpdateFinancialProfile/types';
 import { UpdateTypeOfInstitutionSchema } from 'pages/Filing/UpdateFinancialProfile/types';
 import { scrollToElement } from 'pages/ProfileForm/ProfileFormUtils';
 import { useForm } from 'react-hook-form';
-import { Link, useNavigate, useParams } from 'react-router-dom';
+import { useNavigate, useParams } from 'react-router-dom';
 import { normalKeyLogic } from 'utils/getFormErrorKeyLogic';
 import useInstitutionDetails from 'utils/useInstitutionDetails';
 import { formatTypesForApi } from './TypesFinancialInstitutions.helpers';
@@ -111,8 +111,8 @@ function TypesFinancialInstitutions(): JSX.Element {
             </CrumbTrail>
           </div>
           <TextIntroduction
-            heading='Provide your type of financial institution'
-            subheading='Select all applicable types of financial institutions from the list below. If the enumerated types do not appropriately describe your institution, or if you wish to add additional types, select "Other" and add your financial institution type in the text field.'
+            heading='Provide type of financial institution'
+            subheading='Select all applicable types of financial institutions from the list below. If the enumerated types do not appropriately describe your financial institution, or if you wish to add additional types, select "Other" and add your financial institution type in the text field.'
             description={
               <Paragraph>
                 You must select at least one type of financial institution to

src/types/formTypes.ts

@@ -7,6 +7,18 @@ import {
 import { Five, One } from 'utils/constants';
 import { z } from 'zod';
 
+export enum FormFieldsHeaderError {
+  firstName = 'Enter your first name',
+  lastName = 'Enter your last name',
+  email = 'Invalid email address',
+  financialInstitutions = 'Select the institution for which you are authorized to file',
+  tin = 'Enter your Federal Taxpayer Identification Number (TIN)',
+  name = "Enter your financial institution's name",
+  lei = "Enter your financial institution's Legal Entity Identifier (LEI)",
+  sbl_institution_types = 'Select your type of financial institution',
+  sbl_institution_types_other = 'Enter a type of financial institution for "Other"',
+}
+
 // Used in react-select format (potentially can be removed)
 const financialInstitutionsSchema = z.object({
   label: z.string(),