create-mikstack 0.1.24 → 0.1.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-mikstack",
-  "version": "0.1.24",
+  "version": "0.1.25",
   "license": "MIT",
   "repository": {
     "type": "git",

package/templates/base/AGENTS.md

@@ -8,10 +8,14 @@ SvelteKit app with Drizzle ORM, Zero (real-time sync), and better-auth.
 - **Database**: PostgreSQL via Drizzle ORM
 - **Real-time**: Zero (@rocicorp/zero) for client-side sync
 - **Auth**: better-auth with magic link
-- **Styling**: See `src/app.css`
+- **UI**: @mikstack/ui components (Button, Input, FormField, Textarea, Separator)
+- **Styling**: Design tokens in `src/app.css` — oklch colors, spacing/radius variables, dark mode via `prefers-color-scheme`
 <!-- {{#if:i18n}} -->
 - **i18n**: @mikstack/svelte-lingui (Lingui-based)
 <!-- {{/if:i18n}} -->
+<!-- {{#if:testing}} -->
+- **Testing**: Vitest + @testcontainers/postgresql for integration tests
+<!-- {{/if:testing}} -->
 
 ## Key Patterns
 
@@ -28,11 +32,19 @@ const data = $derived(query.data);
 await z.mutate(mutators.myMutation(args));
 ```
 
+Mutators verify ownership before update/delete via `tx.run()`:
+
+```typescript
+const entity = await tx.run(zql.note.where("id", args.id).one());
+if (!entity || entity.userId !== ctx.userID) return;
+```
+
 ### Auth
 
 Server: `src/lib/server/auth.ts` (better-auth config)
 Client: `src/lib/auth-client.ts` (magic link + client helpers)
 Session is available in `locals.user` and `locals.session` via `src/hooks.server.ts`.
+Routes under `(app)/` require authentication — unauthenticated requests redirect to `/sign-in`.
 
 ### Forms (@mikstack/form)
 
@@ -85,9 +97,23 @@ Email delivery tracking and retries are handled automatically.
 
 ### Database
 
-Schema: `src/lib/server/db/schema.ts`
+Schema: `src/lib/server/db/schema.ts` (uses `casing: "snake_case"` — no explicit column names needed)
 Connection: `src/lib/server/db/index.ts` (lazy-initialized via Proxy)
 
+<!-- {{#if:testing}} -->
+### Testing
+
+Test utils: `src/lib/server/db/test-utils.ts` — `createTestDatabase()` spins up a PostgreSQL container via @testcontainers/postgresql.
+
+```typescript
+import { createTestDatabase, stopTestDatabase, type TestDatabase } from "$lib/server/db/test-utils";
+
+let testDb: TestDatabase;
+beforeAll(async () => { testDb = await createTestDatabase(); });
+afterAll(async () => { await stopTestDatabase(testDb); });
+```
+
+<!-- {{/if:testing}} -->
 <!-- {{#if:i18n}} -->
 ### i18n
 
@@ -95,7 +121,7 @@ Setup: `src/lib/i18n.ts` — initialized in root layout
 Config: `lingui.config.ts`
 Catalogs: `src/locales/{locale}.po`
 
-Use `useLingui()` for translations, `<T>` component for rich text:
+Use `useLingui()` for translations in Svelte components:
 
 ```svelte
 <script lang="ts">
@@ -106,9 +132,23 @@ Use `useLingui()` for translations, `<T>` component for rich text:
 <h1>{t`Hello world`}</h1>
 ```
 
+Use `<T>` component for rich text with embedded elements:
+
+```svelte
+<T>Read the <a href="/docs">documentation</a></T>
+```
+
+The extractor and Svelte preprocessor handle the transformation automatically.
+
 Run `{{pmRun}} i18n:extract` to extract messages into `.po` catalogs.
 <!-- {{/if:i18n}} -->
 
+### Deployment
+
+- `Dockerfile` — multi-stage build for the Node adapter
+- `docker-compose.yml` — local dev (PostgreSQL + zero-cache)
+- `docker-compose.prod.yml` — production (PostgreSQL + zero-cache + app)
+
 ## Commands
 
 - `{{pmRun}} dev` — start dev server
@@ -121,3 +161,6 @@ Run `{{pmRun}} i18n:extract` to extract messages into `.po` catalogs.
 <!-- {{#if:i18n}} -->
 - `{{pmRun}} i18n:extract` — extract messages to .po catalogs
 <!-- {{/if:i18n}} -->
+<!-- {{#if:testing}} -->
+- `{{pmRun}} test` — run tests (requires Docker for testcontainers)
+<!-- {{/if:testing}} -->

package/templates/base/src/lib/server/auth.ts

@@ -24,7 +24,12 @@ function createAuth() {
           await notif.send({
             type: "magic-link",
             recipientEmail: email,
+            // {{#if:i18n}}
+            data: { url, locale: getRequestEvent().cookies.get("locale") },
+            // {{/if:i18n}}
+            // {{#if:!i18n}}
             data: { url },
+            // {{/if:!i18n}}
           });
         },
       }),

package/templates/base/src/lib/zero/mutators.ts

@@ -1,5 +1,6 @@
 import { defineMutators, defineMutator } from "@rocicorp/zero";
 import * as v from "valibot";
+import { zql } from "./schema";
 
 export const mutators = defineMutators({
   note: {
@@ -19,7 +20,9 @@ export const mutators = defineMutators({
     ),
     update: defineMutator(
       v.object({ id: v.string(), title: v.string(), content: v.string() }),
-      async ({ tx, args }) => {
+      async ({ tx, ctx, args }) => {
+        const note = await tx.run(zql.note.where("id", args.id).one());
+        if (!note || note.userId !== ctx.userID) return;
         await tx.mutate.note.update({
           id: args.id,
           title: args.title,
@@ -28,7 +31,9 @@ export const mutators = defineMutators({
         });
       },
     ),
-    delete: defineMutator(v.object({ id: v.string() }), async ({ tx, args }) => {
+    delete: defineMutator(v.object({ id: v.string() }), async ({ tx, ctx, args }) => {
+      const note = await tx.run(zql.note.where("id", args.id).one());
+      if (!note || note.userId !== ctx.userID) return;
       await tx.mutate.note.delete({ id: args.id });
     }),
   },

package/templates/i18n/lingui.config.ts

@@ -11,6 +11,10 @@ const config: LinguiConfig = {
     },
   ],
   extractors: [extractor],
+  format: "po",
+  formatOptions: {
+    lineNumbers: false,
+  },
 };
 
 export default config;

package/templates/i18n/src/lib/LocaleSwitcher.svelte

@@ -5,6 +5,7 @@
 
   function switchLocale(locale: string) {
     setLocale(locale);
+    document.cookie = `locale=${locale};path=/;max-age=31536000;samesite=lax`;
     currentLocale = locale;
   }
 </script>

package/templates/i18n/src/lib/i18n.ts

@@ -1,4 +1,4 @@
-import { setupI18n } from "@lingui/core";
+import { setupI18n, type I18n } from "@lingui/core";
 import { setI18n } from "@mikstack/svelte-lingui";
 import { messages as enMessages } from "../locales/en.po";
 import { messages as fiMessages } from "../locales/fi.po";
@@ -27,3 +27,16 @@ export function getLocale(): string {
 }
 
 export const locales = Object.keys(allMessages);
+
+/**
+ * Create a standalone i18n instance for server-side use (e.g. emails).
+ * Each call returns a fresh instance — safe for concurrent requests.
+ */
+export function createServerI18n(locale = "en"): I18n {
+  const serverI18n = setupI18n();
+  serverI18n.loadAndActivate({
+    locale,
+    messages: allMessages[locale] ?? allMessages["en"],
+  });
+  return serverI18n;
+}

package/templates/i18n/src/lib/server/emails/magic-link.ts

@@ -0,0 +1,67 @@
+import { html, body, section, text, button, render } from "@mikstack/email";
+import { msg } from "@mikstack/svelte-lingui";
+import { createServerI18n } from "$lib/i18n";
+
+export function magicLinkEmail(url: string, locale = "en") {
+  const i18n = createServerI18n(locale);
+  const _ = (d: { id: string; message: string }) => i18n._(d) as string;
+
+  const email = html(
+    body(
+      [
+        section(
+          [
+            text(_(msg`Sign in to {{projectName}}`), {
+              fontSize: 24,
+              fontWeight: "bold",
+              color: "#111827",
+              marginBottom: 40,
+              marginTop: 40,
+            }),
+            button(_(msg`Sign in`), {
+              href: url,
+              backgroundColor: "#111827",
+              color: "#ffffff",
+              fontSize: 14,
+              fontWeight: "bold",
+              padding: [12, 34],
+              borderRadius: 6,
+              marginBottom: 16,
+            }),
+            text(_(msg`Or, copy and paste this temporary login URL:`), {
+              fontSize: 14,
+              lineHeight: 1.7,
+              color: "#111827",
+              marginTop: 24,
+              marginBottom: 14,
+            }),
+            text(url, {
+              fontSize: 13,
+              color: "#111827",
+              backgroundColor: "#f4f4f4",
+              borderRadius: 6,
+              padding: [16, 24],
+              border: "1px solid #eee",
+            }),
+            text(_(msg`If you didn't try to sign in, you can safely ignore this email.`), {
+              fontSize: 14,
+              lineHeight: 1.7,
+              color: "#ababab",
+              marginTop: 14,
+              marginBottom: 38,
+            }),
+          ],
+          { padding: [0, 24] },
+        ),
+      ],
+      { maxWidth: 480, backgroundColor: "#ffffff" },
+    ),
+    { lang: locale },
+  );
+
+  return {
+    subject: _(msg`Sign in to {{projectName}}`),
+    html: render(email),
+    text: render(email, { plainText: true }),
+  };
+}

