Next.js Discord

Discord Forum

NextJS revalidate path with supabase

Unanswered
English Spot posted this in #help-forum
Open in Discord
English SpotOP
Am i missing something or i did something wrong? So in my explore page there's a profile card that use the user username. and the page only update the value when i refresh the page
export async function usernameChange({ username }: usernameChangeSchema) {
  // Username Update
  revalidatePath('/explore', 'page');
  return { data };
}

And this is my explore page
export default async function ExplorePage() {
  const users = await getCreators();
return(
//Explore Page
)

export async function getCreators() {
  const supabase = createServerClient();
  try {
    const { data, error } = await supabase
      .from('user_profiles')
      .select('*')

    if (!data) {
      throw error;
    }

    return data;
  } catch (error) {
    console.error('Error:', error);
    throw error;
  }
}

25 Replies

I think we have similar problems, no clue what the solution is tho

https://nextjs-forum.com/post/1252442613060210719
one thing i found is if we use
revalidatePath('/', 'layout')

it will work, but not any other else, but this will revalidate everything which i do not want
I thought that was in the example project?
Strange, still dosnt work for me.
English SpotOP
Which example project can you link it here?
npx create-next-app -e with-supabase
English SpotOP
Hmm idk if it is okay to tag some mod / helper
I actually cant find that they used revalidatePath in the example project
English SpotOP
@joulev
So I am calling the usernameChange function here
https://github.com/billgun/kreasea/blob/main/app/(dashboard)/settings/_components/actions.ts

And the fetch function here, but somehow it is not revalidated and the previous data still cached. When I manually refresh the page then the data got updated / changed.
https://github.com/billgun/kreasea/blob/main/app/(dashboard)/explore/page.tsx
@joulev the way i look at it, you are only revalidating `/explore` and not `/settings`? then after revalidation, the `/settings` page content should still be the same, no?
English SpotOP
Yes, what I want to revalidate is the /explore page
I want to revalidate the /settings page as well but not now.
@English Spot Yes, what I want to revalidate is the /explore page I want to revalidate the /settings page as well but not now.
* if you fetch the data in /settings and revalidate /settings as well, does it work (for /settings)?
* if you redirect to /explore, does it show the new data?
@joulev * if you fetch the data in /settings and revalidate /settings as well, does it work (for /settings)? * if you `redirect` to /explore, does it show the new data?
English SpotOP
Hey, it seems to be working now
Looks like I need to wrap my function into a try catch function
Both of the questions above is no, for the questions above before i added the try / catch
πŸ˜–
Looking into this, giving me a try to add try / catch block for my function
Redirecting
If you would like to redirect the user to a different route after the completion of a Server Action, you can use redirect API. redirect needs to be called outside of the try/catch block:

https://nextjs.org/docs/app/building-your-application/data-fetching/server-actions-and-mutations#redirecting
redirect needs to be called outside try/catch but revalidatePath needs not be called that way :thinkies:
English SpotOP
oh okay, that's weird πŸ€”
well, if it works it works
English SpotOP
So why does it only works when i put it inside try / catch πŸ˜‚
Yeah, thanks!
English SpotOP
Hey @Iischeese you might want to try wrapping your function inside of try/catch
like this? I got the sign in to work once, but after that it failed