From 0292cdb5b3e0745260b1153f26dc2f442eae1cdf Mon Sep 17 00:00:00 2001
From: giancarlo <giancarlopsk@gmail.com>
Date: Sun, 28 Apr 2024 21:39:17 +0700
Subject: [PATCH] Refactor join page layout and enhance redirection

Removed the standalone layout and loading files in the 'join' module, integrating the layout directly into the primary page file. Also substituted 'permanentRedirect' with the less rigid 'redirect' function in navigation to better handle user flow, especially when invites are not found or have expired. This change will make the code easier to manage and will improve user experience with page redirection.
---
 apps/web/app/join/layout.tsx  |  9 ---------
 apps/web/app/join/loading.tsx |  3 ---
 apps/web/app/join/page.tsx    | 34 +++++++++++++++++++++-------------
 3 files changed, 21 insertions(+), 25 deletions(-)
 delete mode 100644 apps/web/app/join/layout.tsx
 delete mode 100644 apps/web/app/join/loading.tsx

diff --git a/apps/web/app/join/layout.tsx b/apps/web/app/join/layout.tsx
deleted file mode 100644
index c82ab0cb8..000000000
--- a/apps/web/app/join/layout.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import { AuthLayoutShell } from '@kit/auth/shared';
-
-import { AppLogo } from '~/components/app-logo';
-
-function InvitePageLayout({ children }: React.PropsWithChildren) {
-  return <AuthLayoutShell Logo={AppLogo}>{children}</AuthLayoutShell>;
-}
-
-export default InvitePageLayout;
diff --git a/apps/web/app/join/loading.tsx b/apps/web/app/join/loading.tsx
deleted file mode 100644
index 4ea53181d..000000000
--- a/apps/web/app/join/loading.tsx
+++ /dev/null
@@ -1,3 +0,0 @@
-import { GlobalLoader } from '@kit/ui/global-loader';
-
-export default GlobalLoader;
diff --git a/apps/web/app/join/page.tsx b/apps/web/app/join/page.tsx
index 3b8212d71..96ebf62eb 100644
--- a/apps/web/app/join/page.tsx
+++ b/apps/web/app/join/page.tsx
@@ -1,8 +1,9 @@
 import Link from 'next/link';
-import { notFound, permanentRedirect } from 'next/navigation';
+import { notFound, redirect } from 'next/navigation';
 
 import { ArrowLeft } from 'lucide-react';
 
+import { AuthLayoutShell } from '@kit/auth/shared';
 import { requireUser } from '@kit/supabase/require-user';
 import { getSupabaseServerComponentClient } from '@kit/supabase/server-component-client';
 import { createTeamAccountsApi } from '@kit/team-accounts/api';
@@ -11,6 +12,7 @@ import { Button } from '@kit/ui/button';
 import { Heading } from '@kit/ui/heading';
 import { Trans } from '@kit/ui/trans';
 
+import { AppLogo } from '~/components/app-logo';
 import pathsConfig from '~/config/paths.config';
 import { createI18nServerInstance } from '~/lib/i18n/i18n.server';
 import { withI18n } from '~/lib/i18n/with-i18n';
@@ -46,7 +48,7 @@ async function JoinTeamAccountPage({ searchParams }: Context) {
   if (auth.error ?? !auth.data) {
     const path = `${pathsConfig.auth.signUp}?invite_token=${token}`;
 
-    permanentRedirect(path);
+    redirect(path);
   }
 
   // get api to interact with team accounts
@@ -58,7 +60,11 @@ async function JoinTeamAccountPage({ searchParams }: Context) {
 
   // the invitation is not found or expired
   if (!invitation) {
-    return <InviteNotFoundOrExpired />;
+    return (
+      <AuthLayoutShell Logo={AppLogo}>
+        <InviteNotFoundOrExpired />
+      </AuthLayoutShell>
+    );
   }
 
   // we need to verify the user isn't already in the account
@@ -81,7 +87,7 @@ async function JoinTeamAccountPage({ searchParams }: Context) {
     );
 
     // if the user is already in the account redirect to the home page
-    permanentRedirect(pathsConfig.app.home);
+    redirect(pathsConfig.app.home);
   }
 
   // if the user decides to sign in with a different account
@@ -97,15 +103,17 @@ async function JoinTeamAccountPage({ searchParams }: Context) {
   const email = auth.data.email ?? '';
 
   return (
-    <AcceptInvitationContainer
-      email={email}
-      inviteToken={token}
-      invitation={invitation}
-      paths={{
-        signOutNext,
-        accountHome,
-      }}
-    />
+    <AuthLayoutShell Logo={AppLogo}>
+      <AcceptInvitationContainer
+        email={email}
+        inviteToken={token}
+        invitation={invitation}
+        paths={{
+          signOutNext,
+          accountHome,
+        }}
+      />
+    </AuthLayoutShell>
   );
 }