"Revalidating" cached functions (not actions) in server pages

Question

Authentication in my app is set up so that logging in from another browser invalidates your current session. When your session is no longer valid, any server actions or requests to an API through React Query redirect you to /login. When it comes to hitting the API with React Query, I've got it figured out. I can force a refresh on the client side if the server responds with a redirect. The problem is that navigating using Link still shows the Login page wrapped in the AppShell component. So the user appears to be "half logged-in" even though navigation to other pages doesn't technically work.

The root layout looks like this:

export default async function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  const { session } = await getCurrentSession();

  return (
    <html lang="en" className={`${inter.variable} antialiased`}>
      <body className="bg-gray-50">
        <ToastProvider>
          {session ? <AppShell>{children}</AppShell> : children}
        </ToastProvider>
      </body>
    </html>
  );
}

I want to do something like "revalidate" this root layout. getCurrentSession is a cached function. What are my options?

"Revalidating" cached functions (not actions) in server pages

0 Replies