@antelopejs/dms-frontend 0.5.5 → 0.6.0

package/dist/verify-source-build.js

@@ -0,0 +1,113 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.prepareTypes = prepareTypes;
+exports.buildAndTypeCheck = buildAndTypeCheck;
+const node_fs_1 = require("node:fs");
+const node_path_1 = require("node:path");
+const cli_1 = require("@antelopejs/core/cli");
+const child_output_1 = require("./child-output");
+const build_action_1 = require("./commands/build-action");
+const common_1 = require("./common");
+const typecheck_output_1 = require("./typecheck-output");
+const verify_source_result_1 = require("./verify-source-result");
+const vite_output_1 = require("./vite-output");
+const VERIFY_BUILD_STEPS = build_action_1.BUILD_STEPS.filter((step) => step.script !== "build:compress");
+async function prepareTypes(context) {
+    await (0, cli_1.getProcessTasks)().run("Generating the type declarations", async (task) => {
+        const result = await (0, common_1.runFramedCommand)("pnpm", ["--silent", "run", "build:types"], {
+            name: "types",
+            cwd: context.workspace,
+            env: context.env,
+            mapLine: context.mapLine,
+        });
+        if (result.code === 0)
+            return;
+        task.fail("Type declarations failed");
+        throw new cli_1.CliError((0, child_output_1.describeChildFailure)({
+            title: "Generating the type declarations failed",
+            command: "pnpm run build:types",
+            code: result.code,
+            lines: result.lines,
+            isVerbose: context.isVerbose,
+        }));
+    }, { done: "Generated the type declarations" });
+    snapshotTypeDeclarations(context.workspace);
+}
+const AUTO_IMPORTS_DECLARATIONS = "auto-imports.d.ts";
+const AUTO_IMPORTS_SNAPSHOT = "auto-imports.verify.d.ts";
+const TYPECHECK_CONFIG = "tsconfig.verify.json";
+function snapshotTypeDeclarations(workspace) {
+    (0, node_fs_1.cpSync)((0, node_path_1.join)(workspace, AUTO_IMPORTS_DECLARATIONS), (0, node_path_1.join)(workspace, AUTO_IMPORTS_SNAPSHOT));
+    const config = JSON.parse((0, node_fs_1.readFileSync)((0, node_path_1.join)(workspace, "tsconfig.json"), "utf8"));
+    config.files = (config.files ?? []).map((file) => file === AUTO_IMPORTS_DECLARATIONS ? AUTO_IMPORTS_SNAPSHOT : file);
+    if (!config.files.includes(AUTO_IMPORTS_SNAPSHOT))
+        throw new cli_1.CliError({
+            title: `The workspace tsconfig.json does not list ${AUTO_IMPORTS_DECLARATIONS}`,
+        });
+    (0, node_fs_1.writeFileSync)((0, node_path_1.join)(workspace, TYPECHECK_CONFIG), `${JSON.stringify(config, null, 2)}\n`);
+}
+async function buildBundle(context, step, warnings) {
+    await (0, cli_1.getProcessTasks)().run(step.running, async (task) => {
+        const result = await (0, common_1.runFramedCommand)("pnpm", ["--silent", "run", step.script], {
+            name: step.name,
+            cwd: context.workspace,
+            env: context.env,
+            mapLine: context.mapLine,
+            onLine: (line) => warnings.read(line),
+        });
+        if (result.code === 0)
+            return;
+        task.fail(step.failed);
+        throw (0, build_action_1.buildStepFailure)(step, result, context.isVerbose, verify_source_result_1.VERIFY_SOURCE_COMMAND);
+    }, { done: step.done });
+}
+async function buildAndTypeCheck(context) {
+    const stepWarnings = VERIFY_BUILD_STEPS.map(() => new vite_output_1.ViteWarnings());
+    const outcomes = await Promise.allSettled([
+        ...VERIFY_BUILD_STEPS.map((step, index) => buildBundle(context, step, stepWarnings[index])),
+        typeCheck(context),
+    ]);
+    for (const warnings of stepWarnings)
+        for (const line of warnings.lines())
+            context.warnings.read(line);
+    const failure = outcomes.find((outcome) => outcome.status === "rejected");
+    if (failure)
+        throw failure.reason;
+    (0, vite_output_1.reportViteWarnings)(context.warnings, context.isVerbose, (0, cli_1.getProcessUi)());
+}
+async function typeCheck(context) {
+    const typecheckArguments = [
+        "--import",
+        "./typecheck-loader.mjs",
+        "./node_modules/vue-tsc/bin/vue-tsc.js",
+        "--project",
+        TYPECHECK_CONFIG,
+        "--noEmit",
+        "--pretty",
+    ];
+    const isWindows = process.platform === "win32";
+    const command = isWindows ? process.execPath : "env";
+    const commandArguments = isWindows
+        ? typecheckArguments
+        : ["-u", "NODE_OPTIONS", process.execPath, ...typecheckArguments];
+    await (0, cli_1.getProcessTasks)().run("Type checking", async (task) => {
+        const result = await (0, common_1.runFramedCommand)(command, commandArguments, {
+            name: "vue-tsc",
+            cwd: context.workspace,
+            mapLine: context.mapLine,
+        });
+        if (result.code === 0)
+            return;
+        const report = (0, typecheck_output_1.parseTypeCheckOutput)(result.lines);
+        const count = report.count > 0 ? [(0, cli_1.pluralize)(report.count, "error")] : [];
+        task.fail(["Type check failed", ...count].join((0, cli_1.getProcessUi)().symbols.separator));
+        throw new cli_1.CliError((0, typecheck_output_1.describeTypeCheckErrors)(report, verify_source_result_1.VERIFY_SOURCE_COMMAND) ??
+            (0, child_output_1.describeChildFailure)({
+                title: "Type check failed",
+                command: "vue-tsc --noEmit",
+                code: result.code,
+                lines: result.lines,
+                isVerbose: context.isVerbose,
+            }));
+    }, { done: "Type check passed" });
+}

