npm - create-zerotal - Versions diffs - 1.0.0 → 1.0.2 - Mend

create-zerotal 1.0.0 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (126) hide show

package/CHANGELOG.md +30 -0
package/package.json +1 -1
package/src/prompts.ts +6 -6
package/src/scaffold.ts +9 -3
package/templates/admin/README.md +41 -0
package/templates/admin/_env.example +17 -0
package/templates/admin/app/admin/index.ts +6 -0
package/templates/admin/app/auth/passwords.ts +79 -0
package/templates/admin/config/database.ts +4 -3
package/templates/admin/database/migrations/0001_create_password_reset_tokens_table.ts +26 -0
package/templates/admin/package.json +9 -1
package/templates/admin/tsconfig.json +7 -2
package/templates/api/README.md +39 -0
package/templates/api/_env.example +13 -0
package/templates/api/app/controllers/AuthController.ts +11 -8
package/templates/api/app/controllers/WelcomeController.ts +1 -1
package/templates/api/app/middleware/RequireAuth.ts +1 -1
package/templates/api/app/models/User.ts +2 -2
package/templates/api/bootstrap/app.ts +6 -6
package/templates/api/config/app.ts +1 -1
package/templates/api/config/database.ts +12 -3
package/templates/api/config/notifications.ts +1 -1
package/templates/api/config/queue.ts +1 -1
package/templates/api/config/session.ts +2 -2
package/templates/api/database/migrations/0001_create_users_table.ts +8 -8
package/templates/api/package.json +9 -1
package/templates/api/routes/index.ts +23 -8
package/templates/api/tests/auth.test.ts +6 -3
package/templates/api/tests/helpers.ts +6 -6
package/templates/api/tsconfig.json +7 -3
package/templates/flow/README.md +39 -0
package/templates/flow/_env.example +17 -0
package/templates/flow/app/auth/passwords.ts +79 -0
package/templates/flow/app/flow/layouts/app.tsx +10 -1
package/templates/flow/app/flow/pages/forgot-password.tsx +69 -0
package/templates/flow/app/flow/pages/login.tsx +88 -0
package/templates/flow/app/flow/pages/profile.tsx +194 -0
package/templates/flow/app/flow/pages/register.tsx +120 -0
package/templates/flow/app/flow/pages/reset-password.tsx +103 -0
package/templates/flow/app/flow/ui.ts +27 -0
package/templates/flow/app/models/User.ts +17 -0
package/templates/flow/bootstrap/app.ts +8 -0
package/templates/flow/bootstrap/providers.ts +6 -1
package/templates/flow/config/auth.ts +7 -0
package/templates/flow/config/database.ts +18 -0
package/templates/flow/config/session.ts +14 -0
package/templates/flow/database/migrations/0001_create_users_table.ts +18 -0
package/templates/flow/database/migrations/0002_create_password_reset_tokens_table.ts +23 -0
package/templates/flow/package.json +10 -4
package/templates/flow/tests/smoke.test.ts +21 -1
package/templates/flow/tsconfig.json +10 -3
package/templates/minimal/README.md +39 -0
package/templates/minimal/_env.example +9 -0
package/templates/minimal/bootstrap/app.ts +2 -2
package/templates/minimal/package.json +10 -5
package/templates/minimal/tests/smoke.test.ts +1 -1
package/templates/minimal/tsconfig.json +13 -4
package/templates/react/README.md +40 -0
package/templates/react/_env.example +18 -0
package/templates/react/app/auth/passwords.ts +79 -0
package/templates/react/app/models/User.ts +17 -0
package/templates/react/app/routes/forgot-password.ts +24 -0
package/templates/react/app/routes/login.ts +32 -0
package/templates/react/app/routes/logout.ts +12 -0
package/templates/react/app/routes/profile/password.ts +30 -0
package/templates/react/app/routes/profile.ts +39 -0
package/templates/react/app/routes/register.ts +39 -0
package/templates/react/app/routes/reset-password.ts +37 -0
package/templates/react/bootstrap/app.ts +8 -0
package/templates/react/bootstrap/providers.ts +7 -4
package/templates/react/config/auth.ts +7 -0
package/templates/react/config/database.ts +18 -0
package/templates/react/database/migrations/0001_create_users_table.ts +18 -0
package/templates/react/database/migrations/0002_create_password_reset_tokens_table.ts +23 -0
package/templates/react/package.json +8 -2
package/templates/react/resources/js/Layouts/AppLayout.tsx +12 -2
package/templates/react/resources/js/pages/forgot-password.tsx +65 -0
package/templates/react/resources/js/pages/login.tsx +92 -0
package/templates/react/resources/js/pages/profile.tsx +147 -0
package/templates/react/resources/js/pages/register.tsx +101 -0
package/templates/react/resources/js/pages/reset-password.tsx +80 -0
package/templates/react/resources/js/pages.generated.ts +5 -0
package/templates/react/tests/smoke.test.ts +58 -2
package/templates/react/tsconfig.json +10 -3
package/templates/vue/README.md +40 -0
package/templates/vue/_env.example +18 -0
package/templates/vue/app/auth/passwords.ts +79 -0
package/templates/vue/app/exceptions/Handler.ts +55 -0
package/templates/vue/app/models/User.ts +17 -0
package/templates/vue/app/routes/forgot-password.ts +24 -0
package/templates/vue/app/routes/login.ts +32 -0
package/templates/vue/app/routes/logout.ts +12 -0
package/templates/vue/app/routes/profile/password.ts +30 -0
package/templates/vue/app/routes/profile.ts +39 -0
package/templates/vue/app/routes/register.ts +39 -0
package/templates/vue/app/routes/reset-password.ts +37 -0
package/templates/vue/bootstrap/app.ts +15 -3
package/templates/vue/bootstrap/providers.ts +8 -1
package/templates/vue/config/auth.ts +7 -0
package/templates/vue/config/database.ts +18 -0
package/templates/vue/config/session.ts +11 -0
package/templates/vue/database/migrations/0001_create_users_table.ts +18 -0
package/templates/vue/database/migrations/0002_create_password_reset_tokens_table.ts +23 -0
package/templates/vue/package.json +8 -2
package/templates/vue/public/zt.svg +17 -0
package/templates/vue/resources/app.html +27 -1
package/templates/vue/resources/css/app.css +205 -0
package/templates/vue/resources/js/Components/Button.vue +49 -0
package/templates/vue/resources/js/Components/Card.vue +23 -0
package/templates/vue/resources/js/Components/FlashToasts.vue +81 -0
package/templates/vue/resources/js/Components/Icon.vue +40 -0
package/templates/vue/resources/js/Components/TextField.vue +66 -0
package/templates/vue/resources/js/Components/ThemeToggle.vue +46 -0
package/templates/vue/resources/js/Layouts/AppLayout.vue +140 -25
package/templates/vue/resources/js/lib/cn.ts +13 -0
package/templates/vue/resources/js/lib/site.ts +11 -0
package/templates/vue/resources/js/pages/error.vue +47 -0
package/templates/vue/resources/js/pages/forgot-password.vue +47 -0
package/templates/vue/resources/js/pages/login.vue +67 -0
package/templates/vue/resources/js/pages/profile.vue +119 -0
package/templates/vue/resources/js/pages/register.vue +77 -0
package/templates/vue/resources/js/pages/reset-password.vue +58 -0
package/templates/vue/resources/js/pages.generated.ts +10 -4
package/templates/vue/resources/js/types.ts +17 -0
package/templates/vue/tests/smoke.test.ts +50 -1
package/templates/vue/tsconfig.json +10 -3

