Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix/cache prod #60

Merged
merged 6 commits into from
Mar 6, 2024
Merged

Fix/cache prod #60

merged 6 commits into from
Mar 6, 2024

Conversation

technophile-04
Copy link
Member

Issue:

NOTE: This only occurs in prod, since there next does caching and build static stuff their.

Demo of admin page not refetching after mutation
Screen.Recording.2024-03-03.at.3.42.24.PM.mov

As we can once I make approve action, things are remaining as it is and not refetching the data.

Reason for above cause:

GET /api/grants/review route handler was static.

  • In NextJS app router, route handlers with GET are by default static.
  • Which means we only run await getAllGrantsForReview() in that api once in lifetime just during build time. After that /api/grants/review just returns the static data (All review grants present at build time).
NextJS marking api/grants/review as static during build time

Screenshot 2024-03-03 at 3 43 14 PM

Solution:

We need to opt out of caching for GET /api/grants/review route handler.Since we want admin to see updated data as soon as he does mutation.

The way we OPT out of caching for GET is checkout this in docs.

Hence in a4d0c40 we make use of request (which makes GET handler as dynamic) and it also reavalidatePath /admin(which was also static). The example was taken from here in docs

Copy link

vercel bot commented Mar 3, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
grants-bg ✅ Ready (Inspect) Visit Preview 💬 Add feedback Mar 6, 2024 9:41am

@carletex
Copy link
Contributor

carletex commented Mar 5, 2024

Thanks for this Shiv! This is forcing me to learn a bunch about NextJS caching, which is not simple :D

I left a couple of comments.


Sad that this only works for "fetch". With fetch, it shows HIT / MISS on the dev console so there is no need to build & start.

https://nextjs.org/docs/app/api-reference/next-config-js/logging

@technophile-04
Copy link
Member Author

Tysm, updated 🙌

This is forcing me to learn a bunch about NextJS caching, which is not simple :D

Yeah lol it's not all straightforward :( and docs seem to be kind of distributed too, also the thing it works differently in the dev environment as compared to prod is bad :(

Sad that this only works for "fetch". With fetch, it shows HIT / MISS on the dev console so there is no need to build & start.

Yeah :(

@carletex carletex merged commit dad3627 into main Mar 6, 2024
3 checks passed
@carletex carletex deleted the fix/cache-prod branch March 6, 2024 09:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants