Add sub-pages support to docs

[kylegach]

[!WARNING] The approach in this PR will not work. Translating from a single file, e.g. parameters.api.md, to a sub-route, e.g. parameters/api has significant consequences on parts of the frontpage architecture. Notably, the relative-to-root-links functionality and the "Edit this page" GitHub link would both require major (if even possible) updates.

I'll return to this with a new approach. At the moment, I'm thinking a fully 1:1 relationship between filesystem and routes. 🤔

What I did

• Adding a sub-page requires two steps:
  1. Add to TOC as sibling of parent page, e.g.

     { pathSegment: 'parameters', title: 'Parameters', type: 'link', },
     // 👇 New sub-page
     { pathSegment: 'parameters/api', title: 'Parameters', type: 'sub-page', },

  2. Add a new file for the sub-page content, with a filename matching the sub-page id (the "api" part, above), e.g. docs/writing-stories/parameters.api.md
• Add SubPageTabs component
  • Add stories
  • Add to DocsScreen

How to test

Because this depends on content updates, it cannot be previewed in a typical deploy preview. Instead I've made a demo branch which includes normally-ignored content changes.

Demo preview

1. Confirm SubPageTabs component looks correct in Chromatic
2. Navigate to a page without sub-pages, e.g. /writing-stories/args
   1. Confirm no tabs display
3. Navigate to a page with sub-pages, e.g. /writing-stories/parameters (your only option for this demo)
   1. Confirm tabs display
   2. Confirm they are fully functional
4. Check the sitemaps
   1. Navigate to the limited sitemap (used by search engines)
      1. Confirm both /writing-stories/parameters and /writing-stories/parameters/api are listed
   2. Navigate to the full sitemap (used by Algolia for site search)
      1. Confirm both /writing-stories/parameters and /writing-stories/parameters/api are listed

[netlify[bot]]

✅ Deploy Preview for storybook-frontpage ready!

Name	Link
🔨 Latest commit	500eb935778ce3f69c411083876061ad8ae63675
🔍 Latest deploy log	https://app.netlify.com/sites/storybook-frontpage/deploys/654d0e4f5b793c0008863ea5
😎 Deploy Preview	https://deploy-preview-618--storybook-frontpage.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.