package/templates/i18n/src/lib/server/notifications/definitions.ts

@@ -0,0 +1,12 @@
+import { defineNotification } from "@mikstack/notifications";
+import { magicLinkEmail } from "../emails/magic-link";
+
+export const notifications = {
+  "magic-link": defineNotification({
+    key: "magic-link",
+    critical: true, // Auth emails bypass user preferences
+    channels: {
+      email: (data: { url: string; locale?: string }) => magicLinkEmail(data.url, data.locale),
+    },
+  }),
+} as const;

package/templates/i18n/src/locales/en.po

@@ -1,98 +1,87 @@
 msgid ""
 msgstr ""
+"Project-Id-Version: {{projectName}}\n"
 "Language: en\n"
+"Language-Team: English, United States\n"
+"Plural-Forms: nplurals=2; plural=(n != 1);\n"
 "MIME-Version: 1.0\n"
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 
-#: src/routes/(app)/+page.svelte
 msgid "Cancel"
 msgstr "Cancel"
 
-#: src/routes/(public)/sign-in/+page.svelte
 msgid "Check your email for a magic link to sign in."
 msgstr "Check your email for a magic link to sign in."
 
-#: src/routes/(app)/+page.svelte
 msgid "Content"
 msgstr "Content"
 
-#: src/routes/(app)/+page.svelte
 msgid "Create note"
 msgstr "Create note"
 
