RegisterInvite: move to AuthLayout

app/soapbox/containers/soapbox.tsx

@@ -192,6 +192,7 @@ const SoapboxMount = () => {
                 <Route path='/verify' component={AuthLayout} />
                 <Route path='/reset-password' component={AuthLayout} />
                 <Route path='/edit-password' component={AuthLayout} />
+                <Route path='/invite/:token' component={AuthLayout} />
 
                 <Route path='/' component={UI} />
               </Switch>

app/soapbox/features/auth_layout/index.tsx

@@ -12,6 +12,7 @@ import PasswordReset from '../auth_login/components/password_reset';
 import PasswordResetConfirm from '../auth_login/components/password_reset_confirm';
 import RegistrationForm from '../auth_login/components/registration_form';
 import ExternalLoginForm from '../external_login/components/external-login-form';
+import RegisterInvite from '../register_invite';
 import Verification from '../verification';
 import EmailPassthru from '../verification/email_passthru';
 
@@ -50,6 +51,7 @@ const AuthLayout = () => {
                   <Route exact path='/signup' component={RegistrationForm} />
                   <Route exact path='/reset-password' component={PasswordReset} />
                   <Route exact path='/edit-password' component={PasswordResetConfirm} />
+                  <Route path='/invite/:token' component={RegisterInvite} />
 
                   <Redirect from='/auth/password/new' to='/reset-password' />
                   <Redirect from='/auth/password/edit' to='/edit-password' />

app/soapbox/features/register_invite/index.tsx

@@ -1,19 +1,17 @@
 import React from 'react';
 import { FormattedMessage } from 'react-intl';
+import { useParams } from 'react-router-dom';
 
 import RegistrationForm from 'soapbox/features/auth_login/components/registration_form';
 import { useAppSelector } from 'soapbox/hooks';
 
-interface IRegisterInvite {
-  /** URL params. */
-  params: {
-    /** Invite token from the URL. */
-    token: string,
-  },
+interface RegisterInviteParams {
+  token: string,
 }
 
 /** Page to register with an invitation. */
-const RegisterInvite: React.FC<IRegisterInvite> = ({ params }) => {
+const RegisterInvite: React.FC = () => {
+  const { token } = useParams<RegisterInviteParams>();
   const siteTitle = useAppSelector(state => state.instance.title);
 
   return (
@@ -34,7 +32,7 @@ const RegisterInvite: React.FC<IRegisterInvite> = ({ params }) => {
         </p>
       </div>
       <div className='register-invite__form'>
-        <RegistrationForm inviteToken={params.token} />
+        <RegistrationForm inviteToken={token} />
       </div>
     </div>
   );

app/soapbox/features/ui/index.tsx

@@ -107,7 +107,6 @@ import {
   NotificationsContainer,
   ModalContainer,
   ProfileHoverCard,
-  RegisterInvite,
   Share,
   NewStatus,
   IntentionalError,
@@ -288,8 +287,6 @@ const SwitchingColumnsArea: React.FC = ({ children }) => {
       <WrappedRoute path='/statuses/:statusId' exact component={Status} content={children} />
       {features.scheduledStatuses && <WrappedRoute path='/scheduled_statuses' page={DefaultPage} component={ScheduledStatuses} content={children} />}
 
-      <WrappedRoute path='/invite/:token' page={DefaultPage} component={RegisterInvite} content={children} publicRoute />
-
       <WrappedRoute path='/settings/profile' page={DefaultPage} component={EditProfile} content={children} />
       <WrappedRoute path='/settings/export' page={DefaultPage} component={ExportData} content={children} />
       <WrappedRoute path='/settings/import' page={DefaultPage} component={ImportData} content={children} />