@inglorious/create-app 1.7.1 → 1.8.0

package/bin/lib/questions.js

@@ -27,6 +27,8 @@ export async function askAppFeatures(flags) {
     transitions: false,
     icons: [],
     languages: [],
+    analytics: false,
+    push: false,
     pwa: false,
   }
 
@@ -115,19 +117,42 @@ export async function askAppFeatures(flags) {
     if (canceled || !features.languages) return null
   }
 
-  features.pwa =
-    flags.pwa ??
+  features.analytics =
+    flags.analytics ??
+    (await ask({
+      type: "confirm",
+      message: "Add analytics with a consent prompt? (Firebase)",
+      initial: false,
+    }))
+  if (canceled) return null
+
+  features.push =
+    flags.push ??
     (await ask({
       type: "confirm",
-      message: "Enable PWA support?",
+      message:
+        "Add push notifications? (Firebase and Supabase, turns on PWA support)",
       initial: false,
     }))
   if (canceled) return null
 
+  if (features.push && flags.pwa === false) {
+    throw new Error("--push needs the service worker that --no-pwa turns off.")
+  }
+
+  features.pwa =
+    features.push ||
+    (flags.pwa ??
+      (await ask({
+        type: "confirm",
+        message: "Enable PWA support?",
+        initial: false,
+      })))
+  if (canceled) return null
+
   return validate(features)
 }
 