-#: src/routes/(app)/+page.svelte
 msgid "Creating..."
 msgstr "Creating..."
 
-#: src/routes/(app)/+page.svelte
 msgid "Delete"
 msgstr "Delete"
 
-#: src/routes/(app)/+page.svelte
 msgid "Edit"
 msgstr "Edit"
 
-#: src/routes/(public)/sign-in/+page.svelte
+msgid "If you didn't try to sign in, you can safely ignore this email."
+msgstr "If you didn't try to sign in, you can safely ignore this email."
+
 msgid "Email"
 msgstr "Email"
 
-#: src/routes/(app)/+page.svelte
 msgid "New note"
 msgstr "New note"
 
-#: src/routes/(app)/+page.svelte
 msgid "No notes yet. Create one above!"
 msgstr "No notes yet. Create one above!"
 
-#: src/routes/(app)/+page.svelte
 msgid "Note title"
 msgstr "Note title"
 
-#: src/routes/(app)/+page.svelte
 msgid "Notes"
 msgstr "Notes"
 
-#: src/routes/(public)/sign-in/+page.svelte
+msgid "Or, copy and paste this temporary login URL:"
+msgstr "Or, copy and paste this temporary login URL:"
+
 msgid "Please enter a valid email address"
 msgstr "Please enter a valid email address"
 
-#: src/routes/(app)/+page.svelte
 msgid "Save"
 msgstr "Save"
 
-#: src/routes/(app)/+page.svelte
 msgid "Saving..."
 msgstr "Saving..."
 
-#: src/routes/(public)/sign-in/+page.svelte
 msgid "Sending magic link..."
 msgstr "Sending magic link..."
 
-#: src/routes/(app)/+page.svelte
-msgid "Sign out"
-msgstr "Sign out"
+msgid "Sign in"
+msgstr "Sign in"
 
-#: src/routes/(public)/sign-in/+page.svelte
 msgid "Sign in to {{projectName}}"
 msgstr "Sign in to {{projectName}}"
 
-#: src/routes/(public)/sign-in/+page.svelte
 msgid "Sign in with magic link"
 msgstr "Sign in with magic link"
 
