create-githat-app 1.8.1 → 1.8.3

package/dist/cli.js

@@ -21,7 +21,7 @@ var DEPS = {
       next: "^16.0.0",
       react: "^19.0.0",
       "react-dom": "^19.0.0",
-      "@githat/nextjs": "^0.12.0",
+      "@githat/nextjs": "^0.13.0",
       "@githat/ui": "^1.0.0"
     },
     devDependencies: {
@@ -36,7 +36,7 @@ var DEPS = {
       react: "^19.0.0",
       "react-dom": "^19.0.0",
       "react-router-dom": "^7.0.0",
-      "@githat/nextjs": "^0.12.0",
+      "@githat/nextjs": "^0.13.0",
       "@githat/ui": "^1.0.0"
     },
     devDependencies: {

package/package.json

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

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

@@ -0,0 +1,32 @@
+'use client';
+
+import { MfaManager } from '@githat/nextjs';
+
+/**
+ * /account/security — TOTP 2FA management for {{businessName}}.
+ *
+ * The <MfaManager/> component reads the current user's mfaEnabled flag
+ * and renders either an "Enable 2FA" CTA or the disable / regenerate-
+ * recovery-codes controls. All flows are gated behind the GitHat API
+ * (api.githat.io) — no integration code lives in this scaffold.
+ */
+export default function SecurityPage() {
+  return (
+    <main
+      style=\{{
+        maxWidth: '640px',
+        margin: '0 auto',
+        padding: 'var(--space-8, 2rem) var(--space-4, 1rem)',
+        color: 'var(--fg, #111)',
+      }}
+    >
+      <header style=\{{ marginBottom: '1.5rem' }}>
+        <h1 style=\{{ fontSize: '1.875rem', fontWeight: 700, margin: 0 }}>Security</h1>
+        <p style=\{{ color: 'var(--fg-muted, #666)', marginTop: '0.25rem' }}>
+          Manage two-factor authentication for your {{businessName}} account.
+        </p>
+      </header>
+      <MfaManager />
+    </main>
+  );
+}

package/templates/base/README.md.hbs

@@ -66,9 +66,54 @@ After that, every `git push origin main` triggers a build + rsync + restart. The
 {{/if}}{{#if includeOrgManagement}}- `/dashboard/members` — Invite members, manage roles
 {{/if}}
 
+## Branded auth emails (recommended)
+
+Out of the box, password-reset and verification emails are sent from
+`auth@githat.io` with the **From name** set to your app's brand
+("{{businessName}}"). Most email clients show the brand prominently and
+hide the address — but for the most polished experience, verify your
+own domain so emails come from `auth@{{domain}}` instead:
+
+```bash
+# 1. Register your domain in SES via the GitHat API
+curl -X POST https://api.githat.io/apps/$APP_ID/email/domains \
+  -H "Authorization: Bearer $ACCESS_TOKEN" \
+  -H "Content-Type: application/json" \
+  -d '{"hostname": "{{domain}}"}'
+```
+
+The response includes 3 DKIM CNAMEs. Add them to your DNS registrar
+(Route 53, Cloudflare, Namecheap, etc.). SES auto-verifies within
+~5 minutes, after which every auth email ships from `auth@{{domain}}`
+with your brand throughout — subject, body, and reset link.
+
+You can also verify domains via the SDK's `useEmailDomains()` hook:
+
+```{{#if typescript}}tsx{{else}}jsx{{/if}}
+import { useEmailDomains } from '@githat/nextjs';
+
+const { add, list, status } = useEmailDomains();
+await add('{{domain}}');           // returns { dkimRecords }
+const domains = await list();      // includes verificationStatus
+```
+
+Once verified, links in emails point to `https://{{domain}}/reset-password?token=…`
+— users never see githat.io.
+
+## Two-factor authentication
+
+Users can enable TOTP-based 2FA at `/account/security` (the page is
+scaffolded for you). After enrollment, sign-in flows automatically
+gate behind a 6-digit code from any authenticator app (1Password,
+Authy, Google Authenticator, etc.). Recovery codes are generated
+once at enrollment for account recovery.
+
+`<SignInForm/>` and `<MfaChallenge/>` from `@githat/nextjs` handle
+the entire flow end-to-end — no integration code needed.
+
 ## Learn More
 
 - [GitHat Documentation](https://githat.io/docs)
+- [Branded Auth Emails Guide](https://githat.io/docs/email-domains)
 - [SDK Reference](https://www.npmjs.com/package/@githat/nextjs)
 - [API Reference](https://githat.io/docs/api)
-tps://githat.io/docs/api)

package/templates/base/githat/dashboard/layout.tsx.hbs

@@ -24,6 +24,7 @@ const navItems = [
 {{#if includeAgentModule}}
   { label: 'AI Agents', href: '/dashboard/agents' },
 {{/if}}
+  { label: 'Security', href: '/account/security' },
 ];
 
 export function DashboardLayout({ children }{{#if typescript}}: { children: React.ReactNode }{{/if}}) {

package/templates/classroom/app/account/security/page.tsx.hbs

@@ -0,0 +1,32 @@
+'use client';
+
+import { MfaManager } from '@githat/nextjs';
+
+/**
+ * /account/security — TOTP 2FA management for {{businessName}}.
+ *
+ * The <MfaManager/> component reads the current user's mfaEnabled flag
+ * and renders either an "Enable 2FA" CTA or the disable / regenerate-
+ * recovery-codes controls. All flows are gated behind the GitHat API
+ * (api.githat.io) — no integration code lives in this scaffold.
+ */
+export default function SecurityPage() {
+  return (
+    <main
+      style=\{{
+        maxWidth: '640px',
+        margin: '0 auto',
+        padding: 'var(--space-8, 2rem) var(--space-4, 1rem)',
+        color: 'var(--fg, #111)',
+      }}
+    >
+      <header style=\{{ marginBottom: '1.5rem' }}>
+        <h1 style=\{{ fontSize: '1.875rem', fontWeight: 700, margin: 0 }}>Security</h1>
+        <p style=\{{ color: 'var(--fg-muted, #666)', marginTop: '0.25rem' }}>
+          Manage two-factor authentication for your {{businessName}} account.
+        </p>
+      </header>
+      <MfaManager />
+    </main>
+  );
+}

package/templates/content/app/account/security/page.tsx.hbs

@@ -0,0 +1,32 @@
+'use client';
+
+import { MfaManager } from '@githat/nextjs';
+
+/**
+ * /account/security — TOTP 2FA management for {{businessName}}.
+ *
+ * The <MfaManager/> component reads the current user's mfaEnabled flag
+ * and renders either an "Enable 2FA" CTA or the disable / regenerate-
+ * recovery-codes controls. All flows are gated behind the GitHat API
+ * (api.githat.io) — no integration code lives in this scaffold.
+ */
+export default function SecurityPage() {
+  return (
+    <main
+      style=\{{
+        maxWidth: '640px',
+        margin: '0 auto',
+        padding: 'var(--space-8, 2rem) var(--space-4, 1rem)',
+        color: 'var(--fg, #111)',
+      }}
+    >
+      <header style=\{{ marginBottom: '1.5rem' }}>
+        <h1 style=\{{ fontSize: '1.875rem', fontWeight: 700, margin: 0 }}>Security</h1>
+        <p style=\{{ color: 'var(--fg-muted, #666)', marginTop: '0.25rem' }}>
+          Manage two-factor authentication for your {{businessName}} account.
+        </p>
+      </header>
+      <MfaManager />
+    </main>
+  );
+}

package/templates/dashboard/app/account/security/page.tsx.hbs

@@ -0,0 +1,32 @@
+'use client';
+
+import { MfaManager } from '@githat/nextjs';
+
+/**
+ * /account/security — TOTP 2FA management for {{businessName}}.
+ *
+ * The <MfaManager/> component reads the current user's mfaEnabled flag
+ * and renders either an "Enable 2FA" CTA or the disable / regenerate-
+ * recovery-codes controls. All flows are gated behind the GitHat API
+ * (api.githat.io) — no integration code lives in this scaffold.
+ */
+export default function SecurityPage() {
+  return (
+    <main
+      style=\{{
+        maxWidth: '640px',
+        margin: '0 auto',
+        padding: 'var(--space-8, 2rem) var(--space-4, 1rem)',
+        color: 'var(--fg, #111)',
+      }}
+    >
+      <header style=\{{ marginBottom: '1.5rem' }}>
+        <h1 style=\{{ fontSize: '1.875rem', fontWeight: 700, margin: 0 }}>Security</h1>
+        <p style=\{{ color: 'var(--fg-muted, #666)', marginTop: '0.25rem' }}>
+          Manage two-factor authentication for your {{businessName}} account.
+        </p>
+      </header>
+      <MfaManager />
+    </main>
+  );
+}

package/templates/marketplace/app/account/security/page.tsx.hbs

@@ -0,0 +1,32 @@
+'use client';
+
+import { MfaManager } from '@githat/nextjs';
+
+/**
+ * /account/security — TOTP 2FA management for {{businessName}}.
+ *
+ * The <MfaManager/> component reads the current user's mfaEnabled flag
+ * and renders either an "Enable 2FA" CTA or the disable / regenerate-
+ * recovery-codes controls. All flows are gated behind the GitHat API
+ * (api.githat.io) — no integration code lives in this scaffold.
+ */
+export default function SecurityPage() {
+  return (
+    <main
+      style=\{{
+        maxWidth: '640px',
+        margin: '0 auto',
+        padding: 'var(--space-8, 2rem) var(--space-4, 1rem)',
+        color: 'var(--fg, #111)',
+      }}
+    >
+      <header style=\{{ marginBottom: '1.5rem' }}>
+        <h1 style=\{{ fontSize: '1.875rem', fontWeight: 700, margin: 0 }}>Security</h1>
+        <p style=\{{ color: 'var(--fg-muted, #666)', marginTop: '0.25rem' }}>
+          Manage two-factor authentication for your {{businessName}} account.
+        </p>
+      </header>
+      <MfaManager />
+    </main>
+  );
+}

package/templates/nextjs/app/account/security/page.tsx.hbs

@@ -0,0 +1,32 @@
+'use client';
+
+import { MfaManager } from '@githat/nextjs';
+
+/**
+ * /account/security — TOTP 2FA management for {{businessName}}.
+ *
+ * The <MfaManager/> component reads the current user's mfaEnabled flag
+ * and renders either an "Enable 2FA" CTA or the disable / regenerate-
+ * recovery-codes controls. All flows are gated behind the GitHat API
+ * (api.githat.io) — no integration code lives in this scaffold.
+ */
+export default function SecurityPage() {
+  return (
+    <main
+      style=\{{
+        maxWidth: '640px',
+        margin: '0 auto',
+        padding: 'var(--space-8, 2rem) var(--space-4, 1rem)',
+        color: 'var(--fg, #111)',
+      }}
+    >
+      <header style=\{{ marginBottom: '1.5rem' }}>
+        <h1 style=\{{ fontSize: '1.875rem', fontWeight: 700, margin: 0 }}>Security</h1>
+        <p style=\{{ color: 'var(--fg-muted, #666)', marginTop: '0.25rem' }}>
+          Manage two-factor authentication for your {{businessName}} account.
+        </p>
+      </header>
+      <MfaManager />
+    </main>
+  );
+}

package/templates/plain/app/account/security/page.tsx.hbs

@@ -0,0 +1,32 @@
+'use client';
+
+import { MfaManager } from '@githat/nextjs';
+
+/**
+ * /account/security — TOTP 2FA management for {{businessName}}.
+ *
+ * The <MfaManager/> component reads the current user's mfaEnabled flag
+ * and renders either an "Enable 2FA" CTA or the disable / regenerate-
+ * recovery-codes controls. All flows are gated behind the GitHat API
+ * (api.githat.io) — no integration code lives in this scaffold.
+ */
+export default function SecurityPage() {
+  return (
+    <main
+      style=\{{
+        maxWidth: '640px',
+        margin: '0 auto',
+        padding: 'var(--space-8, 2rem) var(--space-4, 1rem)',
+        color: 'var(--fg, #111)',
+      }}
+    >
+      <header style=\{{ marginBottom: '1.5rem' }}>
+        <h1 style=\{{ fontSize: '1.875rem', fontWeight: 700, margin: 0 }}>Security</h1>
+        <p style=\{{ color: 'var(--fg-muted, #666)', marginTop: '0.25rem' }}>
+          Manage two-factor authentication for your {{businessName}} account.
+        </p>
+      </header>
+      <MfaManager />
+    </main>
+  );
+}

package/templates/portfolio/app/account/security/page.tsx.hbs

@@ -0,0 +1,32 @@
+'use client';
+
+import { MfaManager } from '@githat/nextjs';
+
+/**
+ * /account/security — TOTP 2FA management for {{businessName}}.
+ *
+ * The <MfaManager/> component reads the current user's mfaEnabled flag
+ * and renders either an "Enable 2FA" CTA or the disable / regenerate-
+ * recovery-codes controls. All flows are gated behind the GitHat API
+ * (api.githat.io) — no integration code lives in this scaffold.
+ */
+export default function SecurityPage() {
+  return (
+    <main
+      style=\{{
+        maxWidth: '640px',
+        margin: '0 auto',
+        padding: 'var(--space-8, 2rem) var(--space-4, 1rem)',
+        color: 'var(--fg, #111)',
+      }}
+    >
+      <header style=\{{ marginBottom: '1.5rem' }}>
+        <h1 style=\{{ fontSize: '1.875rem', fontWeight: 700, margin: 0 }}>Security</h1>
+        <p style=\{{ color: 'var(--fg-muted, #666)', marginTop: '0.25rem' }}>
+          Manage two-factor authentication for your {{businessName}} account.
+        </p>
+      </header>
+      <MfaManager />
+    </main>
+  );
+}

package/templates/saas/app/account/security/page.tsx.hbs

@@ -0,0 +1,32 @@
+'use client';
+
+import { MfaManager } from '@githat/nextjs';
+
+/**
+ * /account/security — TOTP 2FA management for {{businessName}}.
+ *
+ * The <MfaManager/> component reads the current user's mfaEnabled flag
+ * and renders either an "Enable 2FA" CTA or the disable / regenerate-
+ * recovery-codes controls. All flows are gated behind the GitHat API
+ * (api.githat.io) — no integration code lives in this scaffold.
+ */
+export default function SecurityPage() {
+  return (
+    <main
+      style=\{{
+        maxWidth: '640px',
+        margin: '0 auto',
+        padding: 'var(--space-8, 2rem) var(--space-4, 1rem)',
+        color: 'var(--fg, #111)',
+      }}
+    >
+      <header style=\{{ marginBottom: '1.5rem' }}>
+        <h1 style=\{{ fontSize: '1.875rem', fontWeight: 700, margin: 0 }}>Security</h1>
+        <p style=\{{ color: 'var(--fg-muted, #666)', marginTop: '0.25rem' }}>
+          Manage two-factor authentication for your {{businessName}} account.
+        </p>
+      </header>
+      <MfaManager />
+    </main>
+  );
+}

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

@@ -49,9 +49,10 @@ export default function AdminPage() {
           gridTemplateColumns: 'repeat(auto-fit, minmax(220px, 1fr))',
           gap: 'var(--space-3)',
         }}>
-          <AdminLink href="/admin/team"     title="Team"     hint="Invite members, set roles" />
-          <AdminLink href="/admin/billing"  title="Billing"  hint="Subscription, invoices, payment method" />
-          <AdminLink href="/admin/settings" title="Settings" hint="Org name, custom domain, branding" />
+          <AdminLink href="/admin/team"      title="Team"     hint="Invite members, set roles" />
+          <AdminLink href="/admin/billing"   title="Billing"  hint="Subscription, invoices, payment method" />
+          <AdminLink href="/admin/settings"  title="Settings" hint="Org name, custom domain, branding" />
+          <AdminLink href="/account/security" title="Security" hint="Two-factor auth, recovery codes" />
         </nav>
       </div>
     </div>