package/templates/react/resources/js/pages/register.tsx ADDED Viewed

@@ -0,0 +1,101 @@
+import type { FormEvent, ReactNode } from "react";
+import { Head, Link, useForm, usePage } from "@inertiajs/react";
+import AppLayout from "../Layouts/AppLayout";
+import { Button } from "../Components/Button";
+import { Card } from "../Components/Card";
+import { TextField } from "../Components/Field";
+import type { SharedProps } from "../types";
+interface Props {
+  title: string;
+}
+function Register({ title }: Props) {
+  const { old } = usePage<SharedProps>().props;
+  const { data, setData, post, processing, errors } = useForm({
+    name: typeof old["name"] === "string" ? old["name"] : "",
+    email: typeof old["email"] === "string" ? old["email"] : "",
+    password: "",
+    password_confirmation: "",
+  });
+  function submit(event: FormEvent) {
+    event.preventDefault();
+    post("/register");
+  }
+  return (
+    <>
+      <Head title={title} />
+      <div className="mx-auto max-w-md">
+        <header>
+          <h1 className="text-3xl font-bold tracking-tight text-balance">{title}</h1>
+          <p className="mt-2 text-muted-foreground">It takes about ten seconds.</p>
+        </header>
+        <Card className="mt-8 p-6 sm:p-8">
+          <form onSubmit={submit} className="space-y-5">
+            <TextField
+              label="Name"
+              autoComplete="name"
+              value={data.name}
+              error={errors.name}
+              onChange={(e) => setData("name", e.target.value)}
+              required
+            />
+            <TextField
+              label="Email"
+              type="email"
+              autoComplete="email"
+              value={data.email}
+              error={errors.email}
+              onChange={(e) => setData("email", e.target.value)}
+              required
+            />
+            <TextField
+              label="Password"
+              type="password"
+              autoComplete="new-password"
+              hint="At least 8 characters."
+              value={data.password}
+              error={errors.password}
+              onChange={(e) => setData("password", e.target.value)}
+              required
+            />
+            <TextField
+              label="Confirm password"
+              type="password"
+              autoComplete="new-password"
+              value={data.password_confirmation}
+              error={errors.password_confirmation}
+              onChange={(e) => setData("password_confirmation", e.target.value)}
+              required
+            />
+            <Button type="submit" disabled={processing}>
+              {processing ? "Creating…" : "Create account"}
+            </Button>
+          </form>
+        </Card>
+        <p className="mt-6 text-sm text-muted-foreground">
+          Already registered?{" "}
+          <Link href="/login" className="text-accent hover:underline">
+            Sign in
+          </Link>
+        </p>
+      </div>
+    </>
+  );
+}
+(Register as { layout?: (page: ReactNode) => ReactNode }).layout = (page) => (
+  <AppLayout>{page}</AppLayout>
+);
+export default Register;

