fix: invalid router configuration causing beforeLoad hook to not fire

Author: jog1t

apps/hub/src/app.tsx

@@ -37,8 +37,9 @@ export const router = createRouter({
   },
   // Since we're using React Query, we don't want loader calls to ever be stale
   // This will ensure that the loader is always called when the route is preloaded or visited
-  defaultPreload: "intent",
+  defaultStaleTime: Number.POSITIVE_INFINITY,
   defaultPendingComponent: PageLayout.Root.Skeleton,
+  defaultPreloadStaleTime: 0,
   defaultOnCatch: (error) => {
     Sentry.captureException(error);
   },

apps/hub/src/components/header/header.tsx

@@ -8,7 +8,7 @@ import {
   SheetTrigger,
 } from "@rivet-gg/components";
 import { Icon, faBars } from "@rivet-gg/icons";
-import { Link, useLocation } from "@tanstack/react-router";
+import { Link } from "@tanstack/react-router";
 import { Breadcrumbs } from "../breadcrumbs/breadcrumbs";
 import { MobileBreadcrumbs } from "../breadcrumbs/mobile-breadcrumbs";
 import { Changelog } from "./changelog";
@@ -36,7 +36,6 @@ const UserProfileButton = () => {
 };
 
 export function Header() {
-  const location = useLocation();
   return (
     <header className="bg-background/60 sticky top-0 z-10 flex items-center gap-4 border-b py-2 backdrop-blur">
       <HeaderRouteLoader />

apps/hub/src/lib/guards.ts

@@ -32,21 +32,24 @@ export async function guardEnterprise({
   }
 }
 
-export async function guardOssNewie({
+export async function guardOssNewbie({
   queryClient,
   auth,
 }: { queryClient: QueryClient; auth: AuthContext }) {
   const { cluster } = await queryClient.fetchQuery(bootstrapQueryOptions());
 
+  console.log("AAAA?");
   const { games: projects, groups } = await queryClient.fetchQuery(
     projectsQueryOptions(),
   );
+  console.log("CCC?");
 
   if (cluster === "oss" && projects.length === 1) {
     const {
       game: { namespaces },
     } = await queryClient.fetchQuery(projectQueryOptions(projects[0].gameId));
 
+    console.log("DDDD?");
     // In case the project has no namespaces, or we failed to fetch the project, redirect to the project page
     if (namespaces.length > 0) {
       throw redirect({
@@ -55,32 +58,40 @@ export async function guardOssNewie({
           projectId: projects[0].gameId,
           environmentId: namespaces[0].namespaceId,
         },
+        from: "/",
       });
     }
 
+    console.log("EEEE?");
     throw redirect({
       to: "/projects/$projectId",
       params: {
         projectId: projects[0].gameId,
       },
+      from: "/",
     });
   }
 
   const lastTeam = ls.get(
     `rivet-lastteam-${auth.profile?.identity.identityId}`,
   );
 
+  console.log("FFFF?");
   if (lastTeam) {
     throw redirect({
       to: "/teams/$groupId",
       params: { groupId: lastTeam },
+      from: "/",
     });
   }
 
+  console.log("GGGG?", groups[0].groupId);
+
   if (groups.length > 0) {
     throw redirect({
       to: "/teams/$groupId",
       params: { groupId: groups[0].groupId },
+      from: "/",
     });
   }
 }

apps/hub/src/routes/_authenticated/_layout/index.tsx

@@ -1,7 +1,7 @@
 import { Intro } from "@/components/intro";
 import { DeepDiveSection } from "@/components/sections/deep-dive-section";
 import { FaqSection } from "@/components/sections/faq-section";
-import { guardOssNewie } from "@/lib/guards";
+import { guardOssNewbie } from "@/lib/guards";
 import { H1, NarrowPage, Separator } from "@rivet-gg/components";
 import { createFileRoute } from "@tanstack/react-router";
 import { zodSearchValidator } from "@tanstack/router-zod-adapter";
@@ -35,10 +35,11 @@ const searchSchema = z.object({
 export const Route = createFileRoute("/_authenticated/_layout/")({
   validateSearch: zodSearchValidator(searchSchema),
   component: IndexRoute,
-  beforeLoad: async ({ search, context: { queryClient, auth } }) => {
+  beforeLoad: ({ search, context: { queryClient, auth } }) => {
     if (search.newbie === true) {
       return;
     }
-    await guardOssNewie({ queryClient, auth });
+    return guardOssNewbie({ queryClient, auth });
   },
+  shouldReload: true,
 });