Next.js Discord

Discord Forum

Combining 'error.js' convention and 'revalidatePath' in app directory

Answered
Birman posted this in #help-forum
Open in Discord
Avatar
BirmanOP
hello,
i have a project which uses data from an external database. i have put all the fetch requests in a file for easier readability and cache control. most data is revalidated after 5 minutes, other data after an hour. this works fine.

what i am trying to do now, which i am struggling with, is overriding the automatic revalidation incase of an error loading the page. i want to use the error.js convention, as i have successfully implemented it's loading.js counterpart.

what i thought would work is creating a server action with the revalidatePath function, and running the action when the reset button is pressed on the error page. this is the behaviour i am looking for. i suspect i am running into issues because error components are client components.

all code can be found here: https://github.com/sebygreen/funkysundays/tree/main. actions are in lib/.

i was wondering what i could do to achieve data revalidation when prompted by the user via the error component, and if this is at all possible.

thanks in advance.
Answered by Birman
i think i fixed it. i added await to the revalidatePath function and it now fetches the data again.
tl:dr;
went from
export default async function revalidate(path) {
    revalidatePath(path, "page");
}

to
export default async function revalidate(path) {
    await revalidatePath(path, "page");
}

in my server action
View full answer

1 Reply

Avatar
BirmanOP
i think i fixed it. i added await to the revalidatePath function and it now fetches the data again.
tl:dr;
went from
export default async function revalidate(path) {
    revalidatePath(path, "page");
}

to
export default async function revalidate(path) {
    await revalidatePath(path, "page");
}

in my server action
Answer