feat(core): redirect to account from auth pages if logged in (#1741)

.changeset/yellow-cougars-allow.md

@@ -0,0 +1,5 @@
+---
+"@bigcommerce/catalyst-core": minor
+---
+
+If a customer is already logged in, we want to redirect them back to their account pages if they are trying to hit one of the non-logged-in customer auth routes. The prevents any side effects that may occur trying to re-auth the client. This is done by providing a root layout.tsx page under the (auth) route group.

core/app/[locale]/(default)/(auth)/layout.tsx

@@ -0,0 +1,19 @@
+import { PropsWithChildren } from 'react';
+
+import { auth } from '~/auth';
+import { redirect } from '~/i18n/routing';
+
+interface Props extends PropsWithChildren {
+  params: Promise<{ locale: string }>;
+}
+
+export default async function Layout({ children, params }: Props) {
+  const session = await auth();
+  const { locale } = await params;
+
+  if (session) {
+    redirect({ href: '/account', locale });
+  }
+
+  return children;
+}

core/tests/ui/e2e/login.spec.ts

@@ -38,3 +38,14 @@ test('Login fails with invalid credentials', async ({ page }) => {
     ),
   ).toBeVisible();
 });
+
+test('If a customer is logged in, redirect to account pages', async ({ page, account }) => {
+  const customer = await account.create();
+
+  await customer.login();
+  await page.waitForURL('/account/');
+  await page.goto('/login');
+  await page.waitForURL('/account/');
+
+  await expect(page.getByRole('heading', { name: 'My Account' })).toBeVisible();
+});