@antelopejs/dms-mailing 0.7.1 → 0.8.0

package/frontend-vue/app/components/editor/EditorWorkspace.vue

@@ -11,7 +11,6 @@ import {
 	useEditorShortcuts,
 } from '../../composables/useEditorShortcuts'
 import { createEditorState } from '../../composables/useTemplateEditor'
-import { apiErrorMessage } from '../../utils/api-error'
 
 interface Props {
 	loaded: TemplateContentResponse
@@ -23,8 +22,7 @@ const props = defineProps<Props>()
 const locale = defineModel<string | null>('locale', { default: null })
 const emit = defineEmits<{ renamed: [string] }>()
 
-const toast = useToast()
-const { processApiMessage } = useTranslation()
+const { presentError } = useApiErrorPresenter()
 const { uniqueLocales } = useUniqueLocales()
 const api = useMailingApi()
 
@@ -44,10 +42,7 @@ const editor = createEditorState(
 )
 
 function reportFailure(error: unknown): void {
-	toast.add({
-		color: 'error',
-		title: processApiMessage(apiErrorMessage(error)),
-	})
+	presentError(error, { fallbackKey: 'error.500.description' })
 }
 
 const reads = useEditorReads(props.templateId)

package/frontend-vue/build/backend-boundary.ts

@@ -0,0 +1,122 @@
+import { existsSync, readFileSync, realpathSync } from 'node:fs'
+import { dirname, isAbsolute, join, relative, sep } from 'node:path'
+import type { DmsVitePluginEntry } from '#dms/frontend-build'
+
+type VitePlugin = Extract<DmsVitePluginEntry, { name: string }>
+
+const BACKEND_PACKAGE = '@antelopejs/dms-mailing'
+const BACKEND_SOURCE = 'src'
+const QUERY_OR_HASH = /[?#].*$/
+
+const backendRoots = new Map<string, string | null>()
+
+/** Whether a parsed manifest names its package. */
+function isNamedManifest(value: unknown): value is { name: string } {
+	return (
+		typeof value === 'object' &&
+		value !== null &&
+		'name' in value &&
+		typeof value.name === 'string'
+	)
+}
+
+/** The package name a `package.json` declares, or `undefined`. */
+function packageName(manifest: string): string | undefined {
+	try {
+		const parsed: unknown = JSON.parse(readFileSync(manifest, 'utf8'))
+		return isNamedManifest(parsed) ? parsed.name : undefined
+	} catch {
+		return undefined
+	}
+}
+
+/** The directory of the backend package that holds `directory`, or null. */
+function backendRoot(directory: string): string | null {
+	const known = backendRoots.get(directory)
+	if (known !== undefined) {
+		return known
+	}
+	const manifest = join(directory, 'package.json')
+	const parent = dirname(directory)
+	let root: string | null = null
+	if (existsSync(manifest)) {
+		root = packageName(manifest) === BACKEND_PACKAGE ? directory : null
+	} else if (parent !== directory) {
+		root = backendRoot(parent)
+	}
+	backendRoots.set(directory, root)
+	return root
+}
+
+/**
+ * The real path of a resolved module id when it lies under the `src`
+ * directory of the backend package, or `undefined`. The package that owns the
+ * file decides, not a path, so the answer is the same in the repository and in
+ * the build workspace. Virtual ids and ids that are not files are ignored.
+ */
+function backendSourceFile(id: string): string | undefined {
+	const path = id.replace(QUERY_OR_HASH, '')
+	if (!isAbsolute(path)) {
+		return undefined
+	}
+	let real: string
+	try {
+		real = realpathSync(path)
+	} catch {
+		return undefined
+	}
+	const root = backendRoot(dirname(real))
+	if (root === null) {
+		return undefined
+	}
+	return relative(root, real).split(sep)[0] === BACKEND_SOURCE
+		? real
+		: undefined
+}
+
+/**
+ * Fails the build and the dev server when a module of the frontend resolves to
+ * a file under the `src` of the backend package: the browser reaches the
+ * backend only through its HTTP interface. It checks what the whole resolution
+ * chain returns, an id marked external included, so an alias is seen through
+ * and a symlink the resolver returns is followed to its real path, and it runs
+ * before the other plugins (`enforce: "pre"`). Vite builds workers with their
+ * own plugin list, so the plugin adds itself there too.
+ *
+ * antelopejs-sync writes this file from `@antelopejs/tooling-configs` and
+ * restores it on every run: change the plugin in the pack, not here.
+ */
+export function backendBoundary(): VitePlugin {
+	return {
+		...boundaryCheck(),
+		config: () => ({ worker: { plugins: () => [boundaryCheck()] } }),
+	}
+}
+
+/** The check alone, as a worker build runs it. */
+function boundaryCheck(): VitePlugin {
+	return {
+		name: `${BACKEND_PACKAGE}:backend-boundary`,
+		enforce: 'pre',
+		async resolveId(source, importer, options) {
+			const resolved = await this.resolve(source, importer, {
+				...options,
+				skipSelf: true,
+			})
+			if (resolved === null) {
+				return resolved
+			}
+			const file = backendSourceFile(resolved.id)
+			if (file === undefined) {
+				return resolved
+			}
+			const from =
+				importer === undefined
+					? 'an entry point'
+					: importer.replace(QUERY_OR_HASH, '')
+			return this.error(
+				`Backend boundary: ${from} imports ${file}, which is under the src of ${BACKEND_PACKAGE}. The frontend reaches the backend only through its HTTP interface.`,
+			)
+		},
+	}
+}

package/frontend-vue/dms.frontend.build.ts

@@ -0,0 +1,7 @@
+import { defineDmsFrontendBuild } from '#dms/frontend-build'
+import { backendBoundary } from './build/backend-boundary.ts'
+
+/** The build of the frontend module: the backend boundary in every build. */
+export default defineDmsFrontendBuild((build) => {
+	build.registerVitePlugins(() => [backendBoundary()])
+})

package/frontend-vue/eslint.config.mjs

@@ -1,3 +1,5 @@
+import antiSlop from '@antelopejs/tooling-configs/oxc/anti-slop'
+import guardrails from '@antelopejs/tooling-configs/oxc/guardrails'
 import vue from 'eslint-plugin-vue'
 import ts from 'typescript-eslint'
 
@@ -10,4 +12,15 @@ export default [
 		rules: { 'vue/multi-word-component-names': 'off' },
 	},
 	{ files: ['**/*.ts'], languageOptions: { parser: ts.parser } },
+	{
+		files: ['tests/**/*.ts'],
+		plugins: { antelopejs: guardrails, 'anti-slop': antiSlop },
+		rules: {
+			'antelopejs/no-fs-read-in-tests': 'error',
+			'antelopejs/no-constant-value-assertion': 'error',
+			'antelopejs/no-typeof-function-only-test': 'error',
+			'antelopejs/no-self-import-in-tests': 'error',
+			'anti-slop/no-module-mocking': 'error',
+		},
+	},
 ]

package/frontend-vue/package.json

@@ -6,11 +6,11 @@
 	"license": "Apache-2.0",
 	"packageManager": "pnpm@10.2.0",
 	"engines": {
-		"@antelopejs/dms-frontend": ">=0.9.0 <0.10.0"
+		"@antelopejs/dms-frontend": ">=0.9.1 <0.10.0"
 	},
 	"scripts": {
 		"format": "prettier --write .",
-		"lint": "eslint .",
+		"lint": "eslint . && node --input-type=module -e \"import { assertApiErrorPresentation } from '@antelopejs/dms/checks/api-error-presentation'; assertApiErrorPresentation(['app']);\"",
 		"lint:fix": "eslint . --fix",
 		"test": "vitest run"
 	},
@@ -21,12 +21,14 @@
 		"vue": "^3.5.18"
 	},
 	"devDependencies": {
+		"@antelopejs/tooling-configs": "^0.2.12",
 		"@nuxt/ui": "4.10.0",
 		"@vitejs/plugin-vue": "^6.0.0",
 		"@vitest/runner": "^4.1.5",
 		"eslint": "^9.0.0",
 		"eslint-plugin-vue": "^10.0.0",
 		"typescript-eslint": "^8.0.0",
+		"vite": "^8.2.2",
 		"jsdom": "^26",
 		"prettier": "^3.5.3",
 		"prettier-plugin-tailwindcss": "^0.6.11",