content(Complete User Profile): Updated the language, commented out button

src/components/FormErrorHeader.tsx

@@ -2,6 +2,7 @@ import { Alert, List, ListItem } from 'design-system-react';
 import type { PropsWithChildren } from 'react';
 import type { FieldErrors, FieldValues } from 'react-hook-form';
 import { Element, Link } from 'react-scroll';
+import { One } from 'utils/constants';
 
 import getAllProperties from 'utils/getAllProperties';
 import type { FormErrorKeyType } from 'utils/getFormErrorKeyLogic';
@@ -15,6 +16,7 @@ interface FormErrorHeaderProperties<
   errors?: FieldErrors<M>;
   alertHeading?: string;
   formErrorHeaderObject: T;
+  showKeyIndexNumber?: boolean;
 }
 
 /**
@@ -30,6 +32,7 @@ function FormErrorHeader<
   id,
   keyLogicFunc,
   formErrorHeaderObject,
+  showKeyIndexNumber,
 }: PropsWithChildren<FormErrorHeaderProperties<M, T>>): JSX.Element | null {
   if (!errors || Object.keys(errors).length === 0) return null;
 
@@ -100,7 +103,9 @@ function FormErrorHeader<
                         : 'Missing entry'
                     }${
                       // eslint-disable-next-line @typescript-eslint/no-magic-numbers
-                      typeof keyIndex === 'number' ? ` (${keyIndex + 1})` : ''
+                      showKeyIndexNumber && typeof keyIndex === 'number'
+                        ? ` (${keyIndex + One})`
+                        : ''
                     }`}
                   </Link>
                 </ListItem>
@@ -116,6 +121,7 @@ function FormErrorHeader<
 FormErrorHeader.defaultProps = {
   alertHeading: 'There was a problem completing your user profile',
   errors: null,
+  showKeyIndexNumber: false,
 };
 
 export default FormErrorHeader;

src/pages/ProfileForm/CreateProfileForm/AddFinancialInstitution.tsx

@@ -9,15 +9,17 @@ interface AddFinancialInstitutionProperties {
   index: number;
   register: UseFormRegister<ValidationSchemaCPF>;
   formErrors: FieldErrors<ValidationSchemaCPF>;
+  isLast?: boolean;
 }
 
 function AddFinancialInstitution({
   index,
   register,
   formErrors,
+  isLast,
 }: AddFinancialInstitutionProperties): JSX.Element {
   return (
-    <div className='mb-[1.875rem]' key={index}>
+    <div className={isLast ? '' : 'mb-[1.875rem]'} key={index}>
       <FieldGroup>
         <InputEntry
           label='Financial institution name'
@@ -46,4 +48,8 @@ function AddFinancialInstitution({
   );
 }
 
+AddFinancialInstitution.defaultProps = {
+  isLast: false,
+};
+
 export default AddFinancialInstitution;

src/pages/ProfileForm/CreateProfileForm/index.tsx

@@ -10,9 +10,10 @@ import FormWrapper from 'components/FormWrapper';
 
 import FormButtonGroup from 'components/FormButtonGroup';
 import FormMain from 'components/FormMain';
+import { Link } from 'components/Link';
 import LinkButton from 'components/LinkButton';
 import SectionIntro from 'components/SectionIntro';
-import { Button, Link } from 'design-system-react';
+import { Button } from 'design-system-react';
 import {
   emptyAddFinancialInstitution,
   formatUserProfileObject,
@@ -34,6 +35,8 @@ import { scenarios } from 'pages/Summary/Summary.data';
 
 import { useNavigate } from 'react-router-dom';
 
+import { sblHelpMail } from 'utils/common';
+import { One } from 'utils/constants';
 import { normalKeyLogic } from 'utils/getFormErrorKeyLogic';
 
 function CreateProfileForm(): JSX.Element {
@@ -113,6 +116,7 @@ function CreateProfileForm(): JSX.Element {
           id={formErrorHeaderId}
           formErrorHeaderObject={CupNFFormHeaderErrors}
           keyLogicFunc={normalKeyLogic}
+          // showKeyIndexNumber -- re-enable post-mvp
         />
         <Step1FormInfoHeader />
         <FormMain>
@@ -123,11 +127,12 @@ function CreateProfileForm(): JSX.Element {
           <SectionIntro heading='Provide your financial institution details'>
             Provide the name and LEI of the financial institution for which you
             are authorized to file. If you are authorized to file for an
-            additional financial institution, click &ldquo;Add a financial
-            institution.&rdquo;
+            additional financial institution,{' '}
+            <Link href={sblHelpMail}>email our support staff</Link>.
           </SectionIntro>
           {fields.map((field, index) => {
             const onRemoveThisInstitution = (): void => remove(index);
+            const isLast = fields.length - One === index;
             return (
               <div className='flex flex-col' key={`${field.id}`}>
                 {index !== 0 && (
@@ -141,15 +146,18 @@ function CreateProfileForm(): JSX.Element {
                   index={index}
                   register={register}
                   formErrors={formErrors}
+                  isLast={isLast}
                 />
               </div>
             );
           })}
-          <div className='mb-[3.75rem]'>
+          {/* TODO: Re-enable button post-mvp */}
+          {/* https://github.com/cfpb/sbl-frontend/issues/596 */}
+          {/* <div className='mb-[3.75rem]'>
             <LinkButton onClick={onAppendFinancialInstitutions} icon='plus'>
-              Add a financial institution
+              Add an additional financial institution
             </LinkButton>
-          </div>
+          </div> */}
           <FormButtonGroup>
             <Button
               appearance='primary'

