Expired links (#94)

1. Handle expired links on signup
2.Reject invitations when user is already a member
3. Make sure not to display errors due to Next.js redirection during team creation
4. Fix documentation sidebar

apps/web/app/(marketing)/docs/_components/docs-navigation.tsx

@@ -92,6 +92,10 @@ function Tree({
     ));
   }
 
+  if (pages.length === 0) {
+    return null;
+  }
+
   return (
     <SidebarMenuSub>
       {pages.map((treeNode, index) => (

apps/web/app/auth/callback/error/page.tsx

@@ -1,6 +1,8 @@
 import Link from 'next/link';
-import { redirect } from 'next/navigation';
 
+import type { AuthError } from '@supabase/supabase-js';
+
+import { ResendAuthLinkForm } from '@kit/auth/resend-email-link';
 import { Alert, AlertDescription, AlertTitle } from '@kit/ui/alert';
 import { Button } from '@kit/ui/button';
 import { Trans } from '@kit/ui/trans';
@@ -11,41 +13,59 @@ import { withI18n } from '~/lib/i18n/with-i18n';
 interface AuthCallbackErrorPageProps {
   searchParams: Promise<{
     error: string;
-    invite_token: string;
+    callback?: string;
+    email?: string;
+    code?: AuthError['code'];
   }>;
 }
 
 async function AuthCallbackErrorPage(props: AuthCallbackErrorPageProps) {
-  const { error, invite_token } = await props.searchParams;
-  const queryParam = invite_token ? `?invite_token=${invite_token}` : '';
-  const signInPath = pathsConfig.auth.signIn + queryParam;
-
-  // if there is no error, redirect the user to the sign-in page
-  if (!error) {
-    redirect(signInPath);
-  }
+  const { error, callback, code } = await props.searchParams;
+  const signInPath = pathsConfig.auth.signIn;
+  const redirectPath = callback ?? pathsConfig.auth.callback;
 
   return (
     <div className={'flex flex-col space-y-4 py-4'}>
-      <div>
-        <Alert variant={'destructive'}>
-          <AlertTitle>
-            <Trans i18nKey={'auth:authenticationErrorAlertHeading'} />
-          </AlertTitle>
+      <Alert variant={'warning'}>
+        <AlertTitle>
+          <Trans i18nKey={'auth:authenticationErrorAlertHeading'} />
+        </AlertTitle>
 
-          <AlertDescription>
-            <Trans i18nKey={error} />
-          </AlertDescription>
-        </Alert>
-      </div>
+        <AlertDescription>
+          <Trans i18nKey={error ?? 'auth:authenticationErrorAlertBody'} />
+        </AlertDescription>
+      </Alert>
 
-      <Button asChild>
-        <Link href={signInPath}>
-          <Trans i18nKey={'auth:signIn'} />
-        </Link>
-      </Button>
+      <AuthCallbackForm
+        code={code}
+        signInPath={signInPath}
+        redirectPath={redirectPath}
+      />
     </div>
   );
 }
 
+function AuthCallbackForm(props: {
+  signInPath: string;
+  redirectPath?: string;
+  code?: AuthError['code'];
+}) {
+  switch (props.code) {
+    case 'otp_expired':
+      return <ResendAuthLinkForm redirectPath={props.redirectPath} />;
+    default:
+      return <SignInButton signInPath={props.signInPath} />;
+  }
+}
+
+function SignInButton(props: { signInPath: string }) {
+  return (
+    <Button className={'w-full'} asChild>
+      <Link href={props.signInPath}>
+        <Trans i18nKey={'auth:signIn'} />
+      </Link>
+    </Button>
+  );
+}
+
 export default withI18n(AuthCallbackErrorPage);

apps/web/public/locales/en/auth.json

@@ -52,7 +52,8 @@
   "emailConfirmationAlertHeading": "We sent you a confirmation email.",
   "emailConfirmationAlertBody": "Welcome! Please check your email and click the link to verify your account.",
   "resendLink": "Resend link",
-  "resendLinkSuccess": "We sent you a new link to your email! Follow the link to sign in.",
+  "resendLinkSuccessDescription": "We sent you a new link to your email! Follow the link to sign in.",
+  "resendLinkSuccess": "Check your email!",
   "authenticationErrorAlertHeading": "Authentication Error",
   "authenticationErrorAlertBody": "Sorry, we could not authenticate you. Please try again.",
   "sendEmailCode": "Get code to your Email",
@@ -77,6 +78,7 @@
     "minPasswordNumbers": "Password must contain at least one number",
     "minPasswordSpecialChars": "Password must contain at least one special character",
     "uppercasePassword": "Password must contain at least one uppercase letter",
-    "insufficient_aal": "Please sign-in with your current multi-factor authentication to perform this action"
+    "insufficient_aal": "Please sign-in with your current multi-factor authentication to perform this action",
+    "otp_expired": "The email link has expired. Please try again."
   }
 }