revaldate cache after fetch

Author: maslianok

app/api/revalidate/route.ts

@@ -0,0 +1,17 @@
+import { revalidatePath } from 'next/cache';
+import type { NextRequest } from 'next/server';
+
+export async function GET(request: NextRequest) {
+  const path = request.nextUrl.searchParams.get('path');
+
+  if (path) {
+    revalidatePath(path);
+    return Response.json({ revalidated: true, now: Date.now() });
+  }
+
+  return Response.json({
+    revalidated: false,
+    now: Date.now(),
+    message: 'Missing path to revalidate',
+  });
+}

app/profile/[login]/components/fetch-user-button.tsx

@@ -80,6 +80,7 @@ export const FetchUserButton: FC<FetchUserButtonProps> = ({
       fetchAttempt.current += 1;
       setLoadingLabel(FETCH_MESSAGES[fetchAttempt.current % FETCH_MESSAGES.length]);
     } else {
+      await fetch(`/api/revalidate?path=${encodeURIComponent(`/profile/${login}`)}`);
       window.location.reload();
     }
   }, [login]);

app/profile/[login]/layout.tsx

@@ -7,8 +7,8 @@ import { TopRanksDocument } from '@/types/generated/graphql';
 type ProfileLayoutProps = Readonly<{ children: React.ReactNode; params: Promise<{ login: string }> }>;
 
 // Next.js will invalidate the cache when a
-// request comes in, at most once every 10800 seconds.
-export const revalidate = 10800;
+// request comes in, at most once every 3 hours.
+export const revalidate = 10800; // 3 hours
 
 // We'll prerender only the params from `generateStaticParams` at build time.
 // If a request comes in for a path that hasn't been generated,