feat: API

.github/workflows/deploy-docs.yml

@@ -29,15 +29,29 @@ jobs:
       - name: Remove broken postcss.config.mjs
         run: rm -f /home/runner/work/AirTrail/AirTrail/postcss.config.mjs
 
+      - name: Restore cache
+        uses: actions/cache@e12d46a63a90f2fae62d114769bbf2a179198b5c # v3.3.3
+        with:
+          path: |
+            .next/cache
+          key: ${{ runner.os }}-nextjs-${{ hashFiles('**/bun.lockb') }}-${{ hashFiles('**.[jt]s', '**.[jt]sx') }}
+          restore-keys: |
+            ${{ runner.os }}-nextjs-${{ hashFiles('**/bun.lockb') }}-
+
       - name: Install dependencies
         run: bun install --frozen-lockfile
       - name: Build website
+        env:
+          NEXT_PUBLIC_ALGOLIA_APP_ID: ${{ secrets.NEXT_PUBLIC_ALGOLIA_APP_ID }}
+          NEXT_PUBLIC_ALGOLIA_INDEX: ${{ secrets.NEXT_PUBLIC_ALGOLIA_INDEX }}
+          NEXT_PUBLIC_ALGOLIA_API_KEY: ${{ secrets.NEXT_PUBLIC_ALGOLIA_API_KEY }}
+          ALGOLIA_API_KEY: ${{ secrets.ALGOLIA_API_KEY }}
         run: bun run build
 
       - name: Upload Build Artifact
         uses: actions/upload-pages-artifact@56afc609e74202658d3ffba0e8f6dda462b719fa # v3
         with:
-          path: docs/dist/
+          path: docs/out
 
   deploy:
     name: Deploy to GitHub Pages

docs/.gitignore

@@ -1,21 +1,28 @@
-# build output
-dist/
-# generated types
-.astro/
+# deps
+/node_modules
 
-# dependencies
-node_modules/
+# generated content
+.contentlayer
+.content-collections
+.source
 
-# logs
+# test & build
+/coverage
+/.next/
+/out/
+/build
+*.tsbuildinfo
+
+# misc
+.DS_Store
+*.pem
+/.pnp
+.pnp.js
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-pnpm-debug.log*
-
 
-# environment variables
-.env
-.env.production
-
-# macOS-specific files
-.DS_Store
+# others
+.env*.local
+.vercel
+next-env.d.ts

docs/app/(home)/changelog/page.tsx

@@ -0,0 +1,74 @@
+import defaultMdxComponents from 'fumadocs-ui/mdx';
+import { Jsx, toJsxRuntime } from 'hast-util-to-jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { remark } from 'remark';
+import remarkRehype from 'remark-rehype';
+import { z } from 'zod';
+
+export default async function Changelog() {
+  const formatter = new Intl.DateTimeFormat(undefined, {
+    dateStyle: 'long',
+  });
+
+  const resp = await fetch(
+    'https://api.github.com/repos/johanohly/AirTrail/releases',
+  );
+  const body = await resp.json();
+  const releases: {
+    name: string;
+    body: string;
+    html_url: string;
+    published_at: Date;
+    bodyElement?: JSX.Element;
+  }[] = z
+    .object({
+      name: z.string(),
+      body: z.string(),
+      html_url: z.string(),
+      published_at: z.coerce.date(),
+    })
+    .array()
+    .parse(body);
+
+  const processor = remark().use(remarkRehype);
+  const { img: _, ...comps } = defaultMdxComponents;
+
+  for (const release of releases) {
+    const nodes = processor.parse({
+      value: release.body.replaceAll("What's Changed", ''),
+    });
+    const hast = await processor.run(nodes);
+    release.bodyElement = toJsxRuntime(hast, {
+      development: false,
+      jsx: jsx as Jsx,
+      jsxs: jsxs as Jsx,
+      Fragment,
+      // @ts-expect-error -- safe to use
+      components: comps,
+    });
+  }
+
+  return (
+    <div className="flex flex-col">
+      <div className="">
+        <h3 className="text-3xl font-bold">Changelog</h3>
+        <p className="text-muted-foreground">
+          Stay up to date with the latest changes to AirTrail!
+        </p>
+      </div>
+      <div className="border-t mt-10 pt-20" />
+      {releases.map((release, i) => (
+        <section
+          className={`relative flex flex-col ${release.name !== releases[0].name && 'border-t pt-20 !mt-20'}`}
+          key={release.html_url}
+        >
+          <p className="text-muted-foreground">
+            {formatter.format(release.published_at)}
+          </p>
+          <h1 className="text-3xl font-bold !m-0">{release.name}</h1>
+          <div className="prose">{release.bodyElement}</div>
+        </section>
+      ))}
+    </div>
+  );
+}

docs/app/(home)/layout.tsx

@@ -0,0 +1,22 @@
+import { HomeLayout } from 'fumadocs-ui/layouts/home';
+import React, { ReactNode } from 'react';
+
+import { baseOptions } from '@/app/layout.config';
+
+interface Props {
+  children: ReactNode;
+}
+
+export default function Layout({
+  children,
+}: Readonly<Props>): React.ReactElement {
+  return (
+    <HomeLayout {...baseOptions}>
+      <main className="relative pb-40 pt-20 md:pt-20 overflow-hidden px-2 md:px-4 lg:px-8">
+        <div className="max-w-[84rem] w-full mx-auto relative z-20">
+          {children}
+        </div>
+      </main>
+    </HomeLayout>
+  );
+}