feat: functional practical info and faq framework

src/components/practical/FaqItem.astro

@@ -0,0 +1,12 @@
+---
+import type { FaqSnippet } from "../../types";
+
+type Props = FaqSnippet;
+
+const { title, body } = Astro.props;
+---
+
+<div>
+  <h1 class="text-white text-4xl font-bold">{title}</h1>
+  <div class="prose text-white" set:html={body} />
+</div>

src/components/practical/PracticalPage.astro

@@ -0,0 +1,26 @@
+---
+import type { InfoPage } from "../../types";
+import FaqItem from "./FaqItem.astro";
+import Intro from "../Intro.astro";
+
+type Props = InfoPage;
+
+const { title, pages = [], faq = [], intro, body } = Astro.props;
+---
+
+<div>
+  <h1 class="text-white text-4xl font-bold">{title}</h1>
+  {intro ? <Intro text={intro} /> : null}
+  <div class="prose" set:html={body} />
+  {
+    pages.map(({ url, title }) => (
+      <>
+        <a href={url} class="text-white">
+          {title}
+        </a>
+        <br />
+      </>
+    ))
+  }
+  {faq.map((item) => <FaqItem {...item} />)}
+</div>

src/pages/practical/[...path].astro

@@ -1,8 +1,8 @@
 ---
-import H1 from "../../components/H1.astro";
 import Layout from "../../layouts/Layout.astro";
 import Main from "../../components/Main.astro";
 import { fetchInfoPageByPath } from "../../utils";
+import PracticalPage from "../../components/practical/PracticalPage.astro";
 
 const sectionPrefix = "/practical/";
 
@@ -30,9 +30,6 @@ if (!page) {
 
 <Layout title=`The Gathering - ${page.title}`>
   <Main>
-    <div class="prose text-white">
-      <H1 text={page.title} />
-      {page.children.map((child) => <a href={child.meta.url}>{child.title}</a>)}
-    </div>
+    <PracticalPage {...page} />
   </Main>
 </Layout>

src/types/info.ts

@@ -1,13 +1,28 @@
 import type { MinimalApiPage } from "./utils";
 
+export interface FaqSnippet {
+  title: string;
+  body?: string;
+  url: string;
+}
+
+export interface InfoPageSnippet {
+  title: string;
+  url: string;
+}
+
 export interface InfoPage extends MinimalApiPage {
   meta: {
     url: string;
   } & MinimalApiPage["meta"];
+  title: string;
+  body?: string;
+  intro?: string;
+  pages?: InfoPageSnippet[];
+  faq?: FaqSnippet[];
 }
+
 export interface FaqPage extends MinimalApiPage {
-  meta: {
-    url: string;
-  } & MinimalApiPage["meta"];
+  title: string;
+  body?: string;
 }
-export interface FaqEntry extends MinimalApiPage {}