-#: src/routes/(app)/+page.svelte
+msgid "Sign out"
+msgstr "Sign out"
+
 msgid "Title"
 msgstr "Title"
 
-#: src/routes/(app)/+page.svelte
 msgid "Title is required"
 msgstr "Title is required"
 
-#: src/routes/(app)/+page.svelte
 msgid "Write something..."
 msgstr "Write something..."
 
-#: src/routes/(app)/+page.svelte
 msgid "Your notes"
 msgstr "Your notes"

package/templates/i18n/src/locales/fi.po

@@ -1,98 +1,87 @@
 msgid ""
 msgstr ""
+"Project-Id-Version: {{projectName}}\n"
 "Language: fi\n"
+"Language-Team: Finnish\n"
+"Plural-Forms: nplurals=2; plural=(n != 1);\n"
 "MIME-Version: 1.0\n"
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 
-#: src/routes/(app)/+page.svelte
 msgid "Cancel"
 msgstr "Peruuta"
 
-#: src/routes/(public)/sign-in/+page.svelte
 msgid "Check your email for a magic link to sign in."
 msgstr "Tarkista sähköpostisi kirjautumislinkin varalta."
 
-#: src/routes/(app)/+page.svelte
 msgid "Content"
 msgstr "Sisältö"
 
-#: src/routes/(app)/+page.svelte
 msgid "Create note"
 msgstr "Luo muistiinpano"
 
-#: src/routes/(app)/+page.svelte
 msgid "Creating..."
 msgstr "Luodaan..."
 
-#: src/routes/(app)/+page.svelte
 msgid "Delete"
 msgstr "Poista"
 
-#: src/routes/(app)/+page.svelte
 msgid "Edit"
 msgstr "Muokkaa"
 
-#: src/routes/(public)/sign-in/+page.svelte
+msgid "If you didn't try to sign in, you can safely ignore this email."
+msgstr "Jos et yrittänyt kirjautua, voit jättää tämän sähköpostin huomiotta."
+
 msgid "Email"
 msgstr "Sähköposti"
 
-#: src/routes/(app)/+page.svelte
 msgid "New note"
 msgstr "Uusi muistiinpano"
 
-#: src/routes/(app)/+page.svelte
 msgid "No notes yet. Create one above!"
 msgstr "Ei vielä muistiinpanoja. Luo ensimmäinen yllä!"
 
-#: src/routes/(app)/+page.svelte
 msgid "Note title"
 msgstr "Muistiinpanon otsikko"
 
-#: src/routes/(app)/+page.svelte
 msgid "Notes"
 msgstr "Muistiinpanot"
 
-#: src/routes/(public)/sign-in/+page.svelte
+msgid "Or, copy and paste this temporary login URL:"
+msgstr "Tai kopioi ja liitä tämä väliaikainen kirjautumislinkki:"
+
 msgid "Please enter a valid email address"
 msgstr "Syötä kelvollinen sähköpostiosoite"
 
-#: src/routes/(app)/+page.svelte
 msgid "Save"
 msgstr "Tallenna"
 
-#: src/routes/(app)/+page.svelte
 msgid "Saving..."
 msgstr "Tallennetaan..."
 
-#: src/routes/(public)/sign-in/+page.svelte
 msgid "Sending magic link..."
 msgstr "Lähetetään kirjautumislinkkiä..."
 
-#: src/routes/(app)/+page.svelte
-msgid "Sign out"
-msgstr "Kirjaudu ulos"
+msgid "Sign in"
+msgstr "Kirjaudu"
 
-#: src/routes/(public)/sign-in/+page.svelte
 msgid "Sign in to {{projectName}}"
 msgstr "Kirjaudu palveluun {{projectName}}"
 
-#: src/routes/(public)/sign-in/+page.svelte
 msgid "Sign in with magic link"
 msgstr "Kirjaudu kirjautumislinkillä"
 
-#: src/routes/(app)/+page.svelte
+msgid "Sign out"
+msgstr "Kirjaudu ulos"
+
 msgid "Title"
 msgstr "Otsikko"
 
-#: src/routes/(app)/+page.svelte
 msgid "Title is required"
 msgstr "Otsikko on pakollinen"
 
-#: src/routes/(app)/+page.svelte
 msgid "Write something..."
 msgstr "Kirjoita jotain..."
 
-#: src/routes/(app)/+page.svelte
 msgid "Your notes"
 msgstr "Muistiinpanosi"