Correct way to refresh page data fetched with `getServerSideProps` after client-side mutation?

[stray sable]

Hi Everyone,

I'm working on an application where users can create "Projects" and those projects can have multiple "Children". Those Children have content/metadata that is editable by the user. Users must be authenticated in order to access and edit their data. To do this, I'm using NextAuth.js and Prisma.

On the page in the attached screenshot you can see a input field where a user can edit the title of a Project Child and a list containing the Children within a Project. When a user edits the title on the right the list on the left should update and reflect the change.

The two components--the input component and the list component--get their data back from the results of getServerSideProps at the page level. When a user edits the title, a request is made to an API route with the update. If this update is successful I run the following code to cause the page to refetch the updated data.

  const handleRefresh = () => {
    router.replace(router.asPath);
  };

I've looked at the Next.js docs and have scoured Stack Overflow but haven't found anything more "official" than the above snippet.

Is this the best way to fetch new page data after a client-side mutation happens?
Should I refactor my page to handle fetching the data in a way that doesn't require the page reload?

[wide peak]

Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

[stray sable]

Bump. Would love to see how others are handling this!

[humble totem]

I would use trpc or just react-query to handle that if I use page router