chore suppport folders (#12)

* chore: Support folders in dev pages

* feat: Parse any path into Page component

* fix: Remove unnecessary comma in pattern

Author: FlorianDr

pages/app.tsx

@@ -0,0 +1,45 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import { HashRouter, Link, Route, Routes, useLocation } from "react-router-dom";
+import Page from "./page";
+import { pages } from "../pages";
+
+export default function App() {
+  return (
+    <HashRouter>
+      <Routes>
+        <Route path="/" element={<Start />} />
+        <Route path="/*" element={<PageWithFallback />} />
+      </Routes>
+    </HashRouter>
+  );
+}
+
+const Start = () => (
+  <>
+    <h1>Pages</h1>
+    <main>
+      <Index />
+    </main>
+  </>
+);
+
+const Index = () => (
+  <ul className="list">
+    {pages.map((page) => (
+      <li key={page}>
+        <Link to={`${page}`}>{page}</Link>
+      </li>
+    ))}
+  </ul>
+);
+
+const PageWithFallback = () => {
+  const { pathname: page } = useLocation();
+
+  if (!page || !page.includes(page)) {
+    return <span>Not Found</span>;
+  }
+
+  return <Page pageId={page} />;
+};

pages/app/index.tsx

@@ -1,8 +1,7 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-
 import { Suspense } from "react";
-import { pagesMap } from "./pages";
+import { pagesMap } from "../pages";
 
 export interface PageProps {
   pageId: string;

pages/page.tsx renamed to pages/app/page.tsx

@@ -2,8 +2,8 @@
 // SPDX-License-Identifier: Apache-2.0
 import React from "react";
 
-const pagesRaw = import.meta.glob("./*.pages.tsx");
-const pageIdRegex = /.*\/([\w,-]+)\.pages\.tsx/;
+const pagesRaw = import.meta.glob("./**/*.page.tsx");
+const pageIdRegex = /([\w-/]+)\.page\.tsx/;
 const getPage = (path: string) => path.match(pageIdRegex)?.[1];
 
 export const pages = Object.keys(pagesRaw).map(getPage);