Hi. I'm new to App Directory Next.js and have a weird problem that I don't understand.

I have the following /app route structure:

/app
  /authenticated
    /filtered
      @filteredList
      /[videoId]
    /videos
      /[date]
        @list
        /[videoId]

The /filtered and /videos/[date] routes are very similar: when the user toggles between the two, it almost looks like they are not changing pages.

When I move between /videos/[date] and /filtered, everything works fine in the browser. The user would not see any problems

However, over on the Next.js server, whenever I navigate from /videos/[date] to /filtered (but not when in the other direction), in addition to the usual logs for compiling /filtered, I also see this:

 ○ Compiling /videos/[date]/[videoId] ...
 ✓ Compiled /_not-found in 2.2s (10161 modules)
 GET /N/A 404 in 1677ms
 GET /videos/N/A 200 in 3114ms

Which in turn results in a lot of errors on the server because it looks like it's trying to GET/compile /videos/[date] in the background, but without valid route params.

The problem began when I added an asynchronous data fetch to the /filtered/@filteredList page.tsx.

const VideosByFiltersListSlot: FC<Props> = async ({ searchParams }) => {
  // Remove this fetch request and problem goes away...
  const videoSlice = await RestApi.getVideosPage(searchParams);

  return (
    <InfiniteVideoListColumn
      videoSlice={videoSlice}
    />
  );
};

What am I not understanding here? Why is Next.js trying to compile that other route? Where do the N and A come from?

I can provide more code if necessary.