prerender 404 pages with a table of contents of all examples

Author: RobinMalfait

packages/@headlessui-react/pages/_app.tsx

@@ -105,7 +105,7 @@ function KeyCaster() {
 
 function MyApp({ Component, pageProps }) {
   const router = useRouter()
-  const { allExamples = [] } = pageProps
+  const { examples = [] } = pageProps
 
   return (
     <>
@@ -138,7 +138,7 @@ function MyApp({ Component, pageProps }) {
               alt="Tailwind UI"
             />
           </NextLink>
-          {allExamples.length > 0 && (
+          {examples.length > 0 && (
             <div>
               <select
                 value={router.asPath}
@@ -147,7 +147,7 @@ function MyApp({ Component, pageProps }) {
                 }}
                 className="block w-full py-2 pl-3 pr-10 text-base leading-6 border-gray-300 form-select focus:outline-none focus:shadow-outline-blue focus:border-blue-300 sm:text-sm sm:leading-5"
               >
-                <RecursiveExamplesSelectOptions examples={allExamples} />
+                <RecursiveExamplesSelectOptions examples={examples} />
               </select>
             </div>
           )}

packages/@headlessui-react/pages/_error.tsx

@@ -1,5 +1,4 @@
 import * as React from 'react'
-import { NextApiRequest } from 'next'
 import Error from 'next/error'
 import Head from 'next/head'
 import Link from 'next/link'
@@ -16,11 +15,10 @@ function NextLink(props: PropsOf<'a'>) {
   )
 }
 
-export async function getServerSideProps({ req }: { req: NextApiRequest }) {
+export async function getStaticProps() {
   return {
     props: {
-      allExamples: await resolveAllExamples('pages'),
-      examples: await resolveAllExamples('pages', ...req.url.split('/').slice(1)),
+      examples: await resolveAllExamples('pages'),
     },
   }
 }