feat: add continue button to company document list (#163)

Gusto · Feb 25, 2025 · b4ccaea · b4ccaea
1 parent 1e283b1
commit b4ccaea
Show file tree

Hide file tree

Showing 8 changed files with 36 additions and 8 deletions.
diff --git a/src/components/Company/DocumentSigner/DocumentList/Actions.tsx b/src/components/Company/DocumentSigner/DocumentList/Actions.tsx
@@ -0,0 +1,19 @@
+import { ActionsLayout, Button } from '@/components/Common'
+
+import { useTranslation } from 'react-i18next'
+import { useDocumentList } from './DocumentList'
+
+interface ActionsProps {
+  continueCtaLabel?: string
+}
+
+export function Actions({ continueCtaLabel }: ActionsProps) {
+  const { t } = useTranslation('Company.DocumentList')
+  const { handleContinue } = useDocumentList()
+
+  return (
+    <ActionsLayout>
+      <Button onPress={handleContinue}>{continueCtaLabel || t('continueCta')}</Button>
+    </ActionsLayout>
+  )
+}
diff --git a/src/components/Company/DocumentSigner/DocumentList/DocumentList.tsx b/src/components/Company/DocumentSigner/DocumentList/DocumentList.tsx
@@ -15,12 +15,13 @@ import { companyEvents } from '@/shared/constants'
 import { Head } from './Head'
 import { List } from './List'
 import { ManageSignatories } from './ManageSignatories'
-
+import { Actions } from './Actions'
 type DocumentListContextType = {
   companyForms: Schemas['Form'][]
   documentListError: Error | null
   handleRequestFormToSign: (form: Schemas['Form']) => void
   handleChangeSignatory: () => void
+  handleContinue: () => void
   isSelfSignatory: boolean
   signatory?: Schemas['Signatory']
 }
@@ -74,6 +75,10 @@ function Root({ companyId, signatoryId, className, children }: DocumentListProps
     onEvent(companyEvents.COMPANY_FORM_EDIT_SIGNATORY, signatory)
   }
 
+  const handleContinue = () => {
+    onEvent(companyEvents.COMPANY_FORMS_DONE)
+  }
+
   return (
     <section className={className}>
       <DocumentListProvider
@@ -82,6 +87,7 @@ function Root({ companyId, signatoryId, className, children }: DocumentListProps
           documentListError,
           handleRequestFormToSign,
           handleChangeSignatory,
+          handleContinue,
           isSelfSignatory,
           signatory,
         }}
@@ -94,6 +100,7 @@ function Root({ companyId, signatoryId, className, children }: DocumentListProps
               <Head />
               <ManageSignatories />
               <List />
+              <Actions />
             </>
           )}
         </Flex>
@@ -105,3 +112,4 @@ function Root({ companyId, signatoryId, className, children }: DocumentListProps
 DocumentList.Head = Head
 DocumentList.ManageSignatories = ManageSignatories
 DocumentList.List = List
+DocumentList.Actions = Actions
diff --git a/src/components/Company/DocumentSigner/DocumentList/Head.tsx b/src/components/Company/DocumentSigner/DocumentList/Head.tsx
@@ -1,8 +1,7 @@
 import { useTranslation } from 'react-i18next'
 
 export function Head() {
-  // @ts-expect-error HACK missing translations
-  const { t } = useTranslation('Company.DocumentSigner')
+  const { t } = useTranslation('Company.DocumentList')
 
   return <h2>{t('documentListTitle')}</h2>
 }
diff --git a/src/components/Company/DocumentSigner/DocumentList/List.tsx b/src/components/Company/DocumentSigner/DocumentList/List.tsx
@@ -5,8 +5,8 @@ import { useDocumentList } from './DocumentList'
 function List() {
   const { companyForms, handleRequestFormToSign, documentListError, isSelfSignatory } =
     useDocumentList()
-  // @ts-expect-error HACK missing translations
-  const { t } = useTranslation('Company.DocumentSigner')
+
+  const { t } = useTranslation('Company.DocumentList')
 
   const onRequestSign = (requestedForm: FormData) => {
     const companyForm = companyForms.find(currentForm => currentForm.uuid === requestedForm.uuid)

diff --git a/src/components/Company/DocumentSigner/DocumentList/ManageSignatories.tsx b/src/components/Company/DocumentSigner/DocumentList/ManageSignatories.tsx
@@ -13,8 +13,7 @@ function isValidSignatoryTitle(
 }
 
 function ManageSignatories() {
-  // @ts-expect-error HACK missing translations
-  const { t } = useTranslation('Company.DocumentSigner')
+  const { t } = useTranslation('Company.DocumentList')
   const { isSelfSignatory, signatory, handleChangeSignatory } = useDocumentList()
 
   let signatorySubtext = t('noSignatorySubtext')

diff --git a/src/i18n/en/Company.DocumentList.json b/src/i18n/en/Company.DocumentList.json
@@ -14,5 +14,6 @@
   "signDocumentComplete": "Complete",
   "notSigned": "Not signed",
   "documentListError": "Could not load your documents, try again later.",
-  "emptyTableTitle": "No documents found"
+  "emptyTableTitle": "No documents found",
+  "continueCta": "Continue"
 }
diff --git a/src/shared/constants.ts b/src/shared/constants.ts
@@ -60,6 +60,7 @@ export const companyEvents = {
   COMPANY_ASSIGN_SIGNATORY_DONE: 'company/signatory/assignSignatory/done',
   COMPANY_VIEW_FORM_TO_SIGN: 'company/forms/view',
   COMPANY_FORM_EDIT_SIGNATORY: 'company/forms/editSignatory',
+  COMPANY_FORMS_DONE: 'company/forms/done',
 } as const
 
 export const componentEvents = {

diff --git a/src/types/i18next.d.ts b/src/types/i18next.d.ts
@@ -101,6 +101,7 @@ export interface CompanyDocumentList{
 "notSigned":string;
 "documentListError":string;
 "emptyTableTitle":string;
+"continueCta":string;
 };
 export interface CompanyFederalTaxes{
 "pageTitle":string;