Hey there,

I have a directory of pages structured as follows:
- destinations
- [region]
- [slug]
* index.tsx
* index.tsx

So when I go to www.mysite.com/destinations/OH it goes to the static page defined at destinations/[region]/index.tsx , which we will call the RegionPage.

When I got to www.mysite.com/destinations/OH/cleveland it goes to the static page defined at destinations/[region]/[slug]/index.tsx. We call this second page DestinationPage.

Destination is configured as follows:

export async function getStaticProps(props: { params: { region: string; slug: string } }): Promise<any> {
  try {
    const { params } = props;
    const { region, slug } = params;
    const regionParam = region;

    const regionUid = regionParam.toLowerCase();
    console.log(`Lookup Destination Page ${regionUid}/${slug}`);
    const pageProps = await LandingPageService.getDestinationPageProps(regionUid, slug);

    return packageStaticProps(pageProps);
  } catch (e) {
    console.log(`Destination Page ${props?.params?.region}/${props?.params?.slug} error`);
    console.log(e);
    return {
      notFound: true,
    };
  }
}

export async function getStaticPaths() {
  return { paths: [], fallback: 'blocking' };
}

On RegionPage, we have a bunch of links to the Destination page. So when a user clicks on a link, we move from www.mysite.com/destinations/OH to www.mysite.com/destinations/OH/cleveland.

Seems simple enough, but a funny thing happens when we navigate. In the console, I can see that getStaticProps looks like it's getting called twice:

Lookup Destination Page oh/cleveland
Get destination page props for oh/cleveland
Lookup Destination Page oh/undefined

Is there some side effect I'm not considering with this page structure? Is it possible there is something odd going on with Next JS's preloading logic?