-// The languages, with the default first.
 async function askLanguages(ask, isCanceled) {
   const languages = await ask({
     type: "multiselect",
@@ -157,7 +182,6 @@ async function askLanguages(ask, isCanceled) {
   return [defaultLanguage, ...languages.filter((l) => l !== defaultLanguage)]
 }
 
-// Flags can name things that do not exist, or combine what cannot go together.
 function validate(features) {
   if (!THEMES[features.theme]) {
     throw new Error(
@@ -176,8 +200,6 @@ function validate(features) {
       `Unknown languages: ${unknownLanguages.join(", ")}. Choose from: ${Object.keys(LANGUAGES).join(", ")}.`,
     )
   }
-  // Transitions animate navigations, with Inglorious UI's stylesheet; icons
-  // are drawn by its Icon component.
   if (!features.routing || !features.ui) features.transitions = false
   if (!features.ui) features.icons = []
   return features

package/bin/lib/skills.js

@@ -5,9 +5,16 @@ const SKILLS_REPOSITORY = "IngloriousCoderz/forge-skills"
 /**
  * The agent skills for the packages a new project uses.
  *
- * @param {{ baseTemplate: string, renderer: string, ui: boolean, languages: string[] }} project
+ * @param {{ baseTemplate: string, renderer: string, ui: boolean, languages: string[], analytics: boolean, push: boolean }} project
  */
-export function skillsFor({ baseTemplate, renderer, ui, languages }) {
+export function skillsFor({
+  baseTemplate,
+  renderer,
+  ui,
+  languages,
+  analytics,
+  push,
+}) {
   const skills = [
     "forge",
     "forge-best-practices",
@@ -20,6 +27,8 @@ export function skillsFor({ baseTemplate, renderer, ui, languages }) {
   if (renderer === "vue") skills.push("vite-plugin-vue")
   if (ui) skills.push("ui", "ui-best-practices")
   if (languages.length) skills.push("i18n")
+  if (analytics || push) skills.push("firebase")
+  if (push) skills.push("supabase")
   return skills
 }
 

package/bin/lib/source.js

@@ -1,9 +1,5 @@
-// What the generated app's components share, whatever their syntax: the pages,
-// the icons they show, and helpers that print code the way Prettier would.
-
 import { ICON_PACKS } from "./features.js"
 
-// Prettier's line width, which generated files are written to fit.
 export const LINE_WIDTH = 80
 
 /**
@@ -29,8 +25,6 @@ export function appModel(app) {
   }
 }
 
-// `name(args)` on one line when it fits, one argument per line otherwise, as
-// Prettier prints a call.
 export function call(name, args, indent, trailing) {
   const line = `${indent}${name}(${args.join(", ")})${trailing}`
   if (line.length <= LINE_WIDTH) return line
@@ -39,16 +33,15 @@ ${args.map((arg) => `${indent}  ${arg},`).join("\n")}
 ${indent})${trailing}`
 }
 
-// `export type Name = A | B`, broken after the `=` when too long, as Prettier
-// prints it.
 export function union(name, members) {
   const line = `export type ${name} = ${members.join(" | ")}`
   if (line.length <= LINE_WIDTH) return line
-  return `export type ${name} =
-  ${members.join(" | ")}`
+  const secondLine = `  ${members.join(" | ")}`
+  if (secondLine.length <= LINE_WIDTH)
+    return `export type ${name} =\n${secondLine}`
+  return `export type ${name} =\n${members.map((member) => `  | ${member}`).join("\n")}`
 }
 
-// Indents every non-empty line of a block.
 export function indent(block, spaces) {
   const pad = " ".repeat(spaces)
   return block

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inglorious/create-app",
-  "version": "1.7.1",
+  "version": "1.8.0",
   "description": "A scaffolding tool to quickly create a new app with Inglorious Web.",
   "author": "Matteo Antony Mistretta <antony.mistretta@gmail.com> (https://ingloriouscoderz.it)",
   "license": "MIT",

package/templates/features/analytics/scripts/analytics-off-native.mjs

@@ -0,0 +1,31 @@
+// Runs after every `cap sync`: `cap add` creates the native projects, and they
+// must start with Analytics off, or they measure from launch, before anyone
+// agreed. createAnalytics turns it on once the user says yes.
+
+import { existsSync, readFileSync, writeFileSync } from "node:fs"
+
+insertBefore(
+  "android/app/src/main/AndroidManifest.xml",
+  "</application>",
+  `    <meta-data android:name="firebase_analytics_collection_enabled" android:value="false" />
+        <meta-data android:name="google_analytics_adid_collection_enabled" android:value="false" />
+    `,
+)
+
+insertBefore(
+  "ios/App/App/Info.plist",
+  "</dict>\n</plist>",
+  `	<key>FIREBASE_ANALYTICS_COLLECTION_ENABLED</key>
+	<false/>
+	<key>GOOGLE_ANALYTICS_IDFV_COLLECTION_ENABLED</key>
+	<false/>
+`,
+)
+
+function insertBefore(file, closing, settings) {
+  if (!existsSync(file)) return
+  const source = readFileSync(file, "utf-8")
+  if (source.includes("ANALYTICS_COLLECTION_ENABLED")) return
+  if (source.includes("firebase_analytics_collection_enabled")) return
+  writeFileSync(file, source.replace(closing, `${settings}${closing}`))
+}

package/templates/features/push/public/sw-push.js

@@ -0,0 +1,23 @@
+self.addEventListener("push", (event) => {
+  const { title, body, url } = event.data.json().data
+  event.waitUntil(
+    self.registration.showNotification(title, {
+      body,
+      icon: "/pwa-192x192.png",
+      data: { url },
+    }),
+  )
+})
+
+self.addEventListener("notificationclick", (event) => {
+  event.notification.close()
+  const url = new URL(event.notification.data.url, self.location.origin).href
+  event.waitUntil(open(url))
+})
+
+async function open(url) {
+  const [client] = await self.clients.matchAll({ type: "window" })
+  if (!client) return self.clients.openWindow(url)
+  await client.focus()
+  if (client.url !== url) await client.navigate(url)
+}

package/templates/features/push/scripts/push-vault-secrets.mjs

@@ -0,0 +1,60 @@
+import { execFileSync } from "node:child_process"
+import { mkdtempSync, readFileSync, rmSync, writeFileSync } from "node:fs"
+import { tmpdir } from "node:os"
+import path from "node:path"
+import process from "node:process"
+
+const ref = readFileSync("supabase/.temp/project-ref", "utf8").trim()
+
+const keys = JSON.parse(
+  execFileSync(
+    "supabase",
+    ["projects", "api-keys", "--project-ref", ref, "-o", "json"],
+    { encoding: "utf8", stdio: ["ignore", "pipe", "ignore"] },
+  ),
+)
+const serviceRoleKey = keys.find(
+  ({ name, type }) => name === "service_role" && type === "legacy",
+)?.api_key
+if (!serviceRoleKey) throw new Error("No legacy service_role key found")
+
+const secrets = {
+  project_url: `https://${ref}.supabase.co`,
+  service_role_key: serviceRoleKey,
+}
+
+const sql = `do $$
+declare
+  v_id uuid;
+begin
+${Object.entries(secrets)
+  .map(
+    ([
+      name,
+      value,
+    ]) => `  select id into v_id from vault.secrets where name = '${name}';
+  if v_id is null then
+    perform vault.create_secret('${value}', '${name}');
+  else
+    perform vault.update_secret(v_id, '${value}');
+  end if;`,
+  )
+  .join("\n")}
+end;
+$$;
+`
+
+const dir = mkdtempSync(path.join(tmpdir(), "vaitu-vault-"))
+const file = path.join(dir, "secrets.sql")
+try {
+  writeFileSync(file, sql, { mode: 0o600 })
+  execFileSync("supabase", ["db", "query", "--linked", "--file", file], {
+    stdio: ["ignore", "ignore", "inherit"],
+  })
+} finally {
+  rmSync(dir, { recursive: true, force: true })
+}
+
+process.stdout.write(
+  `Vault set for ${ref}: ${Object.keys(secrets).join(", ")}\n`,
+)

package/templates/features/push/supabase/functions/deno.json

@@ -0,0 +1,6 @@
+{
+  "nodeModulesDir": "none",
+  "lint": {
+    "rules": { "exclude": ["no-import-prefix"] }
+  }
+}

package/templates/features/push/supabase/functions/push-notify/index.ts

@@ -0,0 +1,187 @@
+import "jsr:@supabase/functions-js@2/edge-runtime.d.ts"
+
+import { decodeBase64 } from "jsr:@std/encoding@1/base64"
+import { decodeBase64Url, encodeBase64Url } from "jsr:@std/encoding@1/base64url"
+import { createClient } from "npm:@supabase/supabase-js@2"
+
+interface ServiceAccount {
+  project_id: string
+  client_email: string
+  private_key: string
+}
+
+const TOKEN_URL = "https://oauth2.googleapis.com/token"
+const SCOPE = "https://www.googleapis.com/auth/firebase.messaging"
+const MS_PER_SECOND = 1000
+const TOKEN_LIFETIME_S = 3600
+const RENEW_MARGIN_S = 60
+const STATUS_FORBIDDEN = 403
+const STATUS_BAD_REQUEST = 400
+const STATUS_NOT_FOUND = 404
+
+let access: { token: string; expiresAt: number } | null = null
+
+Deno.serve(async (req) => {
+  if (callerRole(req) !== "service_role") {
+    return Response.json(
+      { error: "Database only" },
+      { status: STATUS_FORBIDDEN },
+    )
+  }
+
+  const { notification_id: id } = await req.json()
+  if (typeof id !== "string") {
+    return Response.json(
+      { error: "notification_id required" },
+      { status: STATUS_BAD_REQUEST },
+    )
+  }
+
+  const db = createClient(env("SUPABASE_URL"), env("SUPABASE_SERVICE_ROLE_KEY"))
+
+  // Setting pushed_at is the claim: a repeated call finds nothing left to send.
+  const { data: notification, error } = await db
+    .from("notifications")
+    .update({ pushed_at: new Date().toISOString() })
+    .eq("id", id)
+    .is("pushed_at", null)
+    .select("user_id, title, body, url")
+    .maybeSingle()
+  if (error) throw error
+  if (!notification) return Response.json({ sent: 0 })
+
+  const { data: devices, error: devicesError } = await db
+    .from("push_tokens")
+    .select("token, platform")
+    .eq("user_id", notification.user_id)
+  if (devicesError) throw devicesError
+
+  const responses = await Promise.all(
+    devices.map(({ token, platform }) =>
+      send(fcmMessage(token, platform, notification)),
+    ),
+  )
+
+  // 404: the app was uninstalled, the browser reset or the permission revoked.
+  const gone = devices
+    .filter((_, index) => responses[index].status === STATUS_NOT_FOUND)
+    .map(({ token }) => token)
+  if (gone.length) await db.from("push_tokens").delete().in("token", gone)
+
+  for (const response of responses) {
+    if (!response.ok && response.status !== STATUS_NOT_FOUND) {
+      console.error("push failed", response.status, await response.text())
+    }
+  }
+
+  return Response.json({
+    sent: responses.filter((response) => response.ok).length,
+  })
+})
+
+// Browsers get data only, for public/sw-push.js to show. The native apps get a
+// notification the system shows by itself, even with the app closed.
+function fcmMessage(
+  token: string,
+  platform: string,
+  { title, body, url }: { title: string; body: string; url: string },
+) {
+  if (platform === "web") {
+    return {
+      token,
+      data: { title, body, url },
+      webpush: { headers: { Urgency: "high" } },
+    }
+  }
+  return {
+    token,
+    notification: { title, body },
+    data: { url },
+    android: { priority: "high" },
+  }
+}
+
+async function send(message: unknown) {
+  const account: ServiceAccount = JSON.parse(env("FCM_SERVICE_ACCOUNT"))
+  return fetch(
+    `https://fcm.googleapis.com/v1/projects/${account.project_id}/messages:send`,
+    {
+      method: "POST",
+      headers: {
+        Authorization: `Bearer ${await accessToken(account)}`,
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify({ message }),
+    },
+  )
+}
+
+async function accessToken(account: ServiceAccount) {
+  const now = Math.floor(Date.now() / MS_PER_SECOND)
+  if (access && access.expiresAt - RENEW_MARGIN_S > now) return access.token
+
+  const res = await fetch(TOKEN_URL, {
+    method: "POST",
+    headers: { "Content-Type": "application/x-www-form-urlencoded" },
+    body: new URLSearchParams({
+      grant_type: "urn:ietf:params:oauth:grant-type:jwt-bearer",
+      assertion: await signedJwt(account, now),
+    }),
+  })
+  if (!res.ok)
+    throw new Error(`Google OAuth ${res.status}: ${await res.text()}`)
+  const { access_token, expires_in } = await res.json()
+  access = { token: access_token, expiresAt: now + expires_in }
+  return access_token
+}
+
+async function signedJwt(account: ServiceAccount, now: number) {
+  const header = jwtPart({ alg: "RS256", typ: "JWT" })
+  const claims = jwtPart({
+    iss: account.client_email,
+    scope: SCOPE,
+    aud: TOKEN_URL,
+    iat: now,
+    exp: now + TOKEN_LIFETIME_S,
+  })
+  const key = await crypto.subtle.importKey(
+    "pkcs8",
+    decodeBase64(
+      account.private_key.replace(/-----[^-]+-----/g, "").replace(/\s/g, ""),
+    ),
+    { name: "RSASSA-PKCS1-v1_5", hash: "SHA-256" },
+    false,
+    ["sign"],
+  )
+  const signature = await crypto.subtle.sign(
+    "RSASSA-PKCS1-v1_5",
+    key,
+    new TextEncoder().encode(`${header}.${claims}`),
+  )
+  return `${header}.${claims}.${encodeBase64Url(signature)}`
+}
+
+function jwtPart(value: unknown) {
+  return encodeBase64Url(new TextEncoder().encode(JSON.stringify(value)))
+}
+
+// The gateway has already verified the token's signature; its role says whether
+// the database sent it or a client holding the publishable key.
+function callerRole(req: Request) {
+  const token = (req.headers.get("authorization") ?? "").replace(
+    /^Bearer\s+/i,
+    "",
+  )
+  try {
+    const payload = decodeBase64Url(token.split(".")[1])
+    return JSON.parse(new TextDecoder().decode(payload)).role
+  } catch {
+    return null
+  }
+}
+
+function env(name: string) {
+  const value = Deno.env.get(name)
+  if (!value) throw new Error(`${name} is not set`)
+  return value
+}

package/templates/features/push/supabase/migrations/push.sql

@@ -0,0 +1,115 @@
+create extension if not exists pg_net with schema extensions;
+
+-- A token belongs to one user at a time, whoever last signed in on that device,
+-- so two people sharing a phone never both get pushes on it.
+create table public.push_tokens (
+  token text primary key,
+  user_id uuid not null references auth.users (id) on delete cascade,
+  platform text not null check (platform in ('web', 'android', 'ios')),
+  created_at timestamptz not null default now()
+);
+
+create index push_tokens_user_id_idx on public.push_tokens (user_id);
+
+alter table public.push_tokens enable row level security;
+
+create policy "Users can read their own push tokens"
+  on public.push_tokens for select to authenticated
+  using (auth.uid() = user_id);
+
+create policy "Users can delete their own push tokens"
+  on public.push_tokens for delete to authenticated
+  using (auth.uid() = user_id);
+
+-- Security definer: the token may still be held by the device's previous user
+-- (a sign-out that could not reach the server), and RLS would hide that row
+-- from the one taking it over.
+create function public.save_push_token(p_token text, p_platform text)
+returns void
+language plpgsql
+security definer
+set search_path = public
+as $$
+begin
+  if auth.uid() is null then
+    raise exception 'Not logged in';
+  end if;
+
+  insert into public.push_tokens (token, user_id, platform)
+  values (p_token, auth.uid(), p_platform)
+  on conflict (token) do update
+  set user_id = excluded.user_id,
+      platform = excluded.platform;
+end;
+$$;
+
+revoke execute on function public.save_push_token(text, text) from public, anon;
+grant execute on function public.save_push_token(text, text) to authenticated;
+
+-- Inserting a row is how the app sends a push: from a trigger, an edge function
+-- or the dashboard. No insert policy, so clients cannot send pushes to others.
+create table public.notifications (
+  id uuid primary key default gen_random_uuid(),
+  user_id uuid not null references auth.users (id) on delete cascade,
+  title text not null,
+  body text not null,
+  url text not null default '/',
+  created_at timestamptz not null default now(),
+  pushed_at timestamptz
+);
+
+create index notifications_user_id_idx on public.notifications (user_id);
+
+alter table public.notifications enable row level security;
+
+create policy "Users can read their own notifications"
+  on public.notifications for select to authenticated
+  using (auth.uid() = user_id);
+
+-- The URL and the service-role key live in Vault, so neither is in a migration:
+-- supabase/seed.sql sets the local ones, `pnpm vault:push` the linked project's.
+create function public.wake_push_notify()
+returns trigger
+language plpgsql
+security definer
+set search_path = public
+as $$
+declare
+  v_url text;
+  v_key text;
+begin
+  if not exists (
+    select 1 from public.push_tokens where user_id = new.user_id
+  ) then
+    return new;
+  end if;
+
+  select decrypted_secret into v_url
+  from vault.decrypted_secrets where name = 'project_url';
+  select decrypted_secret into v_key
+  from vault.decrypted_secrets where name = 'service_role_key';
+  if v_url is null or v_key is null then
+    return new;
+  end if;
+
+  perform net.http_post(
+    url := rtrim(v_url, '/') || '/functions/v1/push-notify',
+    headers := jsonb_build_object(
+      'Content-Type', 'application/json',
+      'Authorization', 'Bearer ' || v_key
+    ),
+    body := jsonb_build_object('notification_id', new.id)
+  );
+  return new;
+exception when others then
+  -- A failed push must never fail the insert that asked for it.
+  raise warning 'wake_push_notify: %', sqlerrm;
+  return new;
+end;
+$$;
+
+revoke execute on function public.wake_push_notify() from public, anon, authenticated;
+
+create trigger wake_push_notify
+  after insert on public.notifications
+  for each row execute function public.wake_push_notify();

package/templates/features/push/supabase/seed.sql

@@ -0,0 +1,20 @@
+-- What the push trigger calls push-notify with on the local stack: its gateway,
+-- as the database container sees it, and the demo key every local stack shares.
+-- Applied by `supabase db reset`, so a linked reset takes `--no-seed`.
+do $$
+begin
+  if not exists (
+    select 1 from vault.decrypted_secrets where name = 'project_url'
+  ) then
+    perform vault.create_secret('http://kong:8000', 'project_url');
+  end if;
+  if not exists (
+    select 1 from vault.decrypted_secrets where name = 'service_role_key'
+  ) then
+    perform vault.create_secret(
+      'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZS1kZW1vIiwicm9sZSI6InNlcnZpY2Vfcm9sZSIsImV4cCI6MTk4MzgxMjk5Nn0.EGIM96RAZx35lJzdJsyH-qQwv8Hdp7fsn3W0YpN81IU',
+      'service_role_key'
+    );
+  end if;
+end;
+$$;

package/templates/js/package.json

@@ -30,6 +30,6 @@
   },
   "packageManager": "pnpm@10.15.0",
   "engines": {
-    "node": ">= 22"
+    "node": ">= 26"
   }
 }

package/templates/js/vite.config.js

@@ -9,7 +9,6 @@ import { ViteImageOptimizer } from "vite-plugin-image-optimizer"
 const __filename = fileURLToPath(import.meta.url)
 const __dirname = path.dirname(__filename)
 
-// https://vite.dev/config/
 export default defineConfig({
   plugins: [ViteImageOptimizer(), hmr()],
 

package/templates/js-jsx/package.json

@@ -32,6 +32,6 @@
   },
   "packageManager": "pnpm@10.15.0",
   "engines": {
-    "node": ">= 22"
+    "node": ">= 26"
   }
 }

package/templates/js-jsx/vite.config.js

@@ -10,7 +10,6 @@ import { ViteImageOptimizer } from "vite-plugin-image-optimizer"
 const __filename = fileURLToPath(import.meta.url)
 const __dirname = path.dirname(__filename)
 
-// https://vite.dev/config/
 export default defineConfig({
   plugins: [ViteImageOptimizer(), jsx(), hmr()],
 

package/templates/js-vue/package.json

@@ -31,6 +31,6 @@
   },
   "packageManager": "pnpm@10.15.0",
   "engines": {
-    "node": ">= 22"
+    "node": ">= 26"
   }
 }

package/templates/js-vue/vite.config.js

@@ -10,7 +10,6 @@ import { ViteImageOptimizer } from "vite-plugin-image-optimizer"
 const __filename = fileURLToPath(import.meta.url)
 const __dirname = path.dirname(__filename)
 
-// https://vite.dev/config/
 export default defineConfig({
   plugins: [ViteImageOptimizer(), vue(), hmr()],
 

package/templates/ssx-js/package.json

@@ -32,6 +32,6 @@
   },
   "packageManager": "pnpm@10.15.0",
   "engines": {
-    "node": ">= 22"
+    "node": ">= 26"
   }
 }

package/templates/ssx-js/src/site.config.js

@@ -6,7 +6,6 @@ export default {
     description: "Built with @inglorious/ssx",
     viewport: "width=device-width, initial-scale=1.0, viewport-fit=cover",
   },
-  // SSX includes image optimization by default
   vite: {
     server: {
       port: 3000,

package/templates/ssx-js-jsx/package.json

@@ -34,6 +34,6 @@
   },
   "packageManager": "pnpm@10.15.0",
   "engines": {
-    "node": ">= 22"
+    "node": ">= 26"
   }
 }