fix(compontent): fix links with undefined in docs-table-of-contents.js

[muescha]

Description

Missing header element

there are some mdx that have left off a header in the tree:

## 2. Header

#### 4. Header 

Examples:

• docs/how-code-splitting-works.md -> https://www.gatsbyjs.org/docs/how-code-splitting-works/
• docs/production-app.md -> https://www.gatsbyjs.org/docs/production-app/

Current Result

then an element is inserted to the header array with just items::

{ 
  url: '#2header', 
  title: '2. Header', 
  items:
    [
      { 
        items: 
	      [ 
		    { 
              url: '#4header', 
              title: '4. Header' 
            }
          ]
      }
    ]
}

it creates:

• then the TOC create empty Links with undefined in href:

<a class="css-1wk9u7" href="/docs/how-code-splitting-works/undefined"></a>

• it creates a:

<link rel="prefetch" href="/page-data/docs/how-code-splitting-works/undefined/page-data.json" crossorigin="anonymous" as="fetch">

Fixed Result

• removed Link element when item.url is undefined
• changed the key for the li item
• prefetch links for the undefined links are not created

Related Issues

#19267

[muescha]

Screenshot

[pieh]

It looks good to me.

Separate issue is the fact that we have content with headings that skip a level (ideally we fix this stuff in our docs, but we shouldn't display empty undefined links in case there is heading hierarchy gaps.

Thanks @muescha!