fix(404): update not found page to work on GitHub Pages

Author: kruton

package.json

@@ -7,7 +7,7 @@
     "start": "next start",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
-    "postbuild": "pagefind --site .next/server/app --output-path out/_pagefind"
+    "postbuild": "pagefind --site .next/server/app --output-path public/_pagefind && cp out/404/index.html out/404.html"
   },
   "dependencies": {
     "@commitlint/cli": "^20.3.0",

src/app/404/page.tsx

@@ -0,0 +1,13 @@
+import NotFoundCanvas from '@/components/NotFoundCanvas';
+
+export default function NotFound() {
+  return (
+    <div style={{ textAlign: 'center', padding: '2rem' }}>
+      <h1>Page not found</h1>
+      <p>Sorry, that page does not exist.</p>
+      <div style={{ maxWidth: '800px', margin: '0 auto' }}>
+        <NotFoundCanvas />
+      </div>
+    </div>
+  );
+}

src/app/not-found.tsx

@@ -1,13 +1,3 @@
-import NotFoundCanvas from '@/components/NotFoundCanvas';
+import NotFound from '@/app/404/page';
 
-export default function NotFound() {
-  return (
-    <div style={{ textAlign: 'center', padding: '2rem' }}>
-      <h1>Page not found</h1>
-      <p>Sorry, that page does not exist.</p>
-      <div style={{ maxWidth: '800px', margin: '0 auto' }}>
-        <NotFoundCanvas />
-      </div>
-    </div>
-  );
-}
+export default NotFound;