fix: React error on forgot password page (#10717)

packages/client/components/GenericAuthentication.tsx

@@ -78,6 +78,16 @@ const GenericAuthentication = (props: Props) => {
   const isMicrosoftAuthEnabled = window.__ACTION__.AUTH_MICROSOFT_ENABLED
   const isInternalAuthEnabled = window.__ACTION__.AUTH_INTERNAL_ENABLED
   const isSSOAuthEnabled = window.__ACTION__.AUTH_SSO_ENABLED
+
+  const isCreate = page === 'create-account'
+  const action = isCreate ? CREATE_ACCOUNT_LABEL : SIGNIN_LABEL
+  const pageTitle = `${action} | Parabol`
+  const metaCopy = isCreate
+    ? 'Give structure to your meetings to get your team talking and moving forward faster. Get started in 44 seconds or less.'
+    : 'Access Parabol to streamline your agile meetings. Collaborate, reflect, and grow with your team in real-time.'
+  useDocumentTitle(pageTitle, action)
+  useMetaTagContent(metaCopy)
+
   if (page === 'forgot-password') {
     return <ForgotPasswordPage goToPage={goToPage} />
   }
@@ -89,17 +99,9 @@ const GenericAuthentication = (props: Props) => {
     }
   }
 
-  const isCreate = page === 'create-account'
-  const action = isCreate ? CREATE_ACCOUNT_LABEL : SIGNIN_LABEL
   const counterAction = isCreate ? SIGNIN_LABEL : CREATE_ACCOUNT_LABEL
   const counterActionSlug = isCreate ? SIGNIN_SLUG : CREATE_ACCOUNT_SLUG
   const actionCopy = isCreate ? 'Already have an account? ' : 'New to Parabol? '
-  const pageTitle = `${action} | Parabol`
-  const metaCopy = isCreate
-    ? 'Give structure to your meetings to get your team talking and moving forward faster. Get started in 44 seconds or less.'
-    : 'Access Parabol to streamline your agile meetings. Collaborate, reflect, and grow with your team in real-time.'
-  useDocumentTitle(pageTitle, action)
-  useMetaTagContent(metaCopy)
   const title = teamName ? `${teamName} is waiting` : action
   const onForgot = () => {
     goToPage('forgot-password', `?email=${emailRef.current?.email()}`)

packages/client/components/InvitationLinkDialog.tsx

@@ -42,16 +42,20 @@ const InvitationLinkDialog = (props: Props) => {
     return <TeamInvitationErrorNotFound isMassInvite />
   }
   const {errorType, teamName} = massInvitation
+  const pageTitle = teamName ? `${teamName} | Parabol` : 'Join | Parabol'
+  const pageName = teamName ? `Join ${teamName}` : 'Join Parabol'
+  const metaCopy = teamName
+    ? `Join ${teamName} on Parabol, the essential tool for making meetings efficient or replacing them with structured, asynchronous collaboration.`
+    : `Join Parabol, the essential tool for making meetings efficient or replacing them with structured, asynchronous collaboration.`
+  useDocumentTitle(pageTitle, pageName)
+  useMetaTagContent(metaCopy)
+
   switch (errorType) {
     case 'notFound':
       return <TeamInvitationErrorNotFound isMassInvite />
     case 'expired':
       return <InvitationLinkErrorExpired massInvitation={massInvitation} />
   }
-  useDocumentTitle(`${teamName} | Parabol`, `Join ${teamName}`)
-  useMetaTagContent(
-    `Join ${teamName} on Parabol,the essential tool for making meetings efficient or replacing them with structured, asynchronous collaboration.`
-  )
   const {authToken} = atmosphere
   if (authToken) {
     return <TeamInvitationAccept invitationToken={token} />