@morphemecms/cms 0.4.0 → 0.5.0-next-20261104215254

package/site/theme.test.mjs

@@ -0,0 +1,54 @@
+// Tests of allIconsModule (site/theme.mjs): all Phosphor's icons as one module, read one file at a time.
+// Run with `node --test site/theme.test.mjs`.
+import { strict as assert } from 'node:assert';
+import { mkdtempSync, writeFileSync } from 'node:fs';
+import { registerHooks } from 'node:module';
+import { tmpdir } from 'node:os';
+import { join } from 'node:path';
+import { test } from 'node:test';
+
+// theme.mjs imports this package by its name, which only works from an installed copy: point the name at this folder.
+const PACKAGE = '@morphemecms/cms/';
+const pkg = new URL('../', import.meta.url);
+registerHooks({
+  resolve: (specifier, context, next) =>
+    specifier.startsWith(PACKAGE) ? next(new URL(specifier.slice(PACKAGE.length), pkg).href, context) : next(specifier, context),
+});
+const { allIconsModule } = await import('./theme.mjs');
+
+const PREFIX = '/node_modules/@phosphor-icons/core/assets/regular/';
+const A = '<svg viewBox="0 0 1 1"><path d="A"/></svg>';
+const B = '<svg viewBox="0 0 2 2"><path d="B"/></svg>';
+
+const folder = mkdtempSync(join(tmpdir(), 'icons-'));
+writeFileSync(join(folder, 'a.svg'), A);
+writeFileSync(join(folder, 'b.svg'), B);
+writeFileSync(join(folder, 'c.txt'), 'not an icon');
+
+const parse = (code) => JSON.parse(code.slice('export const allIcons = '.length, -1));
+
+test('the keys are the files, as import.meta.glob gave them', () => {
+  assert.deepEqual(Object.keys(parse(allIconsModule(folder, {}))), [`${PREFIX}a.svg`, `${PREFIX}b.svg`]);
+});
+
+test("Phosphor's icons are the file text, unchanged", () => {
+  assert.deepEqual(parse(allIconsModule(folder, {})), { [`${PREFIX}a.svg`]: A, [`${PREFIX}b.svg`]: B });
+});
+
+test("a theme's icon is in Phosphor's place", () => {
+  const themed = '<svg viewBox="0 0 10 10"><path d="M0 0"/></svg>';
+  const all = parse(allIconsModule(folder, { a: themed }));
+  assert.equal(
+    all[`${PREFIX}a.svg`],
+    '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10" fill="currentColor"><path d="M0 0"/></svg>',
+  );
+  assert.equal(all[`${PREFIX}b.svg`], B);
+});
+
+test('a file that is not an svg has no key', () => {
+  assert.ok(!Object.keys(parse(allIconsModule(folder, {}))).some((k) => k.endsWith('c.txt')));
+});
+
+test('the code is a module that exports allIcons', () => {
+  assert.ok(allIconsModule(folder, {}).startsWith('export const allIcons = '));
+});

package/src/AppList.tsx

@@ -98,6 +98,9 @@ import { config } from '@site/editor';
 import { allThemes, ThemeRow, themeInstalled, useThemeCatalog } from './ThemeStore';
 import { siteT, siteText, t } from './i18n';
 import { OwnerLicenses, StoreLicenseRows } from './Licenses';
+import { StoreConnectNotice } from './StoreConnectNotice';
+import { StoreConnectedRow } from './StoreConnectedRow';
+import { connection, type StoreConnection } from './storeConnection';
 import { appType, setOn, told, useNotificationChoices } from './notificationData';
 import { kindAndName } from './deploy';
 