src/pages/ProfileForm/Step1Form/Step1FormHeader.tsx

@@ -22,11 +22,22 @@ function Step1FormHeader({ isStep1 }: Step1FormHeaderProperties): JSX.Element {
         }
         description={
           <Paragraph>
-            In order to begin using the platform you must have a Legal Entity
-            Identifier (LEI) for your financial institution. If your
-            organization does not have an LEI, visit the{' '}
-            <Link href={gleifGetAnLEI}>Global LEI Foundation (GLEIF)</Link>{' '}
-            website.
+            <>
+              In order to begin using the platform you must have a Legal Entity
+              Identifier (LEI) for your financial institution. If your
+              organization does not have an LEI, visit the{' '}
+              <Link href={gleifGetAnLEI} target='_blank'>
+                Global LEI Foundation (GLEIF)
+              </Link>{' '}
+              website. If you need assistance with this form,{' '}
+              <Link
+                href='mailto:[email protected]?subject=[BETA] Complete your user profile: Questions after submitting form'
+                target='_blank'
+              >
+                email our support staff
+              </Link>
+              .
+            </>
           </Paragraph>
         }
       />

src/pages/Summary/Summary.data.tsx

@@ -99,7 +99,15 @@ function ChildrenError1(): JSX.Element {
       <Link className={linkStyles} href='/'>
         return to the platform homepage
       </Link>
-      , and sign in with your financial institution email address.
+      , and sign in with your financial institution email address. If this issue
+      persists,{' '}
+      <Link
+        className={linkStyles}
+        href='mailto:[email protected]?subject=[BETA] Complete your user profile: Questions after submitting form'
+      >
+        email our support staff
+      </Link>
+      .
     </>
   );
 }
@@ -126,7 +134,7 @@ function ChildrenSuccessInstitutionProfileUpdate(): JSX.Element {
   return (
     <>
       Please allow 24-48 hours for a response during normal business hours. If
-      you need further assistance please{' '}
+      you need further assistance{' '}
       <Link
         className={linkStyles}
         href='mailto:[email protected]?subject=[BETA] Update your financial institution profile: Questions after submitting form'

src/pages/Summary/Summary.tsx

@@ -1,11 +1,11 @@
 import { useEffect } from 'react';
 
+import useSblAuth from 'api/useSblAuth';
 import CrumbTrail from 'components/CrumbTrail';
 import FormWrapper from 'components/FormWrapper';
 import { LoadingContent } from 'components/Loading';
 import { Link } from 'design-system-react';
 import type { Scenario } from 'pages/Summary/Summary.data';
-import { scenarios } from 'pages/Summary/Summary.data';
 import { useLocation, useNavigate } from 'react-router-dom';
 import SummaryContent from './SummaryContent';
 
@@ -18,6 +18,10 @@ function Summary(): JSX.Element | null {
     window.scrollTo({ top: 0 });
   }, []);
 
+  const auth = useSblAuth();
+  const { isAuthenticated: userIsAuthenticated, isLoading: isAuthLoading } =
+    auth;
+
   const { state } = useLocation() as { state: ScenarioStateType };
   const navigate = useNavigate();
 
@@ -29,23 +33,20 @@ function Summary(): JSX.Element | null {
   }, [state, navigate]);
 
   // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-  if (!state?.scenario) {
+  if (!state?.scenario || isAuthLoading) {
     return <LoadingContent />;
   }
 
-  const isSuccessInstitutionProfileUpdate: boolean =
-    state.scenario === scenarios.SuccessInstitutionProfileUpdate;
+  const platformHomeLink = userIsAuthenticated ? '/landing' : '/';
 
   return (
     <main id='main'>
-      {isSuccessInstitutionProfileUpdate ? (
-        <CrumbTrail>
-          <Link isRouterLink href='/landing' key='home'>
-            Platform home
-          </Link>
-        </CrumbTrail>
-      ) : null}
-      <FormWrapper isMarginTop={!isSuccessInstitutionProfileUpdate}>
+      <CrumbTrail>
+        <Link isRouterLink href={platformHomeLink} key='home'>
+          Platform home
+        </Link>
+      </CrumbTrail>
+      <FormWrapper isMarginTop={false}>
         <SummaryContent scenario={state.scenario} />
       </FormWrapper>
     </main>