@morphemecms/cms 0.10.1-next-20261105180809 → 0.11.0

package/CHANGELOG.md

@@ -1,6 +1,17 @@
 # @morphemecms/cms
 
-## 0.10.1-next-20261105180809
+## 0.11.0
+
+### Minor Changes
+
+- 999d21e: Save notices name the version: app installs, and an app's settings through `changedTo`.
+
+### Patch Changes
+
+- 5a64119: Sites type-check again: the block side sheet's save button narrows to the fields step before it reads the block's type, so `BlockDialog.tsx` no longer fails `tsc` in a site.
+- 4d4d32a: Sites type-check again: the types of `searchedAs` and `pageTitle` make every input optional except `site`, so the share preview no longer fails `tsc` in a site.
+
+## 0.10.1
 
 ### Patch Changes
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@morphemecms/cms",
-  "version": "0.10.1-next-20261105180809",
+  "version": "0.11.0",
   "description": "Morpheme CMS: the editor for a site built with Astro, its screens, its blocks and the rules a site gives it. See README.md.",
   "license": "MIT",
   "author": "Lars Adolfsen",

package/src/AppList.tsx

@@ -118,6 +118,7 @@ export function appSettingsPart(app: SiteApp): Part | null {
     fields: app.settings.fields,
     defaults: app.settings.values,
     commit: siteT.apps.settingsOf(asWritten(app).label),
+    changedTo: app.settings.changedTo,
     back: home ? { href: `#${home.route}`, label: home.label } : { href: appHref(app), label: app.label },
   };
 }
@@ -726,7 +727,7 @@ function useStoreActions(env: Env, files: RepoFile[]) {
           busy: t.apps.installing,
           done: t.apps.isInstalledSoon(app.label),
           commit: siteT.apps.commit.install(app.written),
-          change: t.app.changes.installed(kindAndName(t.app.changes.app, app.label)),
+          change: t.app.changes.installed(kindAndName(t.app.changes.app, app.label), app.version),
         },
         async () => ({ files: await env.store.files(app), record: recordOf(app) }),
       ),

package/src/BlockDialog.tsx