@@ -594,8 +597,18 @@ export function DeveloperRow({ name }: { name: string }) {
  * and those installed, each with its version and who made it; each opening its page. With search (by name, what it
  * does, who made it and the words it is found by, in both languages), the order and the filters by category (apps)
  * and by whether it is installed, each picked one as a chip. */
-export function StorePage({ env, files, tab }: { env: Env; files: RepoFile[]; tab: 'apps' | 'themes' }) {
+export function StorePage(props: { env: Env; files: RepoFile[]; tab: 'apps' | 'themes' }) {
+  // Connecting or disconnecting draws the screen again from the start, so the catalogs and the key are asked again.
+  const [round, setRound] = useState(0);
+  return <StoreScreen key={round} {...props} again={() => setRound((r) => r + 1)} />;
+}
+
+function StoreScreen({ env, files, tab, again }: { env: Env; files: RepoFile[]; tab: 'apps' | 'themes'; again: () => void }) {
   const installed = installedApps(files);
+  const [key, setKey] = useState<StoreConnection | null>(null);
+  useEffect(() => {
+    connection().then(setKey, () => {});
+  }, []);
   const catalog = useCatalog(env);
   const themeCatalog = useThemeCatalog(env);
   const connected = useStoreConnected(env);
@@ -689,7 +702,7 @@ export function StorePage({ env, files, tab }: { env: Env; files: RepoFile[]; ta
       )}
       {/* The site's own are shown also when the store cannot be read. */}
       {connected === false ? (
-        <EmptyNote>{t.apps.noStore}</EmptyNote>
+        <StoreConnectNotice mayChange={key?.mayChange ?? false} onConnected={again} />
       ) : read === null || connected === null ? (
         <EmptyNote busy>{t.apps.loadingStore}</EmptyNote>
       ) : read === 'failed' ? (
@@ -714,6 +727,7 @@ export function StorePage({ env, files, tab }: { env: Env; files: RepoFile[]; ta
           </Group>
         ))
       )}
+      {key?.connected && key.by === 'button' && key.mayChange && <StoreConnectedRow site={key.site} onDisconnected={again} />}
     </Screen>
   );
 }

package/src/CmsVersion.tsx

@@ -0,0 +1,14 @@
+// The CMS's version as plain text on the start screen's status line; a pre-release's short form swaps to the full version on a click.
+// Exposes CmsVersion. Depends on cmsVersionView.mjs (shortVersion), SwapText and package.json's version.
+import { version } from '../package.json';
+import { shortVersion } from './cmsVersionView.mjs';
+import { SwapText } from './SwapText';
+import { t } from './i18n';
+
+// A release shows its version as it is: plain text. A pre-release shows it short; clicking swaps it to the full version, with
+// the build stamp, in place. `title` shows the full version on mouse hover. No tooltip: the phone's status line clips overflow.
+export function CmsVersion() {
+  const short = shortVersion(version) as string;
+  if (short === version) return <>{t.library.cmsVersion(version)}</>;
+  return <SwapText text={t.library.cmsVersion(short)} swapped={t.library.cmsVersion(version)} title={version} />;
+}

package/src/Library.tsx

@@ -33,6 +33,7 @@ import { byText, entryData, type Collection, type Part, type PartScreen } from '
 import { config, countsOf, header, relationsOf, siteName } from '@site/editor';
 import { iconPack, iconPacks } from './iconPacks';
 import { theme, themes, type ThemeInfo } from './themes';
+import { StartStatus } from './StartStatus';
 import {
   appearance,
   backFrom,
@@ -155,14 +156,14 @@ function PartRow({ id, label, href, count }: { id: string } & ReturnType<typeof
   return <ListItem href={href} icon={icons[id]} headline={label} count={count} arrow />;
 }
 
-// The start screen, with when the site was last updated (built on Cloudflare, App.tsx) under the title;
+// The start screen, with the CMS version and when the site was last updated (StartStatus.tsx) under the title;
 // on a computer the groups two side by side.
 export function Start({ files, builtAt }: { files: RepoFile[]; builtAt: Date | null }) {
   return (
     <Screen
       title={siteName}
       wide
-      status={builtAt ? t.library.siteUpdated(when(builtAt, { short: true })) : undefined}
+      status={<StartStatus builtAt={builtAt} />}
       // The notifications, the settings and the account in the top bar, on a phone too (Screen.tsx).
       home
     >

package/src/StartStatus.tsx

@@ -0,0 +1,24 @@
+// The start screen's status line: from expanded up the CMS version, a separator and the update time; below it (a phone) only the
+// update time, which a tap swaps for the short version. Exposes StartStatus. Depends on CmsVersion, SwapText, when and i18n.
+import { CmsVersion } from './CmsVersion';
+import { SwapText } from './SwapText';
+import { shortVersion } from './cmsVersionView.mjs';
+import { version } from '../package.json';
+import { t } from './i18n';
+import { when } from './when';
+
+// Screen.tsx draws the status twice, but only one place shows at a width; both forms are here, switched with the M3 breakpoint
+// classes (`expanded:`), never a width of their own.
+export function StartStatus({ builtAt }: { builtAt: Date | null }) {
+  const cms = t.library.cmsVersion(shortVersion(version) as string);
+  const updated = builtAt ? t.library.siteUpdated(when(builtAt, { short: true })) : null;
+  return (
+    <>
+      <span className="expanded:inline hidden">
+        <CmsVersion />
+        {updated && `${t.library.statusSeparator}${updated}`}
+      </span>
+      <span className="expanded:hidden">{updated ? <SwapText text={updated} swapped={cms} /> : cms}</span>
+    </>
+  );
+}

package/src/StoreConnectNotice.tsx

@@ -0,0 +1,34 @@
+// The box in "Appstore" for a site without a key to the store: the button "Connect to Morpheme", or a note for editors who may only read.
+// Exposes StoreConnectNotice({ mayChange, onConnected }); uses Notice, Button, EmptyNote (ui.tsx), snackbar (lib/snackbar.ts) and connect (storeConnection.ts).
+import { useState } from 'react';
+import { snackbar } from '../lib/snackbar';
+import { connect } from './storeConnection';
+import { Button, EmptyNote, Notice } from './ui';
+import { t } from './i18n';
+
+export function StoreConnectNotice({ mayChange, onConnected }: { mayChange: boolean; onConnected: () => void }) {
+  const [busy, setBusy] = useState(false);
+  if (!mayChange) return <EmptyNote>{t.apps.noStore}</EmptyNote>;
+  async function connectNow() {
+    setBusy(true);
+    try {
+      await connect();
+      onConnected();
+    } catch (e) {
+      snackbar({ text: (e as Error).message, error: true });
+      setBusy(false);
+    }
+  }
+  return (
+    <Notice
+      title={t.apps.connectTitle}
+      action={
+        <Button disabled={busy} onClick={connectNow}>
+          {t.apps.connect}
+        </Button>
+      }
+    >
+      {t.apps.connectText}
+    </Notice>
+  );
+}

package/src/StoreConnectedRow.tsx

@@ -0,0 +1,36 @@
+// The row at the bottom of "Appstore" that says the site is connected to Morpheme, with the button "Disconnect from Morpheme" (asks first).
+// Exposes StoreConnectedRow({ site, onDisconnected }); uses Group, ListItem, Button (ui.tsx), ask (ask.tsx), snackbar (lib/snackbar.ts) and disconnect (storeConnection.ts).
+import { useState } from 'react';
+import { snackbar } from '../lib/snackbar';
+import { ask } from './ask';
+import { disconnect } from './storeConnection';
+import { Button, Group, ListItem } from './ui';
+import { t } from './i18n';
+
+export function StoreConnectedRow({ site, onDisconnected }: { site: string; onDisconnected: () => void }) {
+  const [busy, setBusy] = useState(false);
+  async function disconnectNow() {
+    if (!(await ask(t.apps.disconnectAsk, t.apps.disconnect))) return;
+    setBusy(true);
+    try {
+      await disconnect();
+      onDisconnected();
+    } catch (e) {
+      snackbar({ text: (e as Error).message, error: true });
+      setBusy(false);
+    }
+  }
+  return (
+    <Group>
+      <ListItem
+        headline={t.apps.connected}
+        supporting={site}
+        actions={
+          <Button disabled={busy} onClick={disconnectNow}>
+            {t.apps.disconnect}
+          </Button>
+        }
+      />
+    </Group>
+  );
+}

package/src/SwapText.tsx

@@ -0,0 +1,22 @@
+// A focusable span that swaps its text for another on a click or Enter/Space, and back (no link or button look: it inherits the text).
+// Exposes SwapText. Depends on nothing.
+import { useState } from 'react';
+
+export function SwapText({ text, swapped, title }: { text: string; swapped: string; title?: string }) {
+  const [on, setOn] = useState(false);
+  return (
+    <span
+      tabIndex={0}
+      title={title}
+      onClick={() => setOn((was) => !was)}
+      onKeyDown={(e) => {
+        if (e.key === 'Enter' || e.key === ' ') {
+          e.preventDefault();
+          setOn((was) => !was);
+        }
+      }}
+    >
+      {on ? swapped : text}
+    </span>
+  );
+}

package/src/allIcons.ts

@@ -1,7 +1,4 @@
 // All Phosphor's icons (regular) as text, by their file, for AnyIcon (icon.tsx): loaded only when it draws one the site
-// does not (an app's in the app store). The theme's are in their place, as for Svg (themePlugin, packages/editor/site/theme.mjs).
-export const allIcons = import.meta.glob<string>('/node_modules/@phosphor-icons/core/assets/regular/*.svg', {
-  query: '?raw',
-  import: 'default',
-  eager: true,
-});
+// does not (an app's in the app store). The theme's are in their place. One virtual module that themePlugin makes
+// (allIconsModule, packages/editor/site/theme.mjs), so the build does not open 1500 files at once.
+export { allIcons } from 'virtual:all-icons';

package/src/cmsVersionView.d.mts

@@ -0,0 +1,7 @@
+/**
+ * Provides a short form of the CMS version for the editor's start screen.
+ * Exposes the `shortVersion` function.
+ * Depends on nothing.
+ */
+/** The CMS version as the start screen shows it: a pre-release without its build stamp, else the version as it is. */
+export function shortVersion(version: any): any;

package/src/cmsVersionView.mjs

@@ -0,0 +1,11 @@
+/**
+ * Provides a short form of the CMS version for the editor's start screen.
+ * Exposes the `shortVersion` function.
+ * Depends on nothing.
+ */
+
+/** The CMS version as the start screen shows it: a pre-release without its build stamp, else the version as it is. */
+export function shortVersion(version) {
+  const match = /^(\d+\.\d+\.\d+-[a-z]+)-\d+$/.exec(version);
+  return match ? match[1] : version;
+}

package/src/cmsVersionView.test.mjs

@@ -0,0 +1,32 @@
+/**
+ * Tests for the CMS version short form logic.
+ * Exposes test cases for `shortVersion`.
+ * Depends on `node:test`, `node:assert/strict`, and `./cmsVersionView.mjs`.
+ */
+import { test } from 'node:test';
+import * as assert from 'node:assert/strict';
+import { shortVersion } from './cmsVersionView.mjs';
+
+test('strips build stamp from pre-release versions', () => {
+  assert.equal(shortVersion('0.5.0-next-20261104200208'), '0.5.0-next');
+});
+
+test('strips build stamp from beta versions', () => {
+  assert.equal(shortVersion('1.2.3-beta-7'), '1.2.3-beta');
+});
+
+test('keeps stable versions unchanged', () => {
+  assert.equal(shortVersion('0.5.0'), '0.5.0');
+});
+
+test('keeps pre-release versions without build stamp unchanged', () => {
+  assert.equal(shortVersion('0.5.0-next'), '0.5.0-next');
+});
+
+test('keeps versions with non-numeric build metadata unchanged', () => {
+  assert.equal(shortVersion('0.5.0-rc.1'), '0.5.0-rc.1');
+});
+
+test('handles empty string', () => {
+  assert.equal(shortVersion(''), '');
+});

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

@@ -53,6 +53,13 @@ export const apps: Messages['apps'] = {
   loadingStore: 'Henter apps',
   storeFailed: 'Kunne ikke hente Appstore.',
   noStore: 'Sitet har ingen Appstore.',
+  connectTitle: 'Hjemmesiden er ikke forbundet til Morpheme',
+  connectText: 'Forbind den for at installere apps og temaer fra Appstore.',
+  connect: 'Forbind til Morpheme',
+  connected: 'Forbundet til Morpheme',
+  disconnect: 'Afbryd forbindelsen til Morpheme',
+  disconnectAsk: 'Afbryd hjemmesidens forbindelse til Morpheme? Installerede apps og temaer bliver.',
+  connectBusy: 'Mange hjemmesider forbinder lige nu. Prøv igen om en time.',
   storeBroken: (app) => `${app} kunne ikke hentes rigtigt fra Appstore.`,
   notInStore: 'Appen findes ikke i Appstore.',
   categoryFilter: 'Kategori',

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

@@ -2,6 +2,8 @@ import type { Messages } from '../en-US';
 
 export const library: Messages['library'] = {
   siteUpdated: (when) => `Opdateret ${when}`,
+  cmsVersion: (version) => `Morpheme ${version}`,
+  statusSeparator: ' · ',
   githubAccount: (login) => `GitHub-konto: ${login}`,
   logOut: 'Log ud',
   notifications: 'Notifikationer',

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

@@ -80,6 +80,14 @@ export const apps = {
   storeFailed: 'Couldn’t load the Appstore',
   /** On "Appstore" when the site's Worker has no store key: only the site's own are there. */
   noStore: 'The site has no Appstore',
+  /** On "Appstore": the box that connects the site to the Morpheme store, the row that disconnects it, and the answer at the store's hourly limit. */
+  connectTitle: 'The website is not connected to Morpheme',
+  connectText: 'Connect it to install apps and themes from the Appstore.',
+  connect: 'Connect to Morpheme',
+  connected: 'Connected to Morpheme',
+  disconnect: 'Disconnect from Morpheme',
+  disconnectAsk: 'Disconnect the website from Morpheme? Installed apps and themes stay.',
+  connectBusy: 'Many websites are connecting right now. Try again in an hour.',
   /** An app's files did not come from the store as its catalog says. */
   storeBroken: (app: string) => `${app} couldn’t be loaded correctly from the Appstore`,
   /** At an address of an app the store does not have. */

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

@@ -2,6 +2,10 @@
 // with choices (Sheet.tsx).
 export const library = {
   siteUpdated: (when: string) => `Updated ${when}`,
+  /** The CMS's name and version on the start screen (CmsVersion.tsx), before the update time. */
+  cmsVersion: (version: string) => `Morpheme ${version}`,
+  /** Between the CMS version and the update time in the start screen's status. */
+  statusSeparator: ' · ',
   githubAccount: (login: string) => `GitHub account: ${login}`,
   logOut: 'Log out',
   /** The bell in the top bar and its screen (#notifikationer, Notifications.tsx): the messages shown at the bottom. */

package/src/store.ts

@@ -310,6 +310,11 @@ function catalogText(): Promise<string> {
   return catalog;
 }
 
+/** Makes the catalog be read again, the next time it is asked for (after the site is connected or disconnected). */
+export function forgetCatalog(): void {
+  catalog = null;
+}
+
 /** Whether the site's Worker has a store key; without one, "Appstore" has only the site's own apps and themes. Fails when
  * the catalog cannot be read. */
 export const storeConnected = (): Promise<boolean> =>

package/src/storeConnection.ts

@@ -0,0 +1,24 @@
+// The site's connection to the Morpheme store, from the editor: connection() reads it, connect() and disconnect() change it.
+// Exposes connection, connect, disconnect and StoreConnection; used by StoreConnectNotice.tsx, StoreConnectedRow.tsx and AppList.tsx.
+// Depends on storeConnectionCall.ts (the request), store.ts (forgetCatalog) and i18n (the texts of a failure).
+import { callConnection, type ConnectionDeps, type StoreConnection } from './storeConnectionCall';
+import { forgetCatalog } from './store';
+import { t } from './i18n';
+
+export type { StoreConnection };
+
+const deps = (): ConnectionDeps => ({
+  fetch: (url, init) => fetch(url, init),
+  forgetCatalog,
+  busy: t.apps.connectBusy,
+  failed: t.apps.storeFailed,
+});
+
+/** Whether the site has a key to the store, and who may change that. */
+export const connection = () => callConnection('GET', deps());
+
+/** Asks the store for a key for this site. */
+export const connect = () => callConnection('POST', deps());
+
+/** Tells the store to drop the site's key. */
+export const disconnect = () => callConnection('DELETE', deps());

package/src/storeConnectionCall.test.mjs

@@ -0,0 +1,57 @@
+// Tests for src/storeConnectionCall.ts: the request for "Connect to Morpheme" and the text of a failure.
+// Run: node --test packages/editor/src/storeConnectionCall.test.mjs
+import assert from 'node:assert/strict';
+import { test } from 'node:test';
+import { callConnection } from './storeConnectionCall.ts';
+
+const make = (answer) => {
+  const calls = { fetched: [], forgot: 0 };
+  const deps = {
+    fetch: async (url, init) => {
+      calls.fetched.push([url, init.method]);
+      if (answer instanceof Error) throw answer;
+      return answer;
+    },
+    forgetCatalog: () => calls.forgot++,
+    busy: 'BUSY',
+    failed: 'FAILED',
+  };
+  return { deps, calls };
+};
+const ok = (body) => ({ ok: true, status: 200, json: async () => body });
+
+test('a read gives the answer and keeps the catalog', async () => {
+  const { deps, calls } = make(ok({ connected: false, mayChange: true }));
+  assert.deepEqual(await callConnection('GET', deps), { connected: false, mayChange: true });
+  assert.deepEqual(calls.fetched, [['/api/store/connection', 'GET']]);
+  assert.equal(calls.forgot, 0);
+});
+
+test('connect and disconnect make the catalog be read again', async () => {
+  for (const method of ['POST', 'DELETE']) {
+    const { deps, calls } = make(ok({ connected: false, mayChange: true }));
+    await callConnection(method, deps);
+    assert.equal(calls.fetched[0][1], method);
+    assert.equal(calls.forgot, 1);
+  }
+});
+
+test('429 says the store is busy', async () => {
+  const { deps, calls } = make({ ok: false, status: 429, json: async () => ({}) });
+  await assert.rejects(callConnection('POST', deps), { message: 'BUSY' });
+  assert.equal(calls.forgot, 0);
+});
+
+const failures = [
+  { ok: false, status: 502, json: async () => ({}) },
+  new Error('offline'),
+  { ok: true, status: 200, json: async () => Promise.reject(new Error('not json')) },
+];
+
+test('any other failure says the store failed', async () => {
+  for (const answer of failures) {
+    const { deps, calls } = make(answer);
+    await assert.rejects(callConnection('DELETE', deps), { message: 'FAILED' });
+    assert.equal(calls.forgot, 0);
+  }
+});

package/src/storeConnectionCall.ts

@@ -0,0 +1,37 @@
+// The request to the site's Worker for "Connect to Morpheme" (/api/store/connection): GET, POST, DELETE, and what a failure says.
+// Exposes StoreConnection and callConnection(method, deps); no imports of the editor, so node --test runs it (storeConnectionCall.test.mjs).
+// Used by storeConnection.ts, which gives it the real fetch, forgetCatalog and texts.
+
+/** What the Worker says about the site's key to the store (packages/editor/worker/store-connection.js). */
+export type StoreConnection =
+  | { connected: false; mayChange: boolean }
+  | { connected: true; by: 'hand'; mayChange: boolean }
+  | { connected: true; by: 'button'; site: string; since: string; mayChange: boolean };
+
+export type ConnectionDeps = {
+  fetch: (url: string, init: { method: string }) => Promise<{ ok: boolean; status: number; json: () => Promise<unknown> }>;
+  /** Asks the store's catalog again (store.ts forgetCatalog). */
+  forgetCatalog: () => void;
+  /** The texts of a failure: the store's hourly limit (429) and any other. */
+  busy: string;
+  failed: string;
+};
+
+/** Sends one request. A failure throws an Error with the text for it; POST and DELETE that succeed make the catalog be read again. */
+export async function callConnection(method: 'GET' | 'POST' | 'DELETE', deps: ConnectionDeps): Promise<StoreConnection> {
+  let res;
+  try {
+    res = await deps.fetch('/api/store/connection', { method });
+  } catch {
+    throw new Error(deps.failed);
+  }
+  if (!res.ok) throw new Error(res.status === 429 ? deps.busy : deps.failed);
+  let found: StoreConnection;
+  try {
+    found = (await res.json()) as StoreConnection;
+  } catch {
+    throw new Error(deps.failed);
+  }
+  if (method !== 'GET') deps.forgetCatalog();
+  return found;
+}

package/src/virtual.d.ts

@@ -3,3 +3,8 @@ declare module 'virtual:app-folders' {
   const folders: Record<string, { files: string[]; csp?: Partial<Record<string, string[]>> }>;
   export default folders;
 }
+
+// All Phosphor's icons (regular) as text, by their file (allIconsModule in site/theme.mjs).
+declare module 'virtual:all-icons' {
+  export const allIcons: Record<string, string>;
+}

package/starter/package.json

@@ -63,5 +63,10 @@
     "prettier-plugin-astro": "^1.1.2",
     "prettier-plugin-tailwindcss": "^0.8.1",
     "typescript": "^6.0.2"
+  },
+  "overrides": {
+    "@tailwindcss/typography": {
+      "postcss-selector-parser": "^6.1.5"
+    }
   }
 }

package/theme/editor/looks.d.mts

@@ -0,0 +1,2 @@
+export const LOOKS: {};
+export const HEADINGS: {};

package/worker/index.js

@@ -14,7 +14,8 @@
 //   (packages/editor/worker/session.js), and what the editor asks of GitHub with it (/api/github/*, packages/editor/worker/editor-github.js), the site's
 //   files through the cache in R2 (packages/editor/worker/files.js).
 // - what the editor asks of the app store (/api/store/catalog and /api/store/files/<oid>, packages/editor/worker/store.js), with the
-//   site's key (MORPHEME_STORE_KEY) that never leaves the Worker.
+//   site's key (MORPHEME_STORE_KEY, or the one from "Connect to Morpheme", /api/store/connection, packages/editor/worker/store-connection.js, in D1)
+//   that never leaves the Worker.
 // - the addresses visitors came to that do not exist, for the editor (/api/not-found, packages/editor/worker/not-found.js).
 // - the visitors' answers in the cookie banner, the consent log (/api/consent, packages/editor/worker/consent.js, in D1), and each hour
 //   those older than two years deleted.
@@ -36,6 +37,7 @@ import { handleNotFound, isVisit, json, recordNotFound } from './not-found.js';
 import { forgetOldConsents, handleConsent } from './consent.js';
 import { access, mayEdit } from './session.js';
 import { handleGitHub } from './editor-github.js';
+import { handleConnection } from './store-connection.js';
 import { handleStore } from './store.js';
 import { handleR2 } from './r2-status.js';
 import { publishScheduled, SCHEDULED_LIST } from './publish.js';
@@ -149,6 +151,7 @@ export default {
     if (url.pathname === '/api/consent') return handleConsent(request, env);
     if (url.pathname === '/api/r2') return handleR2(request, env);
     if (url.pathname.startsWith('/api/github/')) return handleGitHub(request, env, ctx);
+    if (url.pathname === '/api/store/connection') return handleConnection(request, env, ctx);
     if (url.pathname.startsWith('/api/store/')) return handleStore(request, env, ctx);
     if (/^\/api\/push(\/wait)?\/?$/.test(url.pathname)) return handlePush(request, env);
     if (/^\/api\/cms(\/update)?\/?$/.test(url.pathname)) return handleCms(request, env, ctx);