[TOOL-3120] Redirect to last visited team page if authenticated (#6028)

Author: MananTank

apps/dashboard/src/app/team/[team_slug]/layout.tsx

@@ -2,6 +2,7 @@ import { getTeamBySlug } from "@/api/team";
 import { AppFooter } from "@/components/blocks/app-footer";
 import { redirect } from "next/navigation";
 import { TWAutoConnect } from "../../components/autoconnect";
+import { SaveLastVisitedTeamPage } from "../components/last-visited-page/SaveLastVisitedPage";
 
 export default async function RootTeamLayout(props: {
   children: React.ReactNode;
@@ -19,6 +20,7 @@ export default async function RootTeamLayout(props: {
       <div className="flex grow flex-col">{props.children}</div>
       <TWAutoConnect />
       <AppFooter />
+      <SaveLastVisitedTeamPage />
     </div>
   );
 }

apps/dashboard/src/app/team/components/last-visited-page/SaveLastVisitedPage.tsx

@@ -0,0 +1,17 @@
+"use client";
+
+import { usePathname } from "next/navigation";
+import { useEffect } from "react";
+import { setCookie } from "../../../../lib/cookie";
+import { LAST_VISITED_TEAM_PAGE_PATH } from "./consts";
+
+export function SaveLastVisitedTeamPage() {
+  const pathname = usePathname();
+
+  // eslint-disable-next-line no-restricted-syntax
+  useEffect(() => {
+    setCookie(LAST_VISITED_TEAM_PAGE_PATH, pathname);
+  }, [pathname]);
+
+  return null;
+}

apps/dashboard/src/app/team/components/last-visited-page/consts.ts

@@ -0,0 +1,3 @@
+// Only keep constants here - this file is imported in middleware too
+
+export const LAST_VISITED_TEAM_PAGE_PATH = "last-visited-team-page-path";

apps/dashboard/src/lib/cookie.ts

@@ -0,0 +1,25 @@
+"use client";
+
+export function getCookie(name: string) {
+  try {
+    const value = document.cookie;
+    const cookies = value.split(";");
+
+    for (const c of cookies) {
+      const [_name, _val] = c.trim().split("=");
+      if (_name === name && _val) {
+        return decodeURIComponent(_val);
+      }
+    }
+  } catch {
+    // ignore
+  }
+
+  return undefined;
+}
+
+export function setCookie(name: string, value: string, days = 365) {
+  const date = new Date();
+  date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
+  document.cookie = `${name}=${value};path=/;expires=${date.toUTCString()}`;
+}

apps/dashboard/src/middleware.ts

@@ -5,6 +5,7 @@ import { type NextRequest, NextResponse } from "next/server";
 import { getAddress } from "thirdweb";
 import { getChainMetadata } from "thirdweb/chains";
 import { isValidENSName } from "thirdweb/utils";
+import { LAST_VISITED_TEAM_PAGE_PATH } from "./app/team/components/last-visited-page/consts";
 import { defineDashboardChain } from "./lib/defineDashboardChain";
 
 // ignore assets, api - only intercept page routes
@@ -54,7 +55,6 @@ export async function middleware(request: NextRequest) {
     : null;
 
   // utm collection
-  // NOTE: this is not working for pages with rewrites in next.config.js - (framer pages)
   // if user is already signed in - don't bother capturing utm params
   if (!authCookie) {
     const searchParamsEntries = request.nextUrl.searchParams.entries();
@@ -96,13 +96,15 @@ export async function middleware(request: NextRequest) {
     }
   }
 
-  // remove '/' in front and then split by '/'
-
   // if it's the homepage and we have an auth cookie, redirect to the dashboard
   if (paths.length === 1 && paths[0] === "" && authCookie) {
+    const lastVisitedTeamPagePath = request.cookies.get(
+      LAST_VISITED_TEAM_PAGE_PATH,
+    )?.value;
+
     return redirect(
       request,
-      "/team",
+      lastVisitedTeamPagePath || "/team",
       cookiesToSet
         ? {
             cookiesToSet,

apps/dashboard/src/stores/SyncStoreToCookies.tsx

@@ -1,5 +1,6 @@
 import { type Store, useStore } from "@/lib/reactive";
 import { useEffect } from "react";
+import { getCookie, setCookie } from "../lib/cookie";
 
 const loadedStoreKeys = new Set<string>();
 
@@ -51,27 +52,3 @@ export function SyncStoreToCookies<T>(props: {
 
   return null;
 }
-
-function getCookie(name: string) {
-  try {
-    const value = document.cookie;
-    const cookies = value.split(";");
-
-    for (const c of cookies) {
-      const [_name, _val] = c.trim().split("=");
-      if (_name === name && _val) {
-        return decodeURIComponent(_val);
-      }
-    }
-  } catch {
-    // ignore
-  }
-
-  return undefined;
-}
-
-function setCookie(name: string, value: string, days = 365) {
-  const date = new Date();
-  date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
-  document.cookie = `${name}=${value};path=/;expires=${date.toUTCString()}`;
-}