create-githat-app 1.0.15 → 1.0.16

package/dist/cli.js

@@ -11,7 +11,7 @@ import gradient from "gradient-string";
 import chalk from "chalk";
 
 // src/constants.ts
-var VERSION = "1.0.15";
+var VERSION = "1.0.16";
 var DEFAULT_API_URL = "https://api.githat.io";
 var DASHBOARD_URL = "https://githat.io/dashboard/apps";
 var BRAND_COLORS = ["#7c3aed", "#6366f1", "#8b5cf6"];
@@ -332,10 +332,12 @@ async function promptFramework(typescriptOverride, isFullstack) {
   const frameworkOptions = isFullstack ? [{ value: "nextjs", label: "Next.js 16", hint: "App Router \xB7 SSR \xB7 middleware auth" }] : [
     { value: "plain", label: "Plain", hint: "Auth + a homepage. Smallest possible GitHat app." },
     { value: "saas", label: "SaaS", hint: "Orgs, teams, RBAC, subscription billing. Replaces Clerk + Stripe." },
-    { value: "marketplace", label: "Marketplace", hint: "Multi-vendor commerce. Anonymous-first browsing, Sebastn Connect." },
-    { value: "agent", label: "AI Agent", hint: "Web4 wallet-bound agent + MCP server. Public verification." },
-    { value: "content", label: "Content", hint: "Paywalled posts, newsletter, one-time purchases. Replaces Substack." },
+    { value: "marketplace", label: "Marketplace", hint: "Multi-vendor commerce. Anonymous-first, Sebastn Connect." },
+    { value: "content", label: "Content", hint: "Paywalled posts, newsletter. Replaces Substack." },
     { value: "dashboard", label: "Dashboard", hint: "Auth-gated admin UI over your existing database." },
+    { value: "portfolio", label: "Portfolio", hint: "Personal site: public projects, auth-gated editor." },
+    { value: "classroom", label: "Classroom", hint: "Live student presentations + real-time audience feedback." },
+    { value: "agent", label: "AI Agent", hint: "Web4 wallet-bound agent + MCP server. Public verification." },
     { value: "nextjs", label: "Next.js (full kit)", hint: "Legacy: dashboard + orgs + agents + MCP scaffolding." },
     { value: "react-vite", label: "React + Vite", hint: "SPA \xB7 client-side routing." }
   ];
@@ -693,7 +695,9 @@ var NEXT_LIKE = /* @__PURE__ */ new Set([
   "marketplace",
   "agent",
   "content",
-  "dashboard"
+  "dashboard",
+  "portfolio",
+  "classroom"
 ]);
 Handlebars.registerHelper("ifNext", function(framework, options) {
   return NEXT_LIKE.has(framework) ? options.fn(this) : options.inverse(this);
@@ -751,7 +755,9 @@ var NEXT_LIKE2 = /* @__PURE__ */ new Set([
   "marketplace",
   "agent",
   "content",
-  "dashboard"
+  "dashboard",
+  "portfolio",
+  "classroom"
 ]);
 var MINIMAL = /* @__PURE__ */ new Set([
   "plain",
@@ -759,7 +765,9 @@ var MINIMAL = /* @__PURE__ */ new Set([
   "marketplace",
   "agent",
   "content",
-  "dashboard"
+  "dashboard",
+  "portfolio",
+  "classroom"
 ]);
 function buildPackageJson(ctx) {
   const isNext = NEXT_LIKE2.has(ctx.framework);
@@ -973,7 +981,9 @@ async function scaffold(context, options) {
     "marketplace",
     "agent",
     "content",
-    "dashboard"
+    "dashboard",
+    "portfolio",
+    "classroom"
   ]);
   if (!isFullstack && NEXT_LIKE3.has(context.framework)) {
     await registerApp(context.projectName, root);
@@ -1630,7 +1640,7 @@ skillsCommand.action(() => {
 // src/cli.ts
 var program = new Command7();
 program.name("githat").description("GitHat CLI - Scaffold apps and manage skills").version(VERSION);
-program.command("create [project-name]", { isDefault: true }).description("Scaffold a new GitHat app").option("--key <key>", "GitHat publishable key (pk_live_...)").option("--ts", "Use TypeScript (default)").option("--js", "Use JavaScript").option("--plain", "Smallest scaffold: auth + a homepage. No dashboard.").option("--saas", "B2B starter: orgs, teams, RBAC, subscription billing.").option("--marketplace", "Multi-vendor commerce: anonymous-first browsing, Sebastn Connect.").option("--agent", "Web4 wallet-bound autonomous agent + MCP server registration.").option("--content", "Paywalled posts, newsletter, one-time purchases via Sebastn.").option("--dashboard", "Admin UI over your existing database, auth-gated.").option("--fullstack", "Create fullstack project (Turborepo)").option("--backend <framework>", "Backend framework (hono, express, fastify)").option("-y, --yes", "Skip prompts and use defaults").action(async (projectName, opts) => {
+program.command("create [project-name]", { isDefault: true }).description("Scaffold a new GitHat app").option("--key <key>", "GitHat publishable key (pk_live_...)").option("--ts", "Use TypeScript (default)").option("--js", "Use JavaScript").option("--plain", "Smallest scaffold: auth + a homepage. No dashboard.").option("--saas", "B2B starter: orgs, teams, RBAC, subscription billing.").option("--marketplace", "Multi-vendor commerce: anonymous-first browsing, Sebastn Connect.").option("--agent", "Web4 wallet-bound autonomous agent + MCP server registration.").option("--content", "Paywalled posts, newsletter, one-time purchases via Sebastn.").option("--dashboard", "Admin UI over your existing database, auth-gated.").option("--portfolio", "Personal portfolio: public projects, auth-gated editor.").option("--classroom", "Live student presentations with real-time audience feedback.").option("--fullstack", "Create fullstack project (Turborepo)").option("--backend <framework>", "Backend framework (hono, express, fastify)").option("-y, --yes", "Skip prompts and use defaults").action(async (projectName, opts) => {
   try {
     displayBanner();
     if (!opts.yes && !opts.key) {
@@ -1656,7 +1666,7 @@ program.command("create [project-name]", { isDefault: true }).description("Scaff
       p12.cancel(chalk10.red("Project name is required when using --yes flag"));
       process.exit(1);
     }
-    const template = opts.marketplace ? "marketplace" : opts.agent ? "agent" : opts.saas ? "saas" : opts.content ? "content" : opts.dashboard ? "dashboard" : opts.plain ? "plain" : void 0;
+    const template = opts.marketplace ? "marketplace" : opts.classroom ? "classroom" : opts.portfolio ? "portfolio" : opts.agent ? "agent" : opts.saas ? "saas" : opts.content ? "content" : opts.dashboard ? "dashboard" : opts.plain ? "plain" : void 0;
     const answers = await runPrompts({
       initialName: projectName,
       publishableKey: opts.key,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-githat-app",
-  "version": "1.0.15",
+  "version": "1.0.16",
   "description": "GitHat CLI — scaffold apps and manage the skills marketplace",
   "type": "module",
   "bin": {

package/templates/agent/app/admin/agent/page.tsx.hbs

@@ -0,0 +1,127 @@
+'use client';
+
+import Link from 'next/link';
+import { useAuth } from '@githat/nextjs';
+
+/**
+ * Agent operator dashboard — control the agent you registered.
+ *
+ * Three core actions an operator does:
+ *   1. See live status (active / paused / revoked)
+ *   2. Adjust capabilities (which tools the agent can call)
+ *   3. Hit the kill switch
+ *
+ * Real apps fetch the agent record from GitHat's
+ * GET /agent/{walletAddress}. Stub below shows the data shape.
+ */
+export default function AgentAdminPage() {
+  const { isSignedIn, isLoading } = useAuth();
+
+  if (isLoading) return <div style=\{{ padding: 'var(--space-8)', color: 'var(--fg-muted)' }}>Loading…</div>;
+  if (!isSignedIn) {
+    return (
+      <div style=\{{ padding: 'var(--space-8)', textAlign: 'center' }}>
+        <Link href="/sign-in" style=\{{ color: 'var(--primary)' }}>Sign in →</Link>
+      </div>
+    );
+  }
+
+  const agent = {
+    name: 'My research agent',
+    wallet: '0xAB12…CDEf',
+    status: 'active' as 'active' | 'paused' | 'revoked',
+    capabilities: ['web.search', 'web.fetch', 'arxiv.read'],
+    actionsLast24h: 47,
+    verifyUrl: 'https://githat.io/verify/agent/0xAB12...CDEf',
+  };
+
+  return (
+    <div style=\{{ padding: 'var(--space-8) var(--space-4)', maxWidth: '48rem', margin: '0 auto' }}>
+      <h1 style=\{{ fontFamily: 'var(--font-wordmark)', fontSize: '2rem', marginBottom: 'var(--space-2)' }}>
+        {agent.name}
+      </h1>
+      <p style=\{{ color: 'var(--fg-muted)', fontSize: '0.875rem', marginBottom: 'var(--space-6)' }}>
+        Wallet: <code>{agent.wallet}</code>
+      </p>
+
+      <section style=\{{
+        padding: 'var(--space-5)',
+        borderRadius: 'var(--radius-md, 0.5rem)',
+        border: '1px solid var(--border)',
+        background: 'var(--surface)',
+        marginBottom: 'var(--space-6)',
+      }}>
+        <div style=\{{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 'var(--space-3)' }}>
+          <span style=\{{ fontSize: '0.875rem', color: 'var(--fg-muted)' }}>Status</span>
+          <span style=\{{
+            padding: 'var(--space-1) var(--space-3)',
+            borderRadius: 'var(--radius-full, 9999px)',
+            background: agent.status === 'active' ? 'var(--success)' : agent.status === 'paused' ? 'var(--warn)' : 'var(--danger)',
+            color: 'var(--bg)',
+            fontSize: '0.75rem',
+            fontWeight: 700,
+          }}>
+            {agent.status.toUpperCase()}
+          </span>
+        </div>
+        <div style=\{{ fontSize: '2rem', fontWeight: 600, marginBottom: 'var(--space-1)' }}>
+          {agent.actionsLast24h}
+        </div>
+        <div style=\{{ fontSize: '0.75rem', color: 'var(--fg-subtle)' }}>actions in the last 24 hours</div>
+      </section>
+
+      <section style=\{{ marginBottom: 'var(--space-6)' }}>
+        <h2 style=\{{ fontSize: '1.125rem', marginBottom: 'var(--space-3)' }}>Capabilities</h2>
+        <ul style=\{{ listStyle: 'none', padding: 0, margin: 0, display: 'flex', flexWrap: 'wrap', gap: 'var(--space-2)' }}>
+          {agent.capabilities.map((cap) => (
+            <li key={cap} style=\{{
+              padding: 'var(--space-2) var(--space-3)',
+              borderRadius: 'var(--radius-md, 0.5rem)',
+              border: '1px solid var(--border)',
+              background: 'var(--surface)',
+              fontSize: '0.875rem',
+              fontFamily: 'var(--font-mono, monospace)',
+            }}>
+              {cap}
+            </li>
+          ))}
+        </ul>
+      </section>
+
+      <section style=\{{ display: 'flex', gap: 'var(--space-3)', flexWrap: 'wrap' }}>
+        <a href={agent.verifyUrl} target="_blank" rel="noopener noreferrer" style=\{{
+          padding: 'var(--space-3) var(--space-4)',
+          borderRadius: 'var(--radius-md, 0.5rem)',
+          border: '1px solid var(--border)',
+          color: 'var(--fg)',
+          textDecoration: 'none',
+        }}>
+          Public verify URL ↗
+        </a>
+        <Link href="/admin/mcp" style=\{{
+          padding: 'var(--space-3) var(--space-4)',
+          borderRadius: 'var(--radius-md, 0.5rem)',
+          border: '1px solid var(--border)',
+          color: 'var(--fg)',
+          textDecoration: 'none',
+        }}>
+          MCP servers
+        </Link>
+        <button
+          onClick={() => { /* TODO: POST /api/agent/kill */ }}
+          style=\{{
+            padding: 'var(--space-3) var(--space-4)',
+            borderRadius: 'var(--radius-md, 0.5rem)',
+            border: '1px solid var(--danger)',
+            background: 'transparent',
+            color: 'var(--danger)',
+            fontWeight: 600,
+            cursor: 'pointer',
+          }}
+        >
+          Kill switch
+        </button>
+      </section>
+    </div>
+  );
+}

package/templates/agent/app/page.tsx.hbs

@@ -1,123 +1,100 @@
 'use client';
 
-import { SignInButton, SignUpButton, UserButton, useAuth } from '@githat/nextjs';
+import Link from 'next/link';
+import { useAuth } from '@githat/nextjs';
 
 /**
- * Plain GitHat homepage.
+ * AI Agent template — Web4 identity, MCP, public verification.
  *
- * No dashboard, no orgs, no agents — just one page that flips between
- * "signed out" and "signed in." The smallest possible example of "I
- * have GitHat wired up." Replace this file with whatever your app
- * actually does — auth keeps working.
+ * The pitch: every other auth platform stops at humans. GitHat
+ * extends identity to autonomous agents — wallet-bound (Ethereum
+ * sigs), capability-scoped, kill-switchable, audit-logged. Anyone
+ * can verify an agent at /verify/agent/<wallet>.
+ *
+ * This template is the agent operator's dashboard, plus the public
+ * /verify endpoint anyone can hit to check an agent's status.
  */
 export default function Home() {
-  const { isSignedIn, isLoading, user } = useAuth();
-
-  if (isLoading) {
-    return (
-      <div
-        style=\{{
-          display: 'flex',
-          minHeight: 'calc(100vh - 64px)',
-          alignItems: 'center',
-          justifyContent: 'center',
-          color: 'var(--fg-muted)',
-        }}
-      >
-        Loading…
-      </div>
-    );
-  }
+  const { isSignedIn } = useAuth();
 
   return (
-    <div
-      style=\{{
-        display: 'flex',
-        minHeight: 'calc(100vh - 64px)',
-        alignItems: 'center',
-        justifyContent: 'center',
-        padding: 'var(--space-8) var(--space-4)',
-        background: 'var(--bg)',
-      }}
-    >
-      <main
-        style=\{{
-          width: '100%',
-          maxWidth: '32rem',
-          textAlign: 'center',
-          color: 'var(--fg)',
-        }}
-      >
+    <div style=\{{ background: 'var(--bg)', color: 'var(--fg)', minHeight: 'calc(100vh - 64px)' }}>
+      <section style=\{{
+        padding: 'var(--space-12) var(--space-4)',
+        textAlign: 'center',
+        maxWidth: '40rem',
+        margin: '0 auto',
+      }}>
+        <h1 style=\{{
+          fontFamily: 'var(--font-wordmark, Georgia, serif)',
+          fontSize: 'clamp(2rem, 5vw, 3rem)',
+          lineHeight: 1.1,
+          marginBottom: 'var(--space-3)',
+        }}>
+          {{businessName}}
+        </h1>
+        <p style=\{{ color: 'var(--fg-muted)', fontSize: '1.125rem', marginBottom: 'var(--space-6)' }}>
+          Wallet-bound identity for autonomous AI agents. Capability
+          scoping, kill switch, audit trail — and a public /verify
+          endpoint anyone can hit.
+        </p>
         {!isSignedIn ? (
-          <>
-            <h1
-              style=\{{
-                fontFamily: 'var(--font-wordmark)',
-                fontSize: '2.5rem',
-                lineHeight: 1.1,
-                marginBottom: 'var(--space-3)',
-              }}
-            >
-              Welcome to {{businessName}}
-            </h1>
-            <p
-              style=\{{
-                color: 'var(--fg-muted)',
-                marginBottom: 'var(--space-6)',
-                lineHeight: 1.6,
-              }}
-            >
-              Sign in to continue, or create an account in 30 seconds.
-              We use GitHat for identity — your password never touches
-              this app.
-            </p>
-            <div
-              style=\{{
-                display: 'flex',
-                gap: 'var(--space-3)',
-                justifyContent: 'center',
-                flexWrap: 'wrap',
-              }}
-            >
-              <SignInButton />
-              <SignUpButton />
-            </div>
-          </>
+          <Link href="/sign-up" style=\{{
+            display: 'inline-block',
+            padding: 'var(--space-3) var(--space-6)',
+            borderRadius: 'var(--radius-md, 0.5rem)',
+            background: 'var(--primary)',
+            color: 'var(--bg)',
+            fontWeight: 600,
+            textDecoration: 'none',
+          }}>
+            Register an agent →
+          </Link>
         ) : (
-          <>
-            <div
-              style=\{{
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
-                gap: 'var(--space-4)',
-                marginBottom: 'var(--space-6)',
-              }}
-            >
-              <UserButton />
-              <h1
-                style=\{{
-                  fontFamily: 'var(--font-wordmark)',
-                  fontSize: '2rem',
-                  margin: 0,
-                }}
-              >
-                Hello{user?.name ? `, ${user.name}` : ''}.
-              </h1>
-            </div>
-            <p
-              style=\{{
-                color: 'var(--fg-muted)',
-                lineHeight: 1.6,
-              }}
-            >
-              That's it. The plain template doesn't ship a dashboard or
-              any other route — replace this page with whatever your
-              app actually does. Authentication will keep working.
-            </p>
-          </>
+          <Link href="/admin/agent" style=\{{
+            display: 'inline-block',
+            padding: 'var(--space-3) var(--space-6)',
+            borderRadius: 'var(--radius-md, 0.5rem)',
+            background: 'var(--primary)',
+            color: 'var(--bg)',
+            fontWeight: 600,
+            textDecoration: 'none',
+          }}>
+            Open agent dashboard →
+          </Link>
         )}
-      </main>
+      </section>
+
+      <section style=\{{ padding: 'var(--space-8) var(--space-4)', background: 'var(--surface-sub)' }}>
+        <div style=\{{ maxWidth: '48rem', margin: '0 auto' }}>
+          <h2 style=\{{ fontSize: '1.5rem', marginBottom: 'var(--space-4)' }}>What you get</h2>
+          <ul style=\{{ listStyle: 'none', padding: 0, margin: 0, display: 'flex', flexDirection: 'column', gap: 'var(--space-3)' }}>
+            <Item emoji="🪪" title="Wallet-bound identity" body="Ethereum-style key pair. The agent signs requests; clients verify the signature. No shared secrets to leak." />
+            <Item emoji="🎚" title="Capability scopes" body="Each agent can only call the tools you explicitly granted. Add or revoke at any time." />
+            <Item emoji="🛑" title="Kill switch" body="One click and the agent is revoked everywhere. Existing tokens stop working immediately." />
+            <Item emoji="📜" title="Audit log" body="Every action is logged with timestamp, capability used, and signature. Prove what happened." />
+            <Item emoji="🔍" title="Public verification" body="Anyone can hit githat.io/verify/agent/<wallet> and see the agent's status, capabilities, and recent actions." />
+          </ul>
+        </div>
+      </section>
     </div>
   );
 }
+
+function Item({ emoji, title, body }: { emoji: string; title: string; body: string }) {
+  return (
+    <li style=\{{
+      display: 'flex',
+      gap: 'var(--space-4)',
+      padding: 'var(--space-4)',
+      borderRadius: 'var(--radius-md, 0.5rem)',
+      background: 'var(--surface)',
+    }}>
+      <span style=\{{ fontSize: '1.5rem' }} aria-hidden>{emoji}</span>
+      <div>
+        <div style=\{{ fontWeight: 600, marginBottom: 'var(--space-1)' }}>{title}</div>
+        <div style=\{{ fontSize: '0.875rem', color: 'var(--fg-muted)' }}>{body}</div>
+      </div>
+    </li>
+  );
+}

package/templates/classroom/app/(auth)/sign-in/page.tsx.hbs

@@ -0,0 +1,9 @@
+import { SignInForm } from '@githat/nextjs';
+
+export default function SignInPage() {
+  return (
+    <main {{#if useTailwind}}className="flex items-center justify-center min-h-screen bg-[#09090b]"{{else}}style=\{{ display: 'flex', alignItems: 'center', justifyContent: 'center', minHeight: '100vh', background: '#09090b' }}{{/if}}>
+      <SignInForm signUpUrl="/sign-up" {{#if includeForgotPassword}}forgotPasswordUrl="/forgot-password"{{/if}} />
+    </main>
+  );
+}

package/templates/classroom/app/(auth)/sign-up/page.tsx.hbs

@@ -0,0 +1,9 @@
+import { SignUpForm } from '@githat/nextjs';
+
+export default function SignUpPage() {
+  return (
+    <main {{#if useTailwind}}className="flex items-center justify-center min-h-screen bg-[#09090b]"{{else}}style=\{{ display: 'flex', alignItems: 'center', justifyContent: 'center', minHeight: '100vh', background: '#09090b' }}{{/if}}>
+      <SignUpForm signInUrl="/sign-in" />
+    </main>
+  );
+}

package/templates/classroom/app/globals.css.hbs

@@ -0,0 +1,87 @@
+/*
+ * Tailwind v4 — required because @githat/nextjs/styles is processed
+ * through @tailwindcss/postcss. Plain doesn't ship utility classes,
+ * but the import is needed for the auth pages to render styled.
+ */
+@import "tailwindcss";
+
+/*
+ * Plain template — self-contained globals.
+ *
+ * Defines the minimum CSS variables a GitHat app uses for layout and
+ * the auth-page styling that ships with @githat/nextjs/styles.
+ * Override these in your own files when you want a real theme.
+ *
+ * Light theme by default; flip --bg/--fg for dark.
+ */
+
+:root {
+  /* Surface */
+  --bg:           #ffffff;
+  --surface:      #fafafa;
+  --surface-sub:  #f4f4f5;
+
+  /* Borders */
+  --border:       #e5e7eb;
+
+  /* Foreground */
+  --fg:           #0a0a0a;
+  --fg-muted:     #525252;
+  --fg-subtle:    #737373;
+
+  /* Brand — change these two to re-skin the whole auth flow */
+  --primary:      #6366f1;
+  --accent:       #f59e0b;
+
+  /* Semantic */
+  --success:      #16a34a;
+  --warn:         #d97706;
+  --danger:       #dc2626;
+
+  /* Spacing — used by @githat/nextjs/styles */
+  --space-1: 0.25rem;
+  --space-2: 0.5rem;
+  --space-3: 0.75rem;
+  --space-4: 1rem;
+  --space-6: 1.5rem;
+  --space-8: 2rem;
+
+  /* Radius */
+  --radius:    0.5rem;
+  --radius-md: 0.5rem;
+  --radius-lg: 0.75rem;
+
+  /* Fonts */
+  --font-sans:     'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
+  --font-wordmark: 'Instrument Serif', Georgia, serif;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --bg:           #0a0a0a;
+    --surface:      #18181b;
+    --surface-sub:  #27272a;
+    --border:       #3f3f46;
+    --fg:           #fafafa;
+    --fg-muted:     #a1a1aa;
+    --fg-subtle:    #71717a;
+  }
+}
+
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+body {
+  font-family: var(--font-sans);
+  background: var(--bg);
+  color: var(--fg);
+  line-height: 1.5;
+}
+
+a {
+  color: inherit;
+  text-decoration: none;
+}

package/templates/classroom/app/layout.tsx.hbs

@@ -0,0 +1,41 @@
+import { GitHatProvider } from '@githat/nextjs';
+import '@githat/nextjs/styles';
+import './globals.css';
+
+export const metadata = {
+  title: '{{businessName}}',
+  description: '{{description}}',
+};
+
+export default function RootLayout({ children }{{#if typescript}}: { children: React.ReactNode }{{/if}}) {
+  return (
+    <html lang="en">
+      <body>
+        {/*
+          Plain template: no @githat/ui dep, no Wordmark. The
+          full-kit (`nextjs`) template uses @githat/ui for the
+          shared design system; the plain scaffold is the smallest
+          working app, so we avoid extra deps.
+        */}
+        <GitHatProvider config=\{{
+          publishableKey: process.env.NEXT_PUBLIC_GITHAT_PUBLISHABLE_KEY || '',
+          signInUrl: '/sign-in',
+          signUpUrl: '/sign-up',
+          afterSignInUrl: '/',
+          afterSignOutUrl: '/',
+        }}>
+          <header style=\{{
+            padding: '1rem 1.5rem',
+            borderBottom: '1px solid var(--border, #e5e7eb)',
+            fontFamily: 'system-ui, -apple-system, sans-serif',
+          }}>
+            <a href="/" style=\{{ textDecoration: 'none', color: 'inherit', fontWeight: 600 }}>
+              {{businessName}}
+            </a>
+          </header>
+          <main>{children}</main>
+        </GitHatProvider>
+      </body>
+    </html>
+  );
+}