Example permalinks don't work

[shawnbot]

Our x0-driven docs site doesn't generate working component permalinks. When we publish to Pages, the index loads from /primer-react/, but the links all go to /{ComponentName} (without the right path prefix). The pages for individual components don't even really exist (there's only an index.html in the docs directory), so I'm not sure what the URLs really should be for a component example. Having working permalinks seems pretty crucial to me.

To reproduce, visit https://primer.github.io/primer-react/ and click on "Details". The URL changes to https://primer.github.io/Details, which doesn't exist. But neither do any of the following:

• https://primer.github.io/primer-react/Details
• https://primer.github.io/primer-react/?Details
• https://primer.github.io/primer-react/#Details

We've already set x0.basename in package.json as described in x0's docs, but the URLs that are getting passed to location.replace() or history.pushState() just aren't right.

Any ideas, @broccolini?

[shawnbot]

Some notes here after trying out Next.js in #64 and then switching back to using x0 in #65 with examples broken out into individual files:

1. Next was great up until I tried exporting the site and ran into a bunch of issues with component examples that use Kit's <Details> element. I ended up having to comment those out to get it exporting.
2. I much prefer the way that Next allows you to customize the HTML template to how x0 does it: Next does it in React, but x0 does it with a function that takes a bunch of props but returns a string (presumably so that you can change the doctype?).
3. Both x0 and Next.js support filesystem-based routing and exports, but I couldn't get either to work the way I expected/wanted them to. 🤔

[emplums]

Update: I got routing working as we'd like, but even when examples route to /primer-react/components/Box, the permalink still doesn't work ☹️ I suspect it's because x0 doesn't generate static html files for each of the examples, they're all being visually rendered with the js in the bundle, maybe?

[broccolini]

Did you try this? #84 (comment)

[shawnbot]

Hey hey, this works! E.g. https://primer.github.io/primer-react/components/Details 🎉