Fix: Migrate back to pages router :/

saber-notes · Dec 14, 2024 · c87f2fe · c87f2fe
1 parent 0fcc41f
commit c87f2fe
Show file tree

Hide file tree

Showing 12 changed files with 103 additions and 71 deletions.
diff --git a/next-env.d.ts b/next-env.d.ts
@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
+// see https://nextjs.org/docs/pages/api-reference/config/typescript for more information.
diff --git a/src/app/favicon.ico → public/favicon.ico b/src/app/favicon.ico → public/favicon.ico
diff --git a/public/next.svg b/public/next.svg
diff --git a/public/vercel.svg b/public/vercel.svg
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
diff --git a/src/app/privacy_policy/page.tsx b/src/app/privacy_policy/page.tsx
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
@@ -0,0 +1,6 @@
+import "./styles/globals.css";
+import type { AppProps } from "next/app";
+
+export default function App({ Component, pageProps }: AppProps) {
+  return <Component {...pageProps} />;
+}
diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx
@@ -0,0 +1,13 @@
+import { Html, Head, Main, NextScript } from "next/document";
+
+export default function Document() {
+  return (
+    <Html lang="en">
+      <Head />
+      <body>
+        <Main />
+        <NextScript />
+      </body>
+    </Html>
+  );
+}
diff --git a/src/app/page.tsx → src/pages/index.tsx b/src/app/page.tsx → src/pages/index.tsx
@@ -1,10 +1,25 @@
 'use client';
 
 import Image from 'next/image'
-import styles from './page.module.css'
+import styles from "./styles/Home.module.css";
 import { useEffect } from 'react';
 import { annotate, annotationGroup } from 'rough-notation';
 import assert from 'assert';
+import { Neucha } from 'next/font/google'
+import Head from "next/head";
+import Link from 'next/link';
+
+const neucha = Neucha({
+  weight: "400",
+  preload: true,
+  fallback: [
+    "Neucha", "Dekko",
+    // fallbacks from https://github.com/system-fonts/modern-font-stacks#handwritten
+    'Segoe Print', 'Bradley Hand', 'Chilanka', 'TSCu_Comic',
+    'casual', 'cursive',
+  ],
+  subsets: ["latin"],
+})
 
 /**
   * This function gets the latest version of Saber from GitHub,
@@ -20,12 +35,13 @@ async function getVersionName(): Promise<string> {
   return versionWithoutV;
 }
 
-export default async function () {
+export async function getStaticProps() {
   const versionName = await getVersionName();
-  return <Home versionName={versionName} />;
+
+  return { props: { versionName } };
 }
 
-function Home({ versionName }: { versionName: string }) {
+export default function Home({ versionName }: { versionName: string }) {
   useEffect(() => {
     const highlightColor = "var(--highlight-color)";
 
@@ -77,7 +93,14 @@ function Home({ versionName }: { versionName: string }) {
   }, []);
 
   return (
-    <main className={styles.main}>
+    <>
+    <Head>
+      <title>Saber</title>
+      <meta name="description" content="The notes app built for handwriting" />
+      <meta name="viewport" content="width=device-width, initial-scale=1" />
+      <link rel="icon" href="/favicon.ico" />
+    </Head>
+    <main className={`${styles.main} ${neucha.className}`}>
       <div className={styles.header}>
         <h1 className={styles.title}>
           Saber
@@ -165,7 +188,7 @@ function Home({ versionName }: { versionName: string }) {
         </p>
         <p>
           You can also read the{' '}
-          <a href="/privacy_policy">privacy policy</a>.
+          <Link href="/privacy_policy">privacy policy</Link>.
         </p>
       </div>
 
@@ -233,5 +256,6 @@ function Home({ versionName }: { versionName: string }) {
         </p>
       </div>
     </main>
+    </>
   )
 }
diff --git a/src/pages/privacy_policy/index.tsx b/src/pages/privacy_policy/index.tsx
@@ -0,0 +1,53 @@
+'use client';
+
+import { Neucha } from 'next/font/google';
+import Head from 'next/head';
+import ReactMarkdown from 'react-markdown'
+
+const neucha = Neucha({
+  weight: "400",
+  preload: true,
+  fallback: [
+    "Neucha", "Dekko",
+    // fallbacks from https://github.com/system-fonts/modern-font-stacks#handwritten
+    'Segoe Print', 'Bradley Hand', 'Chilanka', 'TSCu_Comic',
+    'casual', 'cursive',
+  ],
+  subsets: ["latin"],
+})
+
+async function getPrivacyPolicyMarkdown(): Promise<string> {
+  const res = await fetch('https://raw.githubusercontent.com/saber-notes/saber/main/privacy_policy.md');
+  const text = await res.text();
+  return text;
+}
+
+export async function getStaticProps() {
+  const markdown = await getPrivacyPolicyMarkdown();
+
+  return { props: { markdown } };
+}
+
+export default function PrivacyPolicy({ markdown }: { markdown: string }) {
+  return (
+    <>
+    <Head>
+      <title>Saber: Privacy Policy</title>
+      <meta name="description" content="The notes app built for handwriting" />
+      <meta name="viewport" content="width=device-width, initial-scale=1" />
+      <link rel="icon" href="/favicon.ico" />
+    </Head>
+    <main className={neucha.className}>
+      <ReactMarkdown>{markdown}</ReactMarkdown>
+
+      <br />
+      <p>
+        See this page on{' '}
+        <a href="https://github.com/saber-notes/saber/blob/main/privacy_policy.md">
+          GitHub
+        </a>
+      </p>
+    </main>
+    </>
+  );
+}
diff --git a/src/app/page.module.css → src/pages/styles/Home.module.css b/src/app/page.module.css → src/pages/styles/Home.module.css
diff --git a/src/app/globals.css → src/pages/styles/globals.css b/src/app/globals.css → src/pages/styles/globals.css