package/templates/react/resources/js/pages/reset-password.tsx ADDED Viewed

@@ -0,0 +1,80 @@
+import type { FormEvent, ReactNode } from "react";
+import { Head, useForm } from "@inertiajs/react";
+import AppLayout from "../Layouts/AppLayout";
+import { Button } from "../Components/Button";
+import { Card } from "../Components/Card";
+import { TextField } from "../Components/Field";
+interface Props {
+  title: string;
+  /** Both arrive on the query string of the emailed link. */
+  token: string;
+  email: string;
+}
+function ResetPassword({ title, token, email }: Props) {
+  // Token and email ride along as hidden fields so the POST carries everything
+  // the server needs to verify the link without trusting the session.
+  const { data, setData, post, processing, errors } = useForm({
+    token,
+    email,
+    password: "",
+    password_confirmation: "",
+  });
+  function submit(event: FormEvent) {
+    event.preventDefault();
+    post("/reset-password");
+  }
+  return (
+    <>
+      <Head title={title} />
+      <div className="mx-auto max-w-md">
+        <header>
+          <h1 className="text-3xl font-bold tracking-tight text-balance">{title}</h1>
+          <p className="mt-2 text-muted-foreground">Resetting the password for {email}.</p>
+        </header>
+        <Card className="mt-8 p-6 sm:p-8">
+          <form onSubmit={submit} className="space-y-5">
+            <input type="hidden" value={data.token} />
+            <input type="hidden" value={data.email} />
+            <TextField
+              label="New password"
+              type="password"
+              autoComplete="new-password"
+              hint="At least 8 characters."
+              value={data.password}
+              error={errors.password}
+              onChange={(e) => setData("password", e.target.value)}
+              required
+            />
+            <TextField
+              label="Confirm password"
+              type="password"
+              autoComplete="new-password"
+              value={data.password_confirmation}
+              error={errors.password_confirmation}
+              onChange={(e) => setData("password_confirmation", e.target.value)}
+              required
+            />
+            <Button type="submit" disabled={processing}>
+              {processing ? "Updating…" : "Update password"}
+            </Button>
+          </form>
+        </Card>
+      </div>
+    </>
+  );
+}
+(ResetPassword as { layout?: (page: ReactNode) => ReactNode }).layout = (page) => (
+  <AppLayout>{page}</AppLayout>
+);
+export default ResetPassword;

package/templates/react/resources/js/pages.generated.ts CHANGED Viewed

@@ -9,5 +9,10 @@ export const pages: Record<string, () => Promise<{ default: unknown }>> = {
   about: () => import("./pages/about.tsx"),
   contact: () => import("./pages/contact.tsx"),
   error: () => import("./pages/error.tsx"),
+  "forgot-password": () => import("./pages/forgot-password.tsx"),
   home: () => import("./pages/home.tsx"),
+  login: () => import("./pages/login.tsx"),
+  profile: () => import("./pages/profile.tsx"),
+  register: () => import("./pages/register.tsx"),
+  "reset-password": () => import("./pages/reset-password.tsx"),
 };