@@ -372,7 +372,7 @@ export function useBlockDialog(
         className={kind === 'standard' ? 'editor-side-sheet' : undefined}
         actions={
           <>
-            <Button onClick={() => (open.step === 'section' ? saveSection() : save(open.type))}>
+            <Button onClick={() => (open.step === 'fields' ? save(open.type) : saveSection())}>
               {open.step === 'fields' && open.isNew ? t.blocks.insert : t.common.save}
             </Button>
             <Button kind="outlined" onClick={() => void leave()}>

package/src/CompanyForm.tsx

@@ -5,6 +5,7 @@
 // app's settings, AppList.tsx appSettingsPart). A field with its choices on a page of their own (Field.page: an app's
 // "Variant") has it at the form's address with its name after it (`at`, `page`, App.tsx): the form stays open under it
 // with what is in it, saved or not (useFieldPages), a choice there goes back to it, and it comes back where it was.
+// A save says what it changed through partChange.ts ("… set to <value>" when the part has `changedTo`).
 // Exposes CompanyForm and usePartForm; the fields (with the block preview) are PartFields.tsx, a field's page PartFieldPage.tsx,
 // the providers around them PartFormProviders.tsx.
 import { useState } from 'react';
@@ -14,6 +15,7 @@ import PartFields, { hasPreview } from './PartFields';
 import PartFieldPage from './PartFieldPage';
 import PartFormProviders from './PartFormProviders';
 import { useFieldPages } from './useFieldPages';
+import { partChange } from './partChange';
 import type { Part } from './schema';
 import { clean, problemAt } from './check';
 import { useWrongField, type FieldContext } from './fields';
@@ -69,10 +71,16 @@ export function usePartForm({ part, env, files }: Props) {
     if (kept) return notify(kept);
     const message = siteT.company.commit.edit(part.commit ?? asWritten(part).label.toLowerCase());
     const changes = [{ path, content: text, oid: base.oid || null }];
-    const change = t.app.changes.edited(lower(part.label));
     setSaving(true);
     notify({ text: t.common.saving });
     try {
+      const change = await partChange(
+        lower(part.label),
+        cleaned,
+        part.changedTo,
+        { api: (p, init) => env.appApi(part.id, p, init) },
+        t.app.changes,
+      );
       const oids = await env.commit(message, changes, change);
       const saved = { path, oid: oids[path], text };
       setBase(saved);

package/src/apps.ts

@@ -55,6 +55,9 @@ export type AppSettings = {
   /** Made-up settings over `values`, which its blocks and kinds are drawn with under "Dele" (exampleData in
    * examples.ts), where the site's own are never shown (MobilePay's number). */
   example?: Record<string, unknown>;
+  /** The value a save of these settings sets, said in the notice after it ("CMS-version set to 0.10.0"), asked with the
+   * saved values and the app's own addresses in the Worker (`api`); undefined, or a failure, says "CMS-version changed". */
+  changedTo?: (values: Record<string, unknown>, props: AppPageProps) => Promise<string | undefined>;
 };
 export const defineSettings = (settings: AppSettings) => settings;
 

package/src/googleResult.d.mts

@@ -1,17 +1,29 @@
-/** The page's own title as the site writes it in <title> when it has no Google title. */
+/**
+ * The page's own title as the site writes it in <title> when it has no Google title.
+ * @param {{ title?: string | null; front?: boolean; siteName?: string | null }} input
+ * @returns {string}
+ */
 export function pageTitle({ title, front, siteName }: {
-    title: any;
-    front?: boolean | undefined;
-    siteName: any;
+    title?: string | null;
+    front?: boolean;
+    siteName?: string | null;
 }): string;
-/** The title and description a Google result shows for the page. `site`: { name, description }. */
+/**
+ * The title and description a Google result shows for the page. `site`: { name, description }.
+ * @param {{ title?: string | null; front?: boolean; seoTitle?: string | null; seoDescription?: string | null;
+ *   description?: string | null; site: { name?: string | null; description?: string | null } }} input
+ * @returns {{ title: string; description: string }}
+ */
 export function searchedAs({ title, front, seoTitle, seoDescription, description, site }: {
-    title: any;
-    front?: boolean | undefined;
-    seoTitle: any;
-    seoDescription: any;
-    description: any;
-    site: any;
+    title?: string | null;
+    front?: boolean;
+    seoTitle?: string | null;
+    seoDescription?: string | null;
+    description?: string | null;
+    site: {
+        name?: string | null;
+        description?: string | null;
+    };
 }): {
     title: string;
     description: string;

package/src/googleResult.mjs

@@ -6,7 +6,11 @@ const SEPARATOR = ' › ';
 
 const text = (s) => String(s ?? '').trim();
 
-/** The page's own title as the site writes it in <title> when it has no Google title. */
+/**
+ * The page's own title as the site writes it in <title> when it has no Google title.
+ * @param {{ title?: string | null; front?: boolean; siteName?: string | null }} input
+ * @returns {string}
+ */
 export function pageTitle({ title, front = false, siteName }) {
   const own = text(title);
   if (!own) return String(siteName ?? '');
@@ -14,7 +18,12 @@ export function pageTitle({ title, front = false, siteName }) {
   return `${own} | ${siteName ?? ''}`;
 }
 
-/** The title and description a Google result shows for the page. `site`: { name, description }. */
+/**
+ * The title and description a Google result shows for the page. `site`: { name, description }.
+ * @param {{ title?: string | null; front?: boolean; seoTitle?: string | null; seoDescription?: string | null;
+ *   description?: string | null; site: { name?: string | null; description?: string | null } }} input
+ * @returns {{ title: string; description: string }}
+ */
 export function searchedAs({ title, front = false, seoTitle, seoDescription, description, site }) {
   const resultTitle = text(seoTitle) || pageTitle({ title, front, siteName: site.name });
   const resultDescription = text(seoDescription) || text(description) || String(site.description ?? '');

package/src/i18n/da-DK/app.ts

@@ -11,6 +11,7 @@ export const app: Messages['app'] = {
   changes: {
     named: (kind, name) => `${kind} “${name}”`,
     edited: (what) => `${what} ændret`,
+    setTo: (what, value) => `${what} sat til ${value}`,
     created: (what) => `${what} oprettet`,
     added: (what) => `${what} tilføjet`,
     deleted: (what) => `${what} slettet`,
@@ -21,7 +22,7 @@ export const app: Messages['app'] = {
     turnedOn: (what) => `${what} slået til`,
     turnedOff: (what) => `${what} slået fra`,
     chosen: (what) => `${what} valgt`,
-    installed: (what) => `${what} installeret`,
+    installed: (what, version) => (version ? `${what} ${version} installeret` : `${what} installeret`),
     updated: (what, version) => `${what} opdateret til ${version}`,
     uninstalled: (what) => `${what} afinstalleret`,
     more: (count) => (count === 1 ? '1 ændring mere' : `${count} ændringer mere`),

package/src/i18n/en-US/app.ts

@@ -15,6 +15,7 @@ export const app = {
   changes: {
     named: (kind: string, name: string) => `${kind} “${name}”`,
     edited: (what: string) => `${what} changed`,
+    setTo: (what: string, value: string) => `${what} set to ${value}`,
     created: (what: string) => `${what} created`,
     added: (what: string) => `${what} added`,
     deleted: (what: string) => `${what} deleted`,
@@ -25,7 +26,7 @@ export const app = {
     turnedOn: (what: string) => `${what} turned on`,
     turnedOff: (what: string) => `${what} turned off`,
     chosen: (what: string) => `${what} chosen`,
-    installed: (what: string) => `${what} installed`,
+    installed: (what: string, version?: string) => (version ? `${what} ${version} installed` : `${what} installed`),
     updated: (what: string, version: string) => `${what} updated to ${version}`,
     uninstalled: (what: string) => `${what} uninstalled`,
     /** After the first three. */

package/src/partChange.test.mjs

@@ -0,0 +1,44 @@
+// Tests for src/partChange.ts: the text of a part's save, with or without the value its `changedTo` gives.
+// Run: node --test src/partChange.test.mjs
+import assert from 'node:assert/strict';
+import { test } from 'node:test';
+import { partChange } from './partChange.ts';
+
+const texts = { edited: (what) => `${what} changed`, setTo: (what, value) => `${what} set to ${value}` };
+const props = { api: async () => new Response('') };
+const run = (changedTo) => partChange('cms-version', {}, changedTo, props, texts);
+
+test('no hook says changed', async () => {
+  assert.equal(await run(undefined), 'cms-version changed');
+});
+
+test('a value says set to it', async () => {
+  assert.equal(await run(async () => '0.10.0'), 'cms-version set to 0.10.0');
+});
+
+test('an undefined value says changed', async () => {
+  assert.equal(await run(async () => undefined), 'cms-version changed');
+});
+
+test('an empty value says changed', async () => {
+  assert.equal(await run(async () => ''), 'cms-version changed');
+});
+
+test('a throw says changed', async () => {
+  assert.equal(
+    await run(async () => {
+      throw new Error('x');
+    }),
+    'cms-version changed',
+  );
+});
+
+test('the hook gets the values and the api', async () => {
+  const calls = [];
+  const values = { a: 1 };
+  await partChange('x', values, async (...args) => void calls.push(args), props, texts);
+  assert.equal(calls.length, 1);
+  assert.equal(calls[0][0], values);
+  assert.equal(calls[0][1], props);
+  assert.equal(typeof calls[0][1].api, 'function');
+});

package/src/partChange.ts

@@ -0,0 +1,24 @@
+// The text of a part's save (CompanyForm.tsx usePartForm): "<label> set to <value>" or "<label> changed".
+// Exposes partChange. Depends only on types, so it runs under node --test; the texts come in as `texts` (t.app.changes).
+import type { AppPageProps } from './apps';
+import type { Part } from './schema';
+
+/** The texts it needs, from `t.app.changes`. */
+export type ChangeTexts = { edited: (what: string) => string; setTo: (what: string, value: string) => string };
+
+/** The text of a part's save: "<label> set to <value>" with the value its `changedTo` gives, else "<label> changed".
+ * `what` is the part's label as it stands in a sentence (lower). A throw, a rejection, no value or an empty one gives
+ * "changed". */
+export async function partChange(
+  what: string,
+  values: Record<string, unknown>,
+  changedTo: Part['changedTo'],
+  props: AppPageProps,
+  texts: ChangeTexts,
+): Promise<string> {
+  try {
+    const value = await changedTo?.(values, props);
+    if (value) return texts.setTo(what, value);
+  } catch {}
+  return texts.edited(what);
+}

package/src/schema.ts

@@ -8,6 +8,7 @@ import type { Icon } from '@phosphor-icons/react';
 import type { ComponentType, ReactNode } from 'react';
 import type { BlockData } from './blocks';
 import type { AppCategory } from './store';
+import type { AppPageProps } from './apps';
 import type { SiteData } from '@site/editor';
 import { locale } from './i18n';
 
@@ -385,6 +386,10 @@ export type Part = {
   /** What the commit says was edited, in the site's language, when not its name in lower case (an
    * app's settings, AppList.tsx: "indstillinger for Mailchimp"). */
   commit?: string;
+  /** The value a save of its fields sets, said in the notice after it ("CMS-version set to 0.10.0"), asked with the saved
+   * values and the app's own addresses in the Worker (`api`); undefined, or a failure, says "CMS-version changed"
+   * (partChange.ts). An app's settings copy it from AppSettings.changedTo (AppList.tsx appSettingsPart). */
+  changedTo?: (values: Record<string, unknown>, props: AppPageProps) => Promise<string | undefined>;
   /** Parts of its own, instead of fields: a row that opens a screen with them, each at
    * #<screen>/<id>/<part> and going back to it ("Virksomheden" › "Betaling" with "Bank"). */
   parts?: Part[];

package/starter/package.json

@@ -32,7 +32,7 @@
     "@material-symbols/svg-400": "0.48.2",
     "@material/material-color-utilities": "^0.3.0",
     "@milkdown/kit": "^7.22.3",
-    "@morphemecms/cms": "0.10.0",
+    "@morphemecms/cms": "0.11.0",
     "@phosphor-icons/core": "^2.1.1",
     "@phosphor-icons/react": "^2.1.10",
     "@tailwindcss/typography": "^0.5.20",