all working now...

4 files changed, 141 insertions, 0 deletions

diff --git a/src/pages/_layout.tsx b/src/pages/_layout.tsx
new file mode 100644
index 0000000..6d227c9
--- /dev/null
+++ b/src/pages/_layout.tsx
@@ -0,0 +1,39 @@
+import '../styles.css';
+
+import type { ReactNode } from 'react';
+
+import { Header } from '../components/header';
+import { Footer } from '../components/footer';
+
+type RootLayoutProps = { children: ReactNode };
+
+export default async function RootLayout({ children }: RootLayoutProps) {
+  const data = await getData();
+
+  return (
+    <div className="font-['Nunito']">
+      <meta name="description" content={data.description} />
+      <link rel="icon" type="image/png" href={data.icon} />
+      <Header />
+      <main className="m-6 flex items-center *:min-h-64 *:min-w-64 lg:m-0 lg:min-h-svh lg:justify-center">
+        {children}
+      </main>
+      <Footer />
+    </div>
+  );
+}
+
+const getData = async () => {
+  const data = {
+    description: 'An internet website!',
+    icon: '/images/favicon.png',
+  };
+
+  return data;
+};
+
+export const getConfig = async () => {
+  return {
+    render: 'static',
+  } as const;
+};
diff --git a/src/pages/about.tsx b/src/pages/about.tsx
new file mode 100644
index 0000000..15d4c90
--- /dev/null
+++ b/src/pages/about.tsx
@@ -0,0 +1,32 @@
+import { Link } from 'waku';
+
+export default async function AboutPage() {
+  const data = await getData();
+
+  return (
+    <div>
+      <title>{data.title}</title>
+      <h1 className="text-4xl font-bold tracking-tight">{data.headline}</h1>
+      <p>{data.body}</p>
+      <Link to="/" className="mt-4 inline-block underline">
+        Return home
+      </Link>
+    </div>
+  );
+}
+
+const getData = async () => {
+  const data = {
+    title: 'About',
+    headline: 'About Waku',
+    body: 'The minimal React framework',
+  };
+
+  return data;
+};
+
+export const getConfig = async () => {
+  return {
+    render: 'static',
+  } as const;
+};
diff --git a/src/pages/db.tsx b/src/pages/db.tsx
new file mode 100644
index 0000000..4251e6f
--- /dev/null
+++ b/src/pages/db.tsx
@@ -0,0 +1,35 @@
+import { Link } from "waku";
+import db from "../lib/db";
+
+export default async function AboutPage() {
+  const data = await getData();
+
+  return (
+    <div>
+      <title>Well</title>
+      <div className="flex flex-wrap gap-4">
+        {data.categories.categories.map((cat) => (
+          <div key={cat} className="p-2 cursor-pointer border-2 border-solid">
+            {cat}
+          </div>
+        ))}
+      </div>
+      <Link to="/" className="mt-4 inline-block underline">
+        Return home
+      </Link>
+    </div>
+  );
+}
+
+const getData = async () => {
+  const categories = db.fetchCats();
+  const eng = db.fetchLanguage("en");
+
+  return { categories, eng };
+};
+
+export const getConfig = async () => {
+  return {
+    render: "static",
+  } as const;
+};
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
new file mode 100644
index 0000000..c008c4d
--- /dev/null
+++ b/src/pages/index.tsx
@@ -0,0 +1,35 @@
+import { Link } from "waku";
+
+import { Counter } from "../components/counter";
+
+export default async function HomePage() {
+  const data = await getData();
+
+  return (
+    <div>
+      <title>{data.title}</title>
+      <h1 className="text-4xl font-bold tracking-tight">{data.headline}</h1>
+      <p>{data.body}</p>
+      <Counter />
+      <Link to="/about" className="mt-4 inline-block underline">
+        About page
+      </Link>
+    </div>
+  );
+}
+
+const getData = async () => {
+  const data = {
+    title: "Waku",
+    headline: "Waku",
+    body: "Hello world!",
+  };
+
+  return data;
+};
+
+export const getConfig = async () => {
+  return {
+    render: "static",
+  } as const;
+};