ADD: footer + minor page re-org

Author: fileformat

src/app/advanced/[engine]/page.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
+import { redirect } from 'next/navigation'
 
-export default function Page({ params }: { params: { engine: string } }) {
-    return <h1>Hello, : { params.engine }</h1>
+export default async function Page({ params }: { params: { engine: string } }) {
+    redirect(`/advanced/${params.engine}/index.html`);
 }

src/app/advanced/[engine]/status.html/page.tsx

@@ -4,6 +4,7 @@ import type { Viewport } from 'next'
 
 import 'bootstrap/dist/css/bootstrap.css'
 import './global.css'
+import { Footer } from "@/components/Footer";
 
 export const metadata: Metadata = {
   title: "RegexPlanet",
@@ -27,6 +28,7 @@ export default function RootLayout({
         <div className="container-lg mt-4">
         {children}
         </div>
+        <Footer />
       </body>
     </html>
   );

src/app/layout.tsx

@@ -0,0 +1,30 @@
+import Link from 'next/link';
+
+const links = [
+    { link: 'https://github.com/regexplanet/regexplanet-next', label: 'Source' },
+    { link: 'https://github.com/regexplanet/regexplanet-next?tab=readme-ov-file#credits', label: 'Credits' },
+    //LATER: privacy, terms, etc
+];
+
+export function Footer() {
+
+    const initial: JSX.Element[] = []
+    links.forEach((link, index) => {
+        initial.push(<Link className="text-body-tertiary text-decoration-none" href={link.link} key={link.label}>
+            {link.label}
+        </Link>);
+        if (index < links.length - 1) {
+            initial.push(<span className="mx-1" key="key{{index}}">|</span>);
+        }
+    }
+    );
+
+    return (
+        <div className="container-lg py-3">
+        <hr />
+        <footer className="d-flex justify-content-center text-body-tertiary"><small>
+            {initial}
+        </small></footer>
+        </div>
+    )
+}

src/app/advanced/status.html/page.tsx renamed to src/app/status.html/page.tsx

@@ -5,9 +5,9 @@ import { usePathname } from 'next/navigation'
 import Link from 'next/link';
 
 const links = [
-    { link: '/testing/index.html', label: 'Testing' },
-    { link: '/advanced/status.html', label: 'Status' },
-    { link: '/support/index.html', label: 'Support' },
+    { link: '/', label: 'Testing', startsWith: '/advanced/' },
+    { link: '/status.html', label: 'Status', startsWith: '/status.html'},
+    { link: '/support/index.html', label: 'Support', startsWith: '/support/' },
 ];
 
 export function Navbar() {
@@ -16,7 +16,7 @@ export function Navbar() {
     const items = links.map((link) => (
         <li className="nav-item" key={link.label} >
             <Link
-                className={pathname.startsWith(link.link) ? 'nav-link active fw-bold' : 'nav-link'}
+                className={pathname.startsWith(link.startsWith) ? 'nav-link active fw-bold' : 'nav-link'}
                 href={link.link}
             >
                 {link.label}