package/templates/react/tests/smoke.test.ts CHANGED Viewed

@@ -7,7 +7,7 @@
  * you have real tests, or keep it as the shape to copy.
  */
 import { beforeAll, afterAll, describe, test, expect } from 'bun:test';
-import { createTestApp, type TestApp } from '@zerotal/testing';
+import { createTestApp, type TestApp } from 'zerotal/testing';
 let app: TestApp;
@@ -15,6 +15,8 @@ beforeAll(async () => {
   // Session encryption needs a key. Seed a deterministic one for tests; `??=`
   // leaves a real key alone when the app's .env is present.
   Bun.env.APP_KEY ??= 'test-app-key-aaaaaaaaaaaaaaaaaaaaaaaa';
+  // Each run gets its own throwaway schema rather than the dev database.
+  Bun.env.ZT_DB_URL ??= ':memory:';
   app = await createTestApp(() => import('../bootstrap/app.ts').then((m) => m.default));
 });
@@ -50,7 +52,14 @@ describe('scaffold', () => {
  */
 describe('contact form', () => {
   test('sends the visitor back with errors when the input is bad', async () => {
-    const res = await app.postForm('/contact', { name: 'A', email: 'nope', message: 'short' });
+    // Referer is what a browser sends on a form post, and what the framework
+    // redirects back to when validation fails — without it the redirect
+    // falls back to "/" and the assertion below would be testing nothing.
+    const res = await app.postForm(
+      '/contact',
+      { name: 'A', email: 'nope', message: 'short' },
+      { Referer: `${app.baseUrl}/contact` },
+    );
     res.assertRedirect('/contact');
     res.assertInvalid(['name', 'email', 'message']);
@@ -67,3 +76,50 @@ describe('contact form', () => {
     res.assertValid();
   });
 });
+/**
+ * The auth surface, end to end. Registration is the round trip worth asserting:
+ * a valid post creates the account, signs the visitor in, and lands them on a
+ * page a guest cannot reach — which proves the guard and the session together.
+ */
+describe('auth', () => {
+  test('serves the guest screens', async () => {
+    (await app.get('/login')).assertInertia('login');
+    (await app.get('/register')).assertInertia('register');
+    (await app.get('/forgot-password')).assertInertia('forgot-password');
+  });
+  test('keeps the profile behind a sign-in', async () => {
+    (await app.get('/profile')).assertRedirect('/login');
+  });
+  test('rejects a registration whose confirmation does not match', async () => {
+    const res = await app.postForm(
+      '/register',
+      {
+        name: 'Ada Lovelace',
+        email: 'mismatch@example.com',
+        password: 'correct-horse-battery',
+        password_confirmation: 'something-else',
+      },
+      { Referer: `${app.baseUrl}/register` },
+    );
+    res.assertRedirect('/register');
+    res.assertInvalid(['password']);
+  });
+  test('registers a visitor and signs them in', async () => {
+    const res = await app.postForm('/register', {
+      name: 'Ada Lovelace',
+      email: 'ada@example.com',
+      password: 'correct-horse-battery',
+      password_confirmation: 'correct-horse-battery',
+    });
+    // Landing on /profile is the proof: it is a guarded route, so reaching it
+    // means the account was created *and* the session was established.
+    res.assertRedirect('/profile');
+  });
+});

package/templates/react/tsconfig.json CHANGED Viewed

@@ -13,9 +13,16 @@
     "jsxImportSource": "react",
     "skipLibCheck": true,
     "paths": {
-      "@app/*": ["./app/*"],
-      "@pages/*": ["./resources/js/pages/*"]
+      "@app/*": [
+        "./app/*"
+      ],
+      "@pages/*": [
+        "./resources/js/pages/*"
+      ]
     }
   },
-  "exclude": ["node_modules", ".zerotal"]
+  "exclude": [
+    "node_modules",
+    ".zerotal"
+  ]
 }

package/templates/vue/README.md ADDED Viewed

@@ -0,0 +1,40 @@
+# {{name}}
+An Inertia + Vue single-page app with file-based routes and Tailwind.
+Built with [Zerotal](https://zerotal.dev) — a full-stack TypeScript framework for Bun.
+## Requirements
+- [Bun](https://bun.sh) 1.3.14 or newer. Node.js is not supported: Zerotal uses
+  Bun-native APIs throughout.
+## Getting started
+```bash
+bun install
+bun run dev
+```
+The dev server prints a local URL and a network one, so you can open the app on
+another device on the same Wi-Fi.
+## Scripts
+| Command | What it does |
+| --- | --- |
+| `bun run dev` | Start the dev server with hot reload |
+| `bun run start` | Start the server without dev tooling |
+| `bun run test` | Run the test suite |
+| `bun run typecheck` | Type-check without emitting |
+| `bun run build` | Build the frontend bundle for production |
+## Configuration
+Environment variables live in `.env`, documented in `.env.example`. `APP_KEY`
+was generated for this project when it was scaffolded — keep it out of version
+control, and use a different one per environment.
+## Documentation
+Full documentation is at [zerotal.dev/docs](https://zerotal.dev/docs).

package/templates/vue/_env.example CHANGED Viewed

@@ -1,4 +1,22 @@
+# The runtime environment. "production" turns on the framework's stricter
+# config checks and turns off verbose error output.
 APP_ENV=development
+# Signs sessions, cookies and encrypted values. Generated per project — never
+# reuse one between environments, and never commit a real key.
 APP_KEY={{app_key}}
+# Canonical base URL. Used for absolute links, and to recognise your own origin
+# when the app runs behind a reverse proxy.
 APP_URL=http://localhost:3000
+# Bump to bust cached frontend assets after a deploy.
 ASSET_VERSION=1
+# Where the user table lives. Must match the driver in config/database.ts.
+#
+# Left commented on purpose. config/database.ts already points at this file, and
+# `bun zt test` treats a set DATABASE_URL as the test database too — so setting
+# it here would have the suite mutate your development data instead of running
+# against a throwaway :memory: schema. Uncomment only to point somewhere else.
+# DATABASE_URL=./database/db.sqlite

package/templates/vue/app/auth/passwords.ts ADDED Viewed

@@ -0,0 +1,79 @@
+import { PasswordBroker, Hash } from "zerotal/auth";
+import { DB } from "zerotal/orm";
+import { Log } from "zerotal/logger";
+import { User } from "@app/models/User";
+/**
+ * Password-reset broker for the forgot/reset pages.
+ *
+ * The broker owns the security-sensitive half — generating the token, hashing
+ * it before storage, expiring it, and comparing candidates in constant time.
+ * Everything below is the part only this app can answer: where tokens live, how
+ * a message reaches the user, and what "set the password" means for our model.
+ */
+const broker = new PasswordBroker({
+  expireMinutes: 60,
+  async findToken(email) {
+    const row = await DB.table("password_reset_tokens").where("email", email).first();
+    if (!row) return null;
+    return {
+      token: String((row as Record<string, unknown>)["token"]),
+      createdAt: new Date(String((row as Record<string, unknown>)["created_at"])),
+    };
+  },
+  async storeToken(email, hash) {
+    // One live token per address: a second request invalidates the first rather
+    // than leaving two working links in someone's inbox.
+    await DB.table("password_reset_tokens").where("email", email).delete();
+    await DB.table("password_reset_tokens").insert({
+      email,
+      token: hash,
+      created_at: new Date().toISOString(),
+    });
+  },
+  async deleteToken(email) {
+    await DB.table("password_reset_tokens").where("email", email).delete();
+  },
+  async pruneTokens(cutoff) {
+    await DB.table("password_reset_tokens").where("created_at", "<", cutoff.toISOString()).delete();
+  },
+  async sendResetLink(email, token) {
+    const url = `${process.env["APP_URL"] ?? "http://localhost:3000"}/reset-password?token=${token}&email=${encodeURIComponent(email)}`;
+    // Logged rather than emailed, so a freshly scaffolded app has a working
+    // reset flow before any mail server exists. To send it for real, add
+    // `@zerotal/notifications` and swap this line for a Mail send — the token
+    // is the only thing this callback needs to deliver.
+    Log.info(`[password reset] ${email} → ${url}`);
+  },
+  async resetPassword(email, newPassword) {
+    const user = await User.query().where("email", email).first();
+    if (!user) return;
+    user.password = await Hash.make(newPassword);
+    await user.save();
+  },
+});
+/**
+ * Adapter matching the panel's `passwordReset` contract, which wants booleans
+ * rather than the broker's result strings.
+ */
+export const passwordReset = {
+  async sendResetLink(email: string): Promise<boolean> {
+    // Always reports success. Answering "no such account" here would turn the
+    // forgot-password form into a way to test which addresses are registered.
+    await broker.sendResetLink(email);
+    return true;
+  },
+  async reset(input: { email: string; token: string; password: string }): Promise<boolean> {
+    const result = await broker.reset(input.token, input.email, input.password);
+    return result === "passwords.reset";
+  },
+};

package/templates/vue/app/exceptions/Handler.ts ADDED Viewed

@@ -0,0 +1,55 @@
+import {
+  ExceptionHandler,
+  ZerotalError,
+  devSurfacesEnabled,
+  type HttpContext,
+} from "zerotal";
+import { inertia } from "@zerotal/inertia";
+/**
+ * Renders HTTP errors as a page inside the app's own shell.
+ *
+ * Registered in bootstrap/app.ts. Without it, a mistyped URL lands on the
+ * framework's plain error page — correct, but jarring after the rest of the app.
+ * This hands the status to resources/js/pages/error.tsx instead.
+ *
+ * Three cases deliberately fall through to `super.render()`:
+ *
+ *   - **A 5xx in development.** The framework's stack-trace page is far more
+ *     useful than a tidy "something broke", so it keeps priority while dev
+ *     surfaces are on. Client errors (404, 403, …) always render the app's page,
+ *     including in development — otherwise you could never see your own.
+ *   - **Inertia XHR.** A client-side visit expects the adapter's own error
+ *     handling; substituting a page object here would break it.
+ *   - **API clients.** Anything asking for JSON keeps getting JSON.
+ */
+/** Statuses this app renders as a page; everything else uses the default. */
+const RENDERED = new Set([403, 404, 419, 429, 500, 503]);
+function statusOf(error: unknown): number {
+  return error instanceof ZerotalError ? error.status : 500;
+}
+export class Handler extends ExceptionHandler {
+  override async render(error: unknown, ctx: HttpContext): Promise<Response> {
+    const status = statusOf(error);
+    const wantsHtml = (ctx.request.headers.get("Accept") ?? "").includes("text/html");
+    const isInertiaVisit = ctx.request.headers.get("X-Inertia") === "true";
+    if (isInertiaVisit || !wantsHtml || !RENDERED.has(status)) {
+      return super.render(error, ctx);
+    }
+    if (status >= 500 && devSurfacesEnabled()) {
+      return super.render(error, ctx);
+    }
+    // `inertia()` writes the HTML onto the context rather than returning it, so
+    // re-wrap the body to carry the real status instead of a 200.
+    await inertia("error", { status });
+    const rendered = ctx.response;
+    if (!rendered) return super.render(error, ctx);
+    return new Response(rendered.body, { status, headers: rendered.headers });
+  }
+}

package/templates/vue/app/models/User.ts ADDED Viewed

@@ -0,0 +1,17 @@
+import { BaseModel, column, table } from "zerotal/orm";
+@table("users")
+export class User extends BaseModel {
+  // Models guard every attribute by default. Only these may be mass-assigned
+  // from a request body — `role` is deliberately absent, so no amount of extra
+  // fields in a form post can promote the account that submitted it.
+  static override fillable = ["name", "email", "password"];
+  // Never serialised into a rendered page or a JSON response.
+  static override hidden = ["password"];
+  @column({ type: "string" }) name!: string;
+  @column({ type: "string" }) email!: string;
+  @column({ type: "string" }) password!: string;
+  @column({ type: "string", nullable: true, default: "user" }) role?: string;
+}

package/templates/vue/app/routes/forgot-password.ts ADDED Viewed

@@ -0,0 +1,24 @@
+import type { HttpContext } from "zerotal";
+import { Inertia } from "@zerotal/inertia";
+import { GuestMiddleware } from "zerotal/auth";
+import { validate } from "zerotal/validator";
+import { passwordReset } from "@app/auth/passwords";
+export const middleware = [GuestMiddleware];
+export const GET = async () => {
+  return Inertia.render("forgot-password", { title: "Reset your password" });
+};
+export async function POST(http: HttpContext): Promise<void> {
+  const { email } = await validate(http, (r) => ({
+    email: r.string().trim().email(),
+  }));
+  await passwordReset.sendResetLink(email);
+  // The same answer whether or not that address has an account — reporting "no
+  // such user" would make this form a way to enumerate registered addresses.
+  http.flash("success", "If that address has an account, a reset link is on its way.");
+  http.redirect("/forgot-password", 303);
+}

package/templates/vue/app/routes/login.ts ADDED Viewed

@@ -0,0 +1,32 @@
+import type { HttpContext } from "zerotal";
+import { Inertia } from "@zerotal/inertia";
+import { Auth, GuestMiddleware } from "zerotal/auth";
+import { validate } from "zerotal/validator";
+// Signed-in visitors are sent away from the sign-in form rather than shown it.
+export const middleware = [GuestMiddleware];
+export const GET = async () => {
+  return Inertia.render("login", { title: "Sign in" });
+};
+export async function POST(http: HttpContext): Promise<void> {
+  const { email, password, remember } = await validate(http, (r) => ({
+    email: r.string().trim().email(),
+    password: r.string().min(1),
+    remember: r.boolean().optional(),
+  }));
+  const ok = await Auth.attempt({ email, password }, Boolean(remember));
+  if (!ok) {
+    // One message for a wrong address and a wrong password alike. Saying which
+    // was wrong would turn this form into a way to discover valid accounts.
+    http.flash("error", "Those credentials do not match our records.");
+    http.redirect("/login", 303);
+    return;
+  }
+  http.flash("success", "Welcome back.");
+  http.redirect("/profile", 303);
+}

package/templates/vue/app/routes/logout.ts ADDED Viewed

@@ -0,0 +1,12 @@
+import type { HttpContext } from "zerotal";
+import { Auth, AuthMiddleware } from "zerotal/auth";
+export const middleware = [AuthMiddleware];
+// POST rather than GET: a link that signs you out can be triggered by any page
+// that manages to make your browser fetch it.
+export async function POST(http: HttpContext): Promise<void> {
+  await Auth.logout();
+  http.flash("success", "Signed out.");
+  http.redirect("/login", 303);
+}

package/templates/vue/app/routes/profile/password.ts ADDED Viewed

@@ -0,0 +1,30 @@
+import type { HttpContext } from "zerotal";
+import { Auth, AuthMiddleware, Hash } from "zerotal/auth";
+import { validate } from "zerotal/validator";
+import { User } from "@app/models/User";
+export const middleware = [AuthMiddleware];
+// POST /profile/password
+export async function POST(http: HttpContext): Promise<void> {
+  const user = Auth.user() as User;
+  const { current_password, password } = await validate(http, (r) => ({
+    current_password: r.string().min(1),
+    password: r.string().min(8).confirmed(),
+  }));
+  // Proving the current password is what stops a borrowed session from locking
+  // the real owner out of their own account.
+  if (!(await Hash.check(current_password, user.password))) {
+    http.flash("error", "Your current password is not correct.");
+    http.redirect("/profile", 303);
+    return;
+  }
+  user.password = await Hash.make(password);
+  await user.save();
+  http.flash("success", "Password updated.");
+  http.redirect("/profile", 303);
+}

package/templates/vue/app/routes/profile.ts ADDED Viewed

@@ -0,0 +1,39 @@
+import type { HttpContext } from "zerotal";
+import { Inertia } from "@zerotal/inertia";
+import { Auth, AuthMiddleware } from "zerotal/auth";
+import { validate } from "zerotal/validator";
+import { User } from "@app/models/User";
+// Only for signed-in visitors; everyone else is redirected to sign in.
+export const middleware = [AuthMiddleware];
+export const GET = async () => {
+  return Inertia.render("profile", { title: "Your profile" });
+};
+// Updates name and email. Changing the password is its own route, so a failure
+// in one form never discards what was typed in the other.
+export async function POST(http: HttpContext): Promise<void> {
+  const user = Auth.user() as User;
+  const { name, email } = await validate(http, (r) => ({
+    name: r.string().trim().min(2).max(80),
+    email: r.string().trim().email(),
+  }));
+  // Someone else holding this address is the only conflict — keeping your own
+  // is not a change at all.
+  const taken = await User.query().where("email", email).first();
+  if (taken && taken.id !== user.id) {
+    http.flash("error", "That email is already in use.");
+    http.redirect("/profile", 303);
+    return;
+  }
+  user.name = name;
+  user.email = email;
+  await user.save();
+  http.flash("success", "Details saved.");
+  http.redirect("/profile", 303);
+}