Title and description fields within the post editor do not trigger the save function as expected, also infinite loop on editor page related to nav.tsx

[erreib]

Editing the title or description fields within the post editor do not seem to trigger the save function as expected. Maybe there is an issue with the debounce timer set in editor.tsx? Editing the NovelEditor triggers the save as expected.

[erreib]

I solved this in my local version by adding a debounce timer within editor.tsx and used it for updating the title and description fields:

Is this a valid approach to fixing this, or would it be better to somehow get the debounce timer included in the NovelEditor instead of creating another one?

EDIT: I see now this is definitely not a valid approach since it causes an infinite loop, I will continue trying to fix.

[erreib]

So actually, it looks like the infinite loop might be occurring on the main demo site as well

Is this happening for anyone else?

[erreib]

So after a little bit more investigation it looks like there's an issue with this useEffect in the nav.tsx. Commenting it out seemed to fix the infinite loop but I'm not really proficient enough to understand what the useEffect was doing.

[wallawe]

Thank you! I commented out the entire post/[id] page and it was still happening and I was thoroughly puzzled.

Edit: the quickest fix without changing any functionality is to change the dependency array:

  useEffect(() => {
    console.log("segments", segments);
    if (segments[0] === "post" && id) {
      getSiteFromPostId(id).then((id) => {
        setSiteId(id);
      });
    }
  }, [segments[0], id]);

Notice how I'm using segments[0] instead of segments because segments is an array (object) which gets returned from useSelectedLayoutSegments and thus the useEffect is running indefinitely because it's always a new object, even if the contents in it is the same.

[leerob]

👋 We've updated this repo to have a more simplified example + a new guide:

• Migrate to new, simplified reference template #451
• https://vercel.com/guides/nextjs-multi-tenant-application