package/dist/verify-source-runner.js

@@ -37,11 +37,10 @@ const node_fs_1 = require("node:fs");
 const node_path_1 = require("node:path");
 const cli_1 = require("@antelopejs/core/cli");
 const child_output_1 = require("./child-output");
-const build_action_1 = require("./commands/build-action");
 const common_1 = require("./common");
 const output_1 = require("./output");
 const temporary_workspace_1 = require("./temporary-workspace");
-const typecheck_output_1 = require("./typecheck-output");
+const verify_source_build_1 = require("./verify-source-build");
 const verify_source_result_1 = require("./verify-source-result");
 const verify_source_sources_1 = require("./verify-source-sources");
 const vite_output_1 = require("./vite-output");
@@ -95,26 +94,6 @@ function materializeWorkspace(workspace, layers, localPackages) {
     };
     (0, node_fs_1.writeFileSync)(packagePath, `${JSON.stringify(workspacePackage, null, 2)}\n`);
 }
-async function buildBundles(context) {
-    const [firstStep] = build_action_1.BUILD_STEPS;
-    await (0, cli_1.getProcessTasks)().run(firstStep.running, async (task) => {
-        for (const step of build_action_1.BUILD_STEPS) {
-            task.update(step.running);
-            const result = await (0, common_1.runFramedCommand)("pnpm", ["--silent", "run", step.script], {
-                name: step.name,
-                cwd: context.workspace,
-                env: context.env,
-                mapLine: context.mapLine,
-                onLine: (line) => context.warnings.read(line),
-            });
-            if (result.code !== 0) {
-                task.fail(step.failed);
-                throw (0, build_action_1.buildStepFailure)(step, result, context.isVerbose, verify_source_result_1.VERIFY_SOURCE_COMMAND);
-            }
-        }
-    }, { done: "Built client, SSR and e-mail bundles" });
-    (0, vite_output_1.reportViteWarnings)(context.warnings, context.isVerbose, (0, cli_1.getProcessUi)());
-}
 function checkClientBundle(workspace) {
     const clientRoot = (0, node_path_1.join)(workspace, "dist", "client");
     const manifest = readJson((0, node_path_1.join)(clientRoot, ".vite", "manifest.json"));
@@ -133,39 +112,16 @@ function checkClientBundle(workspace) {
     for (const marker of RUNTIME_MARKERS)
         ensure(javascript.includes(marker), `${marker} is not reachable at runtime`);
 }
-async function typeCheck(context) {
-    const typecheckArguments = [
-        "--import",
-        "./typecheck-loader.mjs",
-        "./node_modules/vue-tsc/bin/vue-tsc.js",
-        "--noEmit",
-        "--pretty",
-    ];
-    const isWindows = process.platform === "win32";
-    const command = isWindows ? process.execPath : "env";
-    const commandArguments = isWindows
-        ? typecheckArguments
-        : ["-u", "NODE_OPTIONS", process.execPath, ...typecheckArguments];
-    await (0, cli_1.getProcessTasks)().run("Type checking", async (task) => {
-        const result = await (0, common_1.runFramedCommand)(command, commandArguments, {
-            name: "vue-tsc",
-            cwd: context.workspace,
-            mapLine: context.mapLine,
-        });
-        if (result.code === 0)
-            return;
-        const report = (0, typecheck_output_1.parseTypeCheckOutput)(result.lines);
-        const count = report.count > 0 ? [(0, cli_1.pluralize)(report.count, "error")] : [];
-        task.fail(["Type check failed", ...count].join((0, cli_1.getProcessUi)().symbols.separator));
-        throw new cli_1.CliError((0, typecheck_output_1.describeTypeCheckErrors)(report, verify_source_result_1.VERIFY_SOURCE_COMMAND) ??
-            (0, child_output_1.describeChildFailure)({
-                title: "Type check failed",
-                command: "vue-tsc --noEmit",
-                code: result.code,
-                lines: result.lines,
-                isVerbose: context.isVerbose,
-            }));
-    }, { done: "Type check passed" });
+async function checkServerModulesBundle(workspace) {
+    const root = (0, node_path_1.join)(workspace, "dist", "server-modules");
+    const javascript = (0, node_fs_1.readdirSync)(root, { recursive: true, encoding: "utf8" })
+        .filter((file) => file.endsWith(".js"))
+        .map((file) => (0, node_fs_1.readFileSync)((0, node_path_1.join)(root, file), "utf8"))
+        .join("\n");
+    ensure(!/\.vue["'?]|createApp\(|DefaultLayout/.test(javascript), "The server modules bundle loads application code", "A dms.server.ts imports server code only, never .vue files or dms.frontend.ts.");
+    const { serverModules } = (await Promise.resolve(`${(0, node_path_1.join)(root, "server-modules.generated.js")}`).then(s => __importStar(require(s))));
+    ensure(Array.isArray(serverModules), "The server modules bundle exports none");
+    return `${(0, cli_1.pluralize)(serverModules.length, "server module")}, ${(0, output_1.formatSize)(Buffer.byteLength(javascript))} JS`;
 }
 const EMAIL_CASES = [
     {
@@ -293,10 +249,11 @@ async function verifySources() {
     const tasks = (0, cli_1.getProcessTasks)();
     await tasks.run(`Materializing ${(0, cli_1.pluralize)(layers.length, "module")}`, async () => materializeWorkspace(workspace, layers, options.localPackages), { done: `Materialized ${(0, cli_1.pluralize)(layers.length, "module")}` });
     await (0, common_1.installDeps)(workspace, context.mapLine, ["--ignore-scripts"]);
-    await buildBundles(context);
+    await (0, verify_source_build_1.prepareTypes)(context);
+    await (0, verify_source_build_1.buildAndTypeCheck)(context);
     await tasks.run("Checking the client bundle", async () => checkClientBundle(workspace), { done: "Client bundle checked", failed: "Client bundle check failed" });
-    await typeCheck(context);
     await tasks.run("Checking the e-mail contracts", async () => checkEmailContracts(workspace), { done: (line) => line, failed: "E-mail contracts failed" });
+    await tasks.run("Checking the server modules", async () => checkServerModulesBundle(workspace), { done: (line) => line, failed: "Server modules check failed" });
     return { ok: true, modules: layers.length };
 }
 function sendResult(result) {

package/dist/workspace.d.ts

@@ -16,6 +16,11 @@ export interface ManifestModule {
     configKey?: string;
     authEstablishEndpoints?: string[];
     publicEndpoints?: PublicEndpointDeclaration[];
+    backendProxies?: BackendProxyDeclaration[];
+}
+export interface BackendProxyDeclaration {
+    path: string;
+    auth?: "session" | "none";
 }
 export interface PublicEndpointDeclaration {
     path: string;
@@ -25,11 +30,13 @@ export interface PublicEndpointDeclaration {
 export interface Manifest {
     pack: string;
     modules: ManifestModule[];
+    settling?: boolean;
 }
 export interface FrontendManifest {
     version: number;
     archive: string;
     modules: ManifestModule[];
+    settling?: boolean;
 }
 export interface ResolvedLayer {
     path: string;
@@ -39,8 +46,10 @@ export interface ResolvedLayer {
     priority?: number;
     configKey?: string;
     options?: FrontendModuleOptions;
+    privateOptions?: FrontendModuleOptions;
     authEstablishEndpoints?: string[];
     publicEndpoints?: PublicEndpointDeclaration[];
+    backendProxies?: BackendProxyDeclaration[];
 }
 export declare function getWorkspaceDirForKey(key: string): string;
 export declare function projectWorkspaceKey(projectDir: string): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antelopejs/dms-frontend",
-  "version": "0.5.5",
+  "version": "0.6.0",
   "description": "Frontend-agnostic loader for AntelopeJS DMS, shipping the Vue 3 renderer (Vite, Inertia, SSR)",
   "keywords": [
     "antelope",
@@ -85,6 +85,7 @@
     "@vitejs/plugin-vue": "^6.0.1",
     "@vue/server-renderer": "^3.5.25",
     "defu": "^6.1.4",
+    "devalue": "^5.9.4",
     "knip": "^6.34.0",
     "ofetch": "^1.5.1",
     "oxfmt": "^0.66.0",

package/templates/vue/app-runtime.ts

@@ -7,6 +7,7 @@ import ui from "@nuxt/ui/vue-plugin";
 import { useHead } from "@unhead/vue";
 import type { VueHeadClient } from "@unhead/vue/types";
 import type { IconifyIcon } from "@iconify/vue";
+import { parse } from "devalue";
 import type { FetchOptions } from "ofetch";
 import {
   type App,
@@ -22,8 +23,10 @@ import {
 import { createI18n, useI18n } from "vue-i18n";
 import DmsDynamicPage from "./DmsDynamicPage.vue";
 import {
+  type DmsLayerAppConfig,
   type DmsLocaleLoader,
   type DmsPageProps,
+  type DmsPayload,
   type DmsUser,
   createDmsFrontendRuntime,
   dmsPageSuspenseProps,
@@ -32,18 +35,22 @@ import {
   getDmsLayoutProps,
   getDmsPage,
   hydrateDmsPageProps,
+  hydrateDmsSharedProps,
   installDmsPlugins,
+  keepSharedOverHistory,
   preloadDmsPage,
+  preloadPrefetchedDmsPages,
   provideDmsFrontendRuntime,
   readDmsLocaleCookie,
   resolveDmsAsyncComponents,
   resolveDmsComponent,
-  serializeDmsAsyncData,
+  restoreDmsPayload,
   trackDmsAsyncComponents,
+  updateDmsAppConfig,
   useDmsAppConfig,
   useDmsState,
-  useError,
-  useUserSession,
+  useDmsError,
+  useDmsUserSession,
 } from "./frontend-module";
 import {
   SSR_ICONS_ID,
@@ -87,7 +94,7 @@ export type DmsServerFetch = (
   options?: FetchOptions,
 ) => Promise<unknown>;
 
-const SSR_ASYNC_DATA_ID = "dms-ssr-async-data";
+export const DMS_PAYLOAD_ID = "dms-payload";
 export const SSR_ASYNC_COMPONENTS_ID = "dms-ssr-async-components";
 const DEFAULT_LOCALE = "en";
 
@@ -112,17 +119,38 @@ function userLocale(user: DmsUser | null | undefined): string | undefined {
   return supportedLocales.includes(locale) ? locale : undefined;
 }
 
-function readServerRendered<T>(id: string, empty: T): T {
+function readServerRendered<T>(
+  id: string,
+  empty: T,
+  parseText: (text: string) => unknown = JSON.parse,
+): T {
   if (typeof document === "undefined") return empty;
   const element = document.getElementById(id);
   if (!element?.textContent) return empty;
-  const value = JSON.parse(element.textContent) as T;
+  const value = parseText(element.textContent) as T;
   element.remove();
   return value;
 }
 
 drawLoadedIconsAtOnce();
 
+/** A browser runtime, started from what the server rendered, if it did. */
+function createBrowserRuntime(
+  serverFetch?: DmsServerFetch,
+): DmsConfiguredApp["runtime"] {
+  const runtime = createDmsFrontendRuntime(
+    serverFetch as typeof import("ofetch").ofetch,
+  );
+  // Nothing when the server did not render the page: no hydration then.
+  const payload = readServerRendered<DmsPayload | undefined>(
+    DMS_PAYLOAD_ID,
+    undefined,
+    parse,
+  );
+  if (payload) restoreDmsPayload(runtime, payload);
+  return runtime;
+}
+
 const DmsInertiaPage = defineComponent({
   name: "DmsInertiaPage",
   inheritAttrs: false,
@@ -152,7 +180,7 @@ const DmsPersistentLayout = defineComponent({
   setup(_, { attrs, slots }) {
     const props = computed(() => attrs as unknown as DmsPageProps);
     const i18n = useI18n();
-    const { user } = useUserSession();
+    const { user } = useDmsUserSession();
     let localeVersion = 0;
     useHead({
       htmlAttrs: { lang: computed(() => i18n.locale.value) },
@@ -162,6 +190,13 @@ const DmsPersistentLayout = defineComponent({
       () => hydrateDmsPageProps(props.value),
       { immediate: true, flush: "sync" },
     );
+    // Apart from the page: a reload of the site layout alone (`router.reload({
+    // only: ["shared"] })`) is not a navigation.
+    watch(
+      () => attrs.shared,
+      () => hydrateDmsSharedProps(props.value.shared),
+      { flush: "sync" },
+    );
     // The session, not the page props: a page restored from history or from
     // the prefetch cache carries the user as it was when it was fetched, and
     // would switch the interface back to a language the user has left. A
@@ -178,7 +213,7 @@ const DmsPersistentLayout = defineComponent({
       },
       { immediate: true, flush: "sync" },
     );
-    const currentError = useError();
+    const currentError = useDmsError();
     const overlays = useDmsState<string[]>("dms-app-overlays", () => []);
     return () => {
       const error = currentError.value ?? props.value.error;
@@ -206,7 +241,7 @@ export function resolveDmsInertiaPage(): Component {
 
 function renderDmsPage(
   props: DmsPageProps,
-  capturedError: DmsPageProps["error"] = useError().value,
+  capturedError: DmsPageProps["error"] = useDmsError().value,
 ) {
   const error = capturedError ?? props.error;
   const page = error
@@ -251,16 +286,21 @@ function mergeDmsAppConfig(): void {
   mergeUiAppConfig(useAppConfig(), useDmsAppConfig());
 }
 
+/**
+ * Development only: applies the layers' app configs, edited while the page is
+ * open, to the DMS app config and to Nuxt UI's, both in place, so the
+ * components reading them and Nuxt UI's colors follow without a reload.
+ */
+export function applyLayerAppConfigs(appConfigs: DmsLayerAppConfig[]): void {
+  updateDmsAppConfig(appConfigs);
+  mergeUiAppConfig(useAppConfig(), useDmsAppConfig(), { isChanged: true });
+}
+
 export async function configureDmsApp(
   options: DmsAppOptions,
 ): Promise<DmsConfiguredApp> {
   mergeDmsAppConfig();
-  const runtime =
-    options.runtime ??
-    createDmsFrontendRuntime(
-      options.serverFetch as typeof import("ofetch").ofetch,
-      readServerRendered<Record<string, unknown>>(SSR_ASYNC_DATA_ID, {}),
-    );
+  const runtime = options.runtime ?? createBrowserRuntime(options.serverFetch);
   // The signed-in user's language, else the one this browser picked, which is
   // how a visitor's choice on a public page survives a reload.
   const locale =
@@ -289,6 +329,8 @@ export async function configureDmsApp(
   if (typeof window !== "undefined") {
     const toast = options.app.runWithContext(() => useToast());
     showNetworkErrors(toast.add, i18n.global);
+    preloadPrefetchedDmsPages();
+    options.app.runWithContext(keepSharedOverHistory);
   }
   // Resolve, before the app mounts, every async component the server
   // rendered: the page, its layout, and the components the render reached.
@@ -309,4 +351,4 @@ export async function configureDmsApp(
   return { mounted, runtime };
 }
 
-export { serializeDmsAsyncData, trackDmsAsyncComponents };
+export { trackDmsAsyncComponents };

package/templates/vue/client-server-guard.mjs

@@ -0,0 +1,73 @@
+// Keeping server code out of the browser.
+//
+// A module's `dms.server.ts` and the files under its `server/` directories run
+// in the generated server only: they read private options, sign tokens, talk
+// to the backend with its secrets. A client file that imports one of them,
+// even statically and through an alias, would ship that code in the client
+// bundle. Rollup's manifest only lists entries and dynamic imports, so a check
+// on the built output misses a static import; the guard sits in the module
+// graph instead, where every resolved file passes.
+//
+// Kept beside vite.config.ts rather than inside it so the plugin can be
+// exercised on its own, the way head-order.mjs is.
+
+import { relative, sep } from "node:path";
+
+const SERVER_ENTRY = /(?:^|[\\/])dms\.server\.[cm]?[jt]sx?$/;
+
+function stripQuery(id) {
+  const query = id.indexOf("?");
+  return query === -1 ? id : id.slice(0, query);
+}
+
+function insideModuleServerDirectory(file, moduleRoots) {
+  return moduleRoots.some((root) => {
+    const path = relative(root, file);
+    if (!path || path.startsWith("..") || path.startsWith(sep)) return false;
+    const segments = path.split(/[\\/]/);
+    return segments.slice(0, -1).includes("server");
+  });
+}
+
+/**
+ * Whether `id`, a resolved module id, is server code: a module's server entry
+ * (`dms.server.*`) or a file under a `server/` directory of a module. Installed
+ * packages never are: `node_modules` has its own `server` directories.
+ */
+export function isServerSource(id, moduleRoots) {
+  if (id.startsWith("\0")) return false;
+  const file = stripQuery(id);
+  if (/[\\/]node_modules[\\/]/.test(file)) return false;
+  return (
+    SERVER_ENTRY.test(file) || insideModuleServerDirectory(file, moduleRoots)
+  );
+}
+
+/**
+ * Fail a client build, and a client request in development, that loads server
+ * code. Server-side rendering and the server modules build load it through
+ * SSR, which the guard leaves alone.
+ */
+export function rejectServerSourcesInClient(moduleRoots) {
+  let ssrBuild = false;
+  return {
+    name: "dms-reject-server-sources-in-client",
+    enforce: "pre",
+    configResolved(config) {
+      ssrBuild = Boolean(config.build.ssr);
+    },
+    load(id, options) {
+      if (ssrBuild || options?.ssr) return null;
+      if (!isServerSource(id, moduleRoots)) return null;
+      const importers = this.getModuleInfo?.(id)?.importers ?? [];
+      const from = importers.length
+        ? ` (imported by ${importers.join(", ")})`
+        : "";
+      this.error(
+        `Server code in the client bundle: ${stripQuery(id)}${from}. ` +
+          "A dms.server.ts and the files under a module's server/ directory " +
+          "run in the server only; import them from a dms.server.ts, never from client code.",
+      );
+    },
+  };
+}

package/templates/vue/email-renderer.ts

@@ -2,6 +2,7 @@ import { renderToString } from "@vue/server-renderer";
 import { defu } from "defu";
 import { type Component, createSSRApp, h } from "vue";
 import { createI18n } from "vue-i18n";
+import { appConfigs } from "./app-configs.generated";
 import moduleRegistry from "./generated-frontend-modules.json";
 import { loadEmailLocaleMessages } from "./email-locales";
 import { stripSsrMarkers } from "./email-markup";
@@ -28,6 +29,21 @@ const orderedRegistries = moduleRegistry.modules
   .map((module) => registries[`/frontend-modules/${module.id}/dms.email.ts`])
   .filter((registry): registry is EmailRegistry => Boolean(registry));
 
+/**
+ * Every app config an email reads, highest precedence first: module by module,
+ * by descending priority, what its `dms.email.ts` declares for emails, then
+ * its layers' `app/app.config.ts`. A higher-priority module's layers still
+ * override a lower one's email config, and a module's own email config, the
+ * more specific of its two, keeps the values it gave emails before the layers'
+ * configs applied to them.
+ */
+const emailAppConfigs = moduleRegistry.modules.flatMap((module) => [
+  registries[`/frontend-modules/${module.id}/dms.email.ts`]?.appConfig ?? {},
+  ...appConfigs
+    .filter((layer) => layer.module === module.id)
+    .map((layer) => layer.config),
+]);
+
 function templateEntries(): Array<[string, () => Promise<EmailModule>]> {
   return orderedRegistries.flatMap((registry) =>
     Object.entries(registry.serverEmailTemplates),
@@ -138,10 +154,7 @@ export async function renderEmail(
     }),
   );
   app.provide("dmsEmailLocale", locale);
-  app.provide(
-    "dmsEmailAppConfig",
-    defu({}, ...orderedRegistries.map((registry) => registry.appConfig ?? {})),
-  );
+  app.provide("dmsEmailAppConfig", defu({}, ...emailAppConfigs));
   const publicConfig = defu(
     {},
     ...moduleRegistry.modules.map((module) => module.options),

package/templates/vue/email-runtime.ts

@@ -16,7 +16,7 @@ export function useDmsRuntimeConfig(): EmailRuntimeConfig {
   });
 }
 
-export function defineAppConfig<T extends Record<string, unknown>>(
+export function defineDmsAppConfig<T extends Record<string, unknown>>(
   config: T,
 ): T {
   return config;