@inglorious/create-app 1.2.0 → 1.4.0

package/README.md

@@ -36,10 +36,16 @@ For the JavaScript and TypeScript Vite templates, the CLI then asks about the ap
 | Translate the app?        | `--i18n` / `--no-i18n`, `--languages=en,it`          | `@inglorious/i18n`, a catalogue per language and a language picker; the first language is the default |
 | Enable PWA support?       | `--pwa` / `--no-pwa`                                 | `vite-plugin-pwa`, a manifest, icons and service worker registration                                  |
 
-The app is generated in the syntax you chose: lit-html, JSX or Vue. Every question answered by a flag is skipped:
+The app is generated in the syntax you chose: lit-html, JSX or Vue. Every question answered on the command line is skipped, so a project can be created without any prompt:
+
+| Question                    | Argument or flag                             |
+| --------------------------- | -------------------------------------------- |
+| What is your project named? | The first argument, such as `my-app`         |
+| Select a template           | `--template=minimal\|js\|ts\|ssx-js\|ssx-ts` |
+| Select a rendering syntax   | `--syntax=lit-html\|jsx\|vue`                |
 
 ```bash
-npm create @inglorious/app@latest -- --ui --theme=material --routing --transitions --icons=material --languages=en,it --mobile
+npm create @inglorious/app@latest -- my-app --template=ts --syntax=jsx --ui --theme=material --routing --transitions --icons=material --languages=en,it --no-mobile --no-pwa
 ```
 
 ## Templates

package/bin/index.js

@@ -16,6 +16,7 @@ import {
   USER_ARG_START_INDEX,
   VITE_APP_TEMPLATES,
 } from "./lib/constants.js"
+import { SYNTAXES, TEMPLATES } from "./lib/features.js"
 import { copyDir } from "./lib/file.js"
 import { addMobileSupport } from "./lib/mobile.js"
 import { addPwaSupport } from "./lib/pwa.js"
@@ -25,6 +26,8 @@ async function main() {
   const __dirname = path.dirname(fileURLToPath(import.meta.url))
   const templatesRoot = path.join(__dirname, "../templates")
   const cliOptions = parseCliOptions(process.argv.slice(USER_ARG_START_INDEX))
+  validateChoice("template", cliOptions.template, TEMPLATES)
+  validateChoice("syntax", cliOptions.syntax, SYNTAXES)
 
   let canceled = false
 
@@ -33,45 +36,19 @@ async function main() {
     return false
   }
 
-  const { projectName, baseTemplate } = await prompts(
+  const answers = await prompts(
     [
       {
-        type: "text",
+        type: cliOptions.projectName ? null : "text",
         name: "projectName",
         message: "What is your project named?",
         initial: "my-app",
       },
       {
-        type: "select",
+        type: cliOptions.template ? null : "select",
         name: "baseTemplate",
         message: "Select a template",
-        choices: [
-          {
-            title: "Minimal",
-            description: "A single HTML file for a zero-build setup",
-            value: "minimal",
-          },
-          {
-            title: "JavaScript",
-            description: "A vanilla JavaScript setup with Vite",
-            value: "js",
-          },
-          {
-            title: "TypeScript",
-            description: "A TypeScript setup with Vite",
-            value: "ts",
-          },
-          {
-            title: "SSX (JavaScript)",
-            description: "Static Site Xecution with JavaScript",
-            value: "ssx-js",
-          },
-          {
-            title: "SSX (TypeScript)",
-            description: "Static Site Xecution with TypeScript",
-            value: "ssx-ts",
-          },
-        ],
+        choices: toChoices(TEMPLATES),
       },
     ],
     { onCancel },
@@ -82,31 +59,18 @@ async function main() {
     return
   }
 
+  const projectName = cliOptions.projectName ?? answers.projectName
+  const baseTemplate = cliOptions.template ?? answers.baseTemplate
+
   let renderer = "lit-html"
 
   if (baseTemplate !== "minimal") {
     const { selectedRenderer } = await prompts(
       {
-        type: "select",
+        type: cliOptions.syntax ? null : "select",
         name: "selectedRenderer",
         message: "Select a rendering syntax",
-        choices: [
-          {
-            title: "lit-html (default)",
-            description: "Tagged template literals (html`<div>...</div>`)",
-            value: "lit-html",
-          },
-          {
-            title: "JSX",
-            description: "JSX/TSX syntax (<div>...</div>)",
-            value: "jsx",
-          },
-          {
-            title: "Vue",
-            description: "Vue SFC-style templates",
-            value: "vue",
-          },
-        ],
+        choices: toChoices(SYNTAXES),
       },
       { onCancel },
     )
@@ -116,7 +80,9 @@ async function main() {
       return
     }
 
-    renderer = selectedRenderer
+    renderer = cliOptions.syntax ?? selectedRenderer
+  } else if (cliOptions.syntax && cliOptions.syntax !== "lit-html") {
+    console.warn("The minimal template is only available with lit-html.")
   }
 
   let features = {
@@ -223,6 +189,21 @@ async function main() {
   }
 }
 
+function toChoices(options) {
+  return Object.entries(options).map(([value, option]) => ({
+    value,
+    ...option,
+  }))
+}
+
+function validateChoice(flag, value, options) {
+  if (value !== null && !options[value]) {
+    throw new Error(
+      `Unknown ${flag} "${value}". Choose one of: ${Object.keys(options).join(", ")}.`,
+    )
+  }
+}
+
 function getLatestVersion(packageName) {
   try {
     const version = execSync(`npm view ${packageName} version`, {

package/bin/lib/app-jsx.js

@@ -252,9 +252,7 @@ export function messageSource(app) {
   }
   if (app.i18n) imports.push('import { t } from "../i18n"')
   const greeting = app.i18n ? '{t("message.hello", { who })}' : "Hello {who}"
-  const declaration = app.isTypeScript
-    ? "export const Message: MessageType = {"
-    : "export const Message = {"
+  const annotation = app.isTypeScript ? ": MessageType" : ""
 
   const span = app.i18n
     ? `      <span onClick={() => api.notify(\`#\${entity.id}:click\`)}>
@@ -264,7 +262,7 @@ export function messageSource(app) {
 
   const head = imports.length ? `${importBlock(imports)}\n\n` : ""
 
-  return `${head}${declaration}
+  return `${head}export const Message${annotation} = {
   click(entity) {
     entity.isUpperCase = !entity.isUpperCase
   },

package/bin/lib/app-lit.js

@@ -187,7 +187,7 @@ export function homeSource(app, { showcase }) {
     imports.push('import { Icon } from "@inglorious/ui/icon"')
   }
   if (app.isTypeScript) {
-    imports.push('import type { AppApi, HomeEntity } from "../../types"')
+    imports.push('import type { HomeType } from "../../types"')
   }
   if (app.i18n) imports.push('import { t } from "../i18n"')
 
@@ -207,14 +207,12 @@ ${showcase
       </p>`
     : ""
 
-  const signature = app.isTypeScript
-    ? "render(entity: HomeEntity, api: AppApi)"
-    : "render(entity, api)"
+  const annotation = app.isTypeScript ? ": HomeType" : ""
 
   return `${importBlock(imports)}
 
-export const Home = {
-  ${signature} {
+export const Home${annotation} = {
+  render(entity, api) {
     return html\`
       <h1>${text("home.title", "Welcome")}</h1>
       <p>
@@ -253,13 +251,11 @@ export function messageSource(app) {
   }
   if (app.i18n) imports.push('import { t } from "../i18n"')
   const greeting = app.i18n ? '${t("message.hello", { who })}' : "Hello ${who}"
-  const declaration = app.isTypeScript
-    ? "export const Message: MessageType = {"
-    : "export const Message = {"
+  const annotation = app.isTypeScript ? ": MessageType" : ""
 
   return `${importBlock(imports)}
 
-${declaration}
+export const Message${annotation} = {
   click(entity) {
     entity.isUpperCase = !entity.isUpperCase
   },

package/bin/lib/app.js

@@ -227,9 +227,7 @@ main {
 
 function storeSource(app) {
   const imports = [
-    app.isTypeScript
-      ? 'import { createStore, type TypesConfig } from "@inglorious/store"'
-      : 'import { createStore } from "@inglorious/store"',
+    'import { createStore } from "@inglorious/store"',
     componentImport(app, "Home", "../pages/home"),
     componentImport(app, "Message", "../types/message"),
     'import { entities } from "./entities"',
@@ -250,14 +248,13 @@ function storeSource(app) {
   const types = ["Message", "Home"]
   if (app.routing) types.push("About", "Router")
   if (app.i18n) types.push("I18n")
-  const cast = app.isTypeScript ? " as unknown as TypesConfig<AppEntity>" : ""
-  const oneLine = `  types: { ${types.join(", ")} }${cast},`
+  const oneLine = `  types: { ${types.join(", ")} },`
   const typesValue =
     oneLine.length <= LINE_WIDTH
       ? oneLine
       : `  types: {
 ${types.map((type) => `    ${type},`).join("\n")}
-  }${cast},`
+  },`
   const generics = app.isTypeScript ? "<AppEntity, AppState>" : ""
 
   return `${importBlock(imports)}
@@ -333,14 +330,13 @@ export const { I18n, t, ready } = createI18n({
 function typesSource(app) {
   const imports = [
     'import "./vite-end"',
-    'import type { BaseEntity, EntitiesState } from "@inglorious/store"',
+    'import type {\n  BaseEntity,\n  EntitiesState,\n  EntityType,\n} from "@inglorious/store"',
     'import type { Api, TemplateResult } from "@inglorious/web"',
   ]
   const entities = ["MessageEntity", "HomeEntity"]
   const declarations = [
     `export interface MessageEntity extends BaseEntity {
   type: "Message"
-  id?: string
   who: string
   isUpperCase?: boolean
 }`,
@@ -362,7 +358,7 @@ function typesSource(app) {
       `export interface AboutEntity extends BaseEntity {
   type: "About"
 }`,
-      `export interface AppRouterEntity extends BaseEntity, Omit<RouterEntity, "id"> {
+      `export interface AppRouterEntity extends RouterEntity {
   type: "Router"
 }`,
     )
@@ -373,7 +369,7 @@ function typesSource(app) {
     imports.push('import type { I18nEntity } from "@inglorious/i18n"')
     entities.push("AppI18nEntity")
     declarations.push(
-      `export interface AppI18nEntity extends BaseEntity, Omit<I18nEntity, "id"> {
+      `export interface AppI18nEntity extends I18nEntity {
   type: "I18n"
 }`,
     )
@@ -394,9 +390,23 @@ ${state.join("\n")}
 
 export type AppApi = Api<AppEntity, AppState>
 
-export interface MessageType {
+// Each type's events and their payloads. Declare types with \`type\`, not
+// \`interface\`: an interface does not fit the store's \`types\`.
+export type MessageType = {
   click: (entity: MessageEntity) => void
-  render: (entity: MessageEntity, api: AppApi) => TemplateResult | null
+  render: (entity: MessageEntity, api: AppApi) => TemplateResult
+}
+${
+  app.renderer === "lit-html"
+    ? `
+export type HomeType = {
+  render: (entity: HomeEntity, api: AppApi) => TemplateResult
+}
+`
+    : ""
 }
+// A shorthand for a type: \`{ ... } satisfies AppType<MessageEntity>\` infers
+// its handlers' parameters, but neither lists its events nor types payloads.
+export type AppType<TEntity extends AppEntity> = EntityType<TEntity, AppApi>
 `
 }

package/bin/lib/cli.js

@@ -1,5 +1,8 @@
 export function parseCliOptions(args) {
   return {
+    projectName: args.find((arg) => !arg.startsWith("-")) ?? null,
+    template: readValueFlag(args, "template"),
+    syntax: readValueFlag(args, "syntax"),
     mobile: readBooleanFlag(args, "mobile"),
     pwa: readBooleanFlag(args, "pwa"),
     ui: readBooleanFlag(args, "ui"),

package/bin/lib/constants.js

@@ -1,7 +1,9 @@
 export const CAPACITOR_VERSION = "^8.5.3"
 export const VITE_PLUGIN_PWA_VERSION = "^2.0.0"
 export const VITE_PWA_ASSETS_GENERATOR_VERSION = "^2.0.0"
-export const TYPESCRIPT_VERSION = "^7.0.2"
+// TypeScript 7 has no JavaScript API, which typescript-eslint and the
+// Capacitor CLI import, so `typescript` stays on 6.
+export const TYPESCRIPT_VERSION = "npm:@typescript/typescript6@^6.0.2"
 export const WORKBOX_WINDOW_VERSION = "^7.4.1"
 
 export const INDENTATION = 2

package/bin/lib/features.js

@@ -1,5 +1,34 @@
 // The choices create-app offers for lit-html apps, and what each one brings.
 
+export const TEMPLATES = {
+  minimal: {
+    title: "Minimal",
+    description: "A single HTML file for a zero-build setup",
+  },
+  js: {
+    title: "JavaScript",
+    description: "A vanilla JavaScript setup with Vite",
+  },
+  ts: { title: "TypeScript", description: "A TypeScript setup with Vite" },
+  "ssx-js": {
+    title: "SSX (JavaScript)",
+    description: "Static Site Xecution with JavaScript",
+  },
+  "ssx-ts": {
+    title: "SSX (TypeScript)",
+    description: "Static Site Xecution with TypeScript",
+  },
+}
+
+export const SYNTAXES = {
+  "lit-html": {
+    title: "lit-html (default)",
+    description: "Tagged template literals (html`<div>...</div>`)",
+  },
+  jsx: { title: "JSX", description: "JSX/TSX syntax (<div>...</div>)" },
+  vue: { title: "Vue", description: "Vue SFC-style templates" },
+}
+
 export const THEMES = {
   inglorious: { title: "Inglorious", description: "Neon, videogame-inspired" },
   material: { title: "Material", description: "Material Design inspired" },

package/bin/lib/pwa.js

@@ -93,7 +93,9 @@ export function writePwaRegistration(targetDir) {
 
 export function createPwaRegistrationSource(extension) {
   if (extension === ".ts") {
-    return `/// <reference types="vite-plugin-pwa/client" />
+    return `// Only the framework-free helpers: "client" also loads React's and Preact's
+// typings, whose global JSX would replace Inglorious's.
+/// <reference types="vite-plugin-pwa/vanillajs" />
 import { isNative } from "@inglorious/web/mobile"
 import { registerSW } from "virtual:pwa-register"
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inglorious/create-app",
-  "version": "1.2.0",
+  "version": "1.4.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",
@@ -37,7 +37,7 @@
     "prompts": "^2.4.2"
   },
   "devDependencies": {
-    "@inglorious/eslint-config": "1.1.2",
+    "@inglorious/eslint-config": "1.1.4",
     "prettier": "^3.9.6"
   },
   "scripts": {

package/templates/ssx-ts/src/pages/about.ts

@@ -1,13 +1,13 @@
-import { Api, html } from "@inglorious/web"
+import { html } from "@inglorious/web"
 
-import type { AboutEntity } from "../../types"
+import type { AboutType } from "../../types"
 
-export const About = {
-  click(entity: AboutEntity) {
+export const About: AboutType = {
+  click(entity) {
     entity.name += "!"
   },
 
-  render(entity: AboutEntity, api: Api) {
+  render(entity, api) {
     return html`
       <div>
         <h1>

package/templates/ssx-ts/types/index.d.ts

@@ -1,9 +1,9 @@
-import { BaseEntity, EntitiesState } from "@inglorious/store"
+import type { BaseEntity, EntitiesState, EntityType } from "@inglorious/store"
+import type { Api, TemplateResult } from "@inglorious/web"
 
 // Define your entity types
 export interface AboutEntity extends BaseEntity {
   type: "About"
-  id?: string
   name: string
 }
 
@@ -15,9 +15,15 @@ export interface AppState extends EntitiesState<AppEntity> {
   about: AboutEntity
 }
 
-// Types configuration
-export interface AppTypes {
-  About: {
-    click: (entity: AboutEntity) => void
-  }
+export type AppApi = Api<AppEntity, AppState>
+
+// Each type's events and their payloads. Declare types with `type`, not
+// `interface`: an interface does not fit the store's `types`.
+export type AboutType = {
+  click: (entity: AboutEntity) => void
+  render: (entity: AboutEntity, api: AppApi) => TemplateResult
 }
+
+// A shorthand for a type: `{ ... } satisfies AppType<AboutEntity>` infers
+// its handlers' parameters, but neither lists its events nor types payloads.
+export type AppType<TEntity extends AppEntity> = EntityType<TEntity, AppApi>

package/templates/ts/package.json

@@ -21,13 +21,14 @@
     "@inglorious/eslint-config": "workspace:*",
     "@inglorious/vite-plugin-hmr": "workspace:*",
     "@types/node": "^22.20.5",
+    "@typescript/native": "npm:typescript@^7.0.2",
     "eslint": "^10.13.0",
     "jiti": "^2.7.0",
     "prettier": "^3.9.10",
     "rollup-plugin-minify-template-literals": "^2.2.0",
     "sharp": "^0.35.5",
     "svgo": "^4.1.0",
-    "typescript": "^7.0.2",
+    "typescript": "npm:@typescript/typescript6@^6.0.2",
     "vite": "^8.3.4",
     "vite-plugin-image-optimizer": "^2.0.3"
   },

package/templates/ts/src/store/index.ts

@@ -1,4 +1,4 @@
-import { createStore, type TypesConfig } from "@inglorious/store"
+import { createStore } from "@inglorious/store"
 
 import type { AppEntity, AppState } from "../../types"
 import { Message } from "../types/message"
@@ -6,7 +6,7 @@ import { entities } from "./entities"
 import { middlewares } from "./middlewares"
 
 export const store = createStore<AppEntity, AppState>({
-  types: { Message } as unknown as TypesConfig<AppEntity>,
+  types: { Message },
   entities,
   middlewares,
 })

package/templates/ts/types/index.d.ts

@@ -1,12 +1,11 @@
 import "./vite-end"
 
-import { BaseEntity, EntitiesState } from "@inglorious/store"
-import { Api, TemplateResult } from "@inglorious/web"
+import type { BaseEntity, EntitiesState, EntityType } from "@inglorious/store"
+import type { Api, TemplateResult } from "@inglorious/web"
 
 // Define your entity types
 export interface MessageEntity extends BaseEntity {
   type: "Message"
-  id?: string
   who: string
   isUpperCase?: boolean
 }
@@ -23,8 +22,13 @@ export interface AppState extends EntitiesState<AppEntity> {
 
 export type AppApi = Api<AppEntity, AppState>
 
-// Types configuration
-export interface MessageType {
+// Each type's events and their payloads. Declare types with `type`, not
+// `interface`: an interface does not fit the store's `types`.
+export type MessageType = {
   click: (entity: MessageEntity) => void
-  render: (entity: MessageEntity, api: AppApi) => TemplateResult | null
+  render: (entity: MessageEntity, api: AppApi) => TemplateResult
 }
+
+// A shorthand for a type: `{ ... } satisfies AppType<MessageEntity>` infers
+// its handlers' parameters, but neither lists its events nor types payloads.
+export type AppType<TEntity extends AppEntity> = EntityType<TEntity, AppApi>

package/templates/ts-jsx/package.json

@@ -23,13 +23,14 @@
     "@inglorious/vite-plugin-hmr": "workspace:*",
     "@inglorious/vite-plugin-jsx": "workspace:*",
     "@types/node": "^22.20.5",
+    "@typescript/native": "npm:typescript@^7.0.2",
     "eslint": "^10.13.0",
     "jiti": "^2.7.0",
     "prettier": "^3.9.10",
     "rollup-plugin-minify-template-literals": "^2.2.0",
     "sharp": "^0.35.5",
     "svgo": "^4.1.0",
-    "typescript": "^7.0.2",
+    "typescript": "npm:@typescript/typescript6@^6.0.2",
     "vite": "^8.3.4",
     "vite-plugin-image-optimizer": "^2.0.3"
   },

package/templates/ts-jsx/src/app.tsx

@@ -1,5 +1,4 @@
 import type { AppApi } from "../types"
-
 import { Message } from "./types/message"
 
 export const App = {

package/templates/ts-jsx/src/store/index.ts

@@ -1,4 +1,4 @@
-import { createStore, type TypesConfig } from "@inglorious/store"
+import { createStore } from "@inglorious/store"
 
 import type { AppEntity, AppState } from "../../types"
 import { Message } from "../types/message"
@@ -6,7 +6,7 @@ import { entities } from "./entities"
 import { middlewares } from "./middlewares"
 
 export const store = createStore<AppEntity, AppState>({
-  types: { Message } as unknown as TypesConfig<AppEntity>,
+  types: { Message },
   entities,
   middlewares,
 })

package/templates/ts-jsx/types/index.d.ts

@@ -1,12 +1,11 @@
 import "./vite-end"
 
-import { BaseEntity, EntitiesState } from "@inglorious/store"
-import { Api, TemplateResult } from "@inglorious/web"
+import type { BaseEntity, EntitiesState, EntityType } from "@inglorious/store"
+import type { Api, TemplateResult } from "@inglorious/web"
 
 // Define your entity types
 export interface MessageEntity extends BaseEntity {
   type: "Message"
-  id?: string
   who: string
   isUpperCase?: boolean
 }
@@ -23,8 +22,13 @@ export interface AppState extends EntitiesState<AppEntity> {
 
 export type AppApi = Api<AppEntity, AppState>
 
-// Types configuration
-export interface MessageType {
+// Each type's events and their payloads. Declare types with `type`, not
+// `interface`: an interface does not fit the store's `types`.
+export type MessageType = {
   click: (entity: MessageEntity) => void
-  render: (entity: MessageEntity, api: AppApi) => TemplateResult | null
+  render: (entity: MessageEntity, api: AppApi) => TemplateResult
 }
+
+// A shorthand for a type: `{ ... } satisfies AppType<MessageEntity>` infers
+// its handlers' parameters, but neither lists its events nor types payloads.
+export type AppType<TEntity extends AppEntity> = EntityType<TEntity, AppApi>

package/templates/ts-vue/package.json

@@ -22,13 +22,14 @@
     "@inglorious/vite-plugin-hmr": "workspace:*",
     "@inglorious/vite-plugin-vue": "workspace:*",
     "@types/node": "^22.20.5",
+    "@typescript/native": "npm:typescript@^7.0.2",
     "eslint": "^10.13.0",
     "jiti": "^2.7.0",
     "prettier": "^3.9.10",
     "rollup-plugin-minify-template-literals": "^2.2.0",
     "sharp": "^0.35.5",
     "svgo": "^4.1.0",
-    "typescript": "^7.0.2",
+    "typescript": "npm:@typescript/typescript6@^6.0.2",
     "vite": "^8.3.4",
     "vite-plugin-image-optimizer": "^2.0.3"
   },

package/templates/ts-vue/src/main.ts

@@ -4,4 +4,4 @@ import { mount } from "@inglorious/web"
 import { App } from "./app.vue"
 import { store } from "./store"
 
-mount(store, (api) => App.render(null, api), document.getElementById("root"))
+mount(store, (api) => App.render(null, api), document.getElementById("root")!)

package/templates/ts-vue/src/store/index.ts

@@ -1,4 +1,4 @@
-import { createStore, type TypesConfig } from "@inglorious/store"
+import { createStore } from "@inglorious/store"
 
 import type { AppEntity, AppState } from "../../types"
 // @ts-expect-error - Handled by @inglorious/vite-plugin-vue
@@ -7,7 +7,7 @@ import { entities } from "./entities"
 import { middlewares } from "./middlewares"
 
 export const store = createStore<AppEntity, AppState>({
-  types: { Message } as unknown as TypesConfig<AppEntity>,
+  types: { Message },
   entities,
   middlewares,
 })

package/templates/ts-vue/types/index.d.ts

@@ -1,12 +1,11 @@
 import "./vite-end"
 
-import { BaseEntity, EntitiesState } from "@inglorious/store"
-import { Api, TemplateResult } from "@inglorious/web"
+import type { BaseEntity, EntitiesState, EntityType } from "@inglorious/store"
+import type { Api } from "@inglorious/web"
 
 // Define your entity types
 export interface MessageEntity extends BaseEntity {
   type: "Message"
-  id?: string
   who: string
   isUpperCase?: boolean
 }
@@ -23,8 +22,7 @@ export interface AppState extends EntitiesState<AppEntity> {
 
 export type AppApi = Api<AppEntity, AppState>
 
-// Types configuration
-export interface MessageType {
-  click: (entity: MessageEntity) => void
-  render: (entity: MessageEntity, api: AppApi) => TemplateResult | null
-}
+// A type for one of the app's entities. For rigour, declare a type alias
+// listing its events and payloads; this shorthand infers its handlers'
+// parameters with `{ ... } satisfies AppType<MessageEntity>`.
+export type AppType<TEntity extends AppEntity> = EntityType<TEntity, AppApi>