@morphemecms/cms 0.13.0-next-20261106213045 → 0.13.0

package/lib/menu.test.mjs

@@ -17,7 +17,7 @@ const known = {
 const treeGroups = [
   { id: 'home', title: 'Home', href: '#', ids: [] },
   { id: 'content', title: 'Content', ids: ['pages', 'lists', 'redirects'] },
-  { id: 'appearance', title: 'Appearance', ids: ['appearance/colors', 'appearance/logo'] },
+  { id: 'appearance', title: 'Appearance', ids: ['appearance/colors', 'company/logo'] },
 ];
 const treePartOf = (id) => ({ label: `L ${id}`, href: `#${id === 'redirects' ? 'seo/redirects' : id}`, count: null });
 const treeChildren = (id) =>
@@ -78,9 +78,8 @@ test('the screens with parts, and their parts, are the screen', () => {
   assert.equal(currentPart('privacy/cookie-banner', known), 'privacy');
 });
 
-test('the app store, and its themes, are Find apps', () => {
+test('the app store is Find apps', () => {
   assert.equal(currentPart('settings/appstore', known), 'appstore');
-  assert.equal(currentPart('settings/appstore/themes', known), 'appstore');
 });
 
 test('a screen of its own is itself, and the start screen is none', () => {
@@ -155,10 +154,10 @@ const menuGroups = [
     title: 'Content',
     ids: ['pages', 'blog', 'lists', 'popups', 'tags', 'files', 'internal-links', 'redirects'],
   },
-  { id: 'global', title: 'Global', ids: ['header', 'footer', 'company'] },
-  { id: 'apps', title: 'Apps', ids: ['apps', 'appstore'] },
   { id: 'blocks', title: 'Blocks', ids: ['blocks', 'block-settings'] },
-  { id: 'appearance', title: 'Appearance', ids: ['colors', 'logo'] },
+  { id: 'apps', title: 'Apps', ids: ['apps', 'appstore'] },
+  { id: 'company', title: 'Business', ids: ['logo', 'company'] },
+  { id: 'appearance', title: 'Appearance', ids: ['theme-store', 'header', 'footer', 'colors'] },
   { id: 'privacy', title: 'Privacy', ids: ['cookie-banner', 'cookies'] },
   { id: 'settings', title: 'Settings', ids: ['advanced'] },
 ];
@@ -178,8 +177,9 @@ const hrefs = {
   appstore: '#settings/appstore',
   blocks: '#blocks',
   'block-settings': '#block-settings',
+  'theme-store': '#appearance/theme-store',
   colors: '#appearance/colors',
-  logo: '#appearance/logo',
+  logo: '#company/logo',
   'cookie-banner': '#privacy/cookie-banner',
   cookies: '#list/cookies',
   advanced: '#advanced',
@@ -195,7 +195,12 @@ const menu = menuTree(
         ]
       : id === 'apps'
         ? [{ id: 'calendly', label: 'Calendly', href: '#apps/calendly' }]
-        : [],
+        : id === 'company'
+          ? [
+              { id: 'contact', label: 'Contact', href: '#company/contact' },
+              { id: 'booking', label: 'Booking', href: '#company/booking' },
+            ]
+          : [],
 );
 const menuKnown = { ...known, store: 'settings/appstore' };
 const allIds = menu.flatMap((e) => e.items.flatMap((i) => [i.id, ...(i.children ?? []).map((c) => c.id)]));
@@ -204,7 +209,7 @@ const allHrefs = menu.flatMap((e) => e.items.flatMap((i) => [i.href, ...(i.child
 test('the menu has the eight sections in order', () => {
   assert.deepEqual(
     menu.map((e) => e.id),
-    ['home', 'content', 'global', 'apps', 'blocks', 'appearance', 'privacy', 'settings'],
+    ['home', 'content', 'blocks', 'apps', 'company', 'appearance', 'privacy', 'settings'],
   );
 });
 
@@ -256,21 +261,43 @@ test('currentPlace of a page being edited, a list, the SEO rating, an Appearance
   assert.deepEqual(currentPlace('appearance/colors', menu, menuKnown), { section: 'appearance', item: 'colors' });
   assert.deepEqual(currentPlace('apps/calendly', menu, menuKnown), { section: 'apps', item: 'calendly' });
   assert.deepEqual(currentPlace('apps/mailchimp', menu, menuKnown), { section: 'apps' });
-  assert.deepEqual(currentPlace('settings/appstore/themes', menu, menuKnown), { section: 'apps', item: 'appstore' });
+  assert.deepEqual(currentPlace('settings/appstore', menu, menuKnown), { section: 'apps', item: 'appstore' });
+  assert.deepEqual(currentPlace('appearance/theme-store', menu, menuKnown), { section: 'appearance', item: 'theme-store' });
   assert.deepEqual(currentPlace('privacy/cookie-banner', menu, menuKnown), { section: 'privacy', item: 'cookie-banner' });
   assert.deepEqual(currentPlace('src/data/cookie-list/a.json', menu, { ...menuKnown, open: 'cookies' }), { section: 'privacy' });
 });
 
-test('currentPlace of Appearance › Header and its menus is Global › Header', () => {
-  assert.deepEqual(currentPlace('appearance/header', menu, menuKnown), { section: 'global', item: 'header' });
-  assert.deepEqual(currentPlace('src/data/menu.json', menu, { ...menuKnown, open: 'menu' }), { section: 'global', item: 'header' });
+test('currentPlace of Appearance › Header and its menus is Appearance › Header', () => {
+  assert.deepEqual(currentPlace('appearance/header', menu, menuKnown), { section: 'appearance', item: 'header' });
+  assert.deepEqual(currentPlace('src/data/menu.json', menu, { ...menuKnown, open: 'menu' }), {
+    section: 'appearance',
+    item: 'header',
+  });
+});
+
+test('currentPlace of Appearance › Footer is Appearance › Footer, a row without children', () => {
+  assert.deepEqual(currentPlace('appearance/footer', menu, menuKnown), { section: 'appearance', item: 'footer' });
+  const appearance = menu.find((entry) => entry.id === 'appearance');
+  assert.equal(appearance.items.find((item) => item.id === 'footer').children, undefined);
+  assert.equal(appearance.items.find((item) => item.id === 'header').children, undefined);
+});
+
+test('Business is a section: Logo and icon first, then its parts as rows, not the part Business itself', () => {
+  const business = menu.find((entry) => entry.id === 'company');
+  assert.deepEqual(
+    business.items.map((i) => [i.id, i.href]),
+    [
+      ['logo', '#company/logo'],
+      ['contact', '#company/contact'],
+      ['booking', '#company/booking'],
+    ],
+  );
+  assert.deepEqual(currentPlace('company/contact', menu, menuKnown), { section: 'company', item: 'contact' });
+  assert.deepEqual(currentPlace('company', menu, menuKnown), { section: 'company' });
 });
 
-test('currentPlace of Appearance › Footer is Global › Footer, a row without children', () => {
-  assert.deepEqual(currentPlace('appearance/footer', menu, menuKnown), { section: 'global', item: 'footer' });
-  const global = menu.find((entry) => entry.id === 'global');
-  assert.equal(global.items.find((item) => item.id === 'footer').children, undefined);
-  assert.equal(global.items.find((item) => item.id === 'header').children, undefined);
+test('currentPlace of Business › Logo and icon is that row', () => {
+  assert.deepEqual(currentPlace('company/logo', menu, menuKnown), { section: 'company', item: 'logo' });
 });
 
 const appsGroups = [{ id: 'apps', title: 'Apps', ids: ['apps', 'appstore'] }];

package/lib/storeEntries.d.mts

@@ -14,7 +14,6 @@ export function isText(v: unknown): v is string;
 export function isPath(v: unknown): boolean;
 export const ITEM_ID: RegExp;
 export const HANDLE: RegExp;
-export const LEGACY: RegExp;
 export const STANDARD: "saturn";
 export const RECORD: "store.json";
 export function strayStoreId(name: string, kind: "app" | "theme"): boolean;

package/lib/storeEntries.mjs

@@ -1,6 +1,6 @@
 /**
  * Pure validation logic for store apps and themes.
- * Exposes isText, isPath, ITEM_ID, HANDLE, LEGACY, STANDARD, RECORD, validApp, validTheme, strayStoreId.
+ * Exposes isText, isPath, ITEM_ID, HANDLE, STANDARD, RECORD, validApp, validTheme, strayStoreId.
  * No external dependencies.
  */
 
@@ -20,15 +20,13 @@ export const isPath = (v) => isText(v) && v.split('/').every((part) => part !==
 export const ITEM_ID = /^(app|theme)_[0-9a-f]{16}$/;
 // An item's address in the store: publisher/name
 export const HANDLE = /^[a-z0-9][a-z0-9-]{0,39}\/[a-z0-9][a-z0-9-]{0,39}$/;
-// An item's folder name before it had a permanent id
-export const LEGACY = /^[a-z0-9][a-z0-9-]*$/;
 // The standard theme, which every site has
 export const STANDARD = 'saturn';
 // The note in an installed folder of where it came from
 export const RECORD = 'store.json';
 
 const hasId = (x, kind) => ITEM_ID.test(x?.id ?? '') && x.id.startsWith(`${kind}_`);
-const hasHandle = (x) => HANDLE.test(x?.handle ?? '') && (x.legacy === undefined || LEGACY.test(x.legacy));
+const hasHandle = (x) => HANDLE.test(x?.handle ?? '');
 
 /**
  * True when a site's own folder name looks like a store id of this kind (it starts with `app_` or `theme_`) but is not one.

package/lib/storeEntries.test.mjs

@@ -9,7 +9,6 @@ import { validApp, validTheme, isPath, strayStoreId } from './storeEntries.mjs';
 const theme = () => ({
   id: 'theme_fa395ad84690acbd',
   handle: 'morpheme/venus',
-  legacy: 'venus',
   version: '1.0.0',
   api: 4,
   name: 'Venus',
@@ -56,12 +55,8 @@ test('valid theme bad handle', () => {
   assert.equal(validTheme({ ...theme(), handle: 'Morpheme/venus' }, 4), false);
 });
 
-test('valid theme keeps legacy, and drops a bad one', () => {
+test('valid theme with a permanent id and a handle', () => {
   assert.equal(validTheme(theme(), 4), true);
-  assert.equal(theme().legacy, 'venus');
-  assert.equal(validTheme({ ...theme(), legacy: 'Venus!' }, 4), false);
-  const { legacy, ...rest } = theme();
-  assert.equal(validTheme(rest, 4), true);
 });
 
 test('valid theme bad path', () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@morphemecms/cms",
-  "version": "0.13.0-next-20261106213045",
+  "version": "0.13.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/scripts/starter-gitattributes.test.mjs

@@ -0,0 +1,22 @@
+// Tests that the starter keeps LF line endings in every site made from it, also on Windows (core.autocrlf=true):
+// starter/.gitattributes holds the rule and the npm package ships it. Uses node:test and `npm pack --dry-run`.
+import { test } from 'node:test';
+import assert from 'node:assert/strict';
+import { readFileSync } from 'node:fs';
+import { spawnSync } from 'node:child_process';
+import { fileURLToPath } from 'node:url';
+
+const pkgDir = fileURLToPath(new URL('../', import.meta.url));
+
+test('starter/.gitattributes forces LF in every checkout', () => {
+  const text = readFileSync(`${pkgDir}starter/.gitattributes`, 'utf8');
+  assert.ok(!text.includes('\r'), 'the file itself has LF line breaks');
+  assert.match(text, /^\* text=auto eol=lf$/m);
+});
+
+test('the npm package ships starter/.gitattributes', () => {
+  const run = spawnSync('npm', ['pack', '--dry-run', '--json', '--ignore-scripts'], { cwd: pkgDir, encoding: 'utf8', shell: true });
+  assert.equal(run.status, 0, run.stderr);
+  const [{ files }] = JSON.parse(run.stdout);
+  assert.ok(files.some((f) => f.path === 'starter/.gitattributes'));
+});

package/site/header.d.mts

@@ -1,5 +1,5 @@
 /** @typedef {import('../src/standard/buttons/fields').Button} Button */
-/** @typedef {{ button: Button | null, menuSide: 'start' | 'end' }} Header */
+/** @typedef {{ button: Button | null, phone: boolean, menuSide: 'start' | 'end' }} Header */
 /**
  * Reads src/data/header.json's content. Missing or wrong → defaults.
  * @param {unknown} raw
@@ -10,6 +10,7 @@ export function sortedNav<T extends NavItem>(items: T[]): T[];
 export type Button = any;
 export type Header = {
     button: Button | null;
+    phone: boolean;
     menuSide: "start" | "end";
 };
 export type NavLink = {

package/site/header.mjs

@@ -1,10 +1,11 @@
-// The header's site setting (src/data/header.json, optional): a button in place of the phone icon, and the side of the
-// header the mobile menu button sits on; and the main menu's items as the header draws them. Exposes headerOf (pure;
+// The header's site setting (src/data/header.json, optional): its call to action (a button, and the site's phone number
+// as a text button before it; both also at the bottom of the navigation drawer), and the side of the header the mobile
+// menu button sits on (the drawer opens from that side); and the main menu's items as the header draws them. Exposes headerOf (pure;
 // missing or wrong data gives the defaults) and sortedNav. Used by site/site.ts and the editor's preview of the header
 // (src/headerPreview.mjs); the Button type is src/standard/buttons/fields.ts.
 
 /** @typedef {import('../src/standard/buttons/fields').Button} Button */
-/** @typedef {{ button: Button | null, menuSide: 'start' | 'end' }} Header */
+/** @typedef {{ button: Button | null, phone: boolean, menuSide: 'start' | 'end' }} Header */
 
 /**
  * Reads src/data/header.json's content. Missing or wrong → defaults.
@@ -13,9 +14,11 @@
  */
 export function headerOf(raw) {
   const data = raw && typeof raw === 'object' ? /** @type {Record<string, any>} */ (raw) : {};
-  const { enabled, ...button } = data.button && typeof data.button === 'object' ? data.button : { enabled: false };
+  const { enabled, phone, ...button } = data.button && typeof data.button === 'object' ? data.button : { enabled: false };
   return {
     button: enabled === true ? button : null,
+    // The phone number is shown unless it is turned off (as before the setting, when the header always had it).
+    phone: phone !== false,
     menuSide: data.menuSide === 'end' ? 'end' : 'start',
   };
 }

package/site/header.test.mjs

@@ -3,7 +3,7 @@ import { test } from 'node:test';
 import { headerOf, sortedNav } from './header.mjs';
 
 test('no file', () => {
-  assert.deepEqual(headerOf(undefined), { button: null, menuSide: 'start' });
+  assert.deepEqual(headerOf(undefined), { button: null, phone: true, menuSide: 'start' });
 });
 
 test('button off', () => {
@@ -17,6 +17,12 @@ test('button on', () => {
   });
 });
 
+test('phone number on by default, off when turned off', () => {
+  assert.equal(headerOf({ button: { enabled: true, to: 'booking' } }).phone, true);
+  assert.equal(headerOf({ button: { enabled: false, phone: false } }).phone, false);
+  assert.equal(headerOf({ button: { enabled: true, phone: false, to: 'booking' } }).button?.phone, undefined);
+});
+
 test('menu at the end', () => {
   assert.equal(headerOf({ menuSide: 'end' }).menuSide, 'end');
 });
@@ -26,7 +32,7 @@ test('wrong menu side', () => {
 });
 
 test('wrong shapes', () => {
-  assert.deepEqual(headerOf('x'), { button: null, menuSide: 'start' });
+  assert.deepEqual(headerOf('x'), { button: null, phone: true, menuSide: 'start' });
   assert.equal(headerOf({ button: 'x' }).button, null);
 });
 

package/site/social.d.mts

@@ -1,6 +1,39 @@
-/** @typedef {(typeof PROFILE_IDS)[number]} ProfileId */
+/** @typedef {(typeof NETWORKS)[number]['id']} NetworkId */
 /** @typedef {(typeof SHARE_IDS)[number]} ShareId */
-/** @typedef {{ profiles: { id: ProfileId, url: string }[], share: ShareId[] }} Social */
+/** @typedef {{ id: NetworkId | null, url: string }} Profile */
+/** @typedef {{ profiles: Profile[], share: ShareId[] }} Social */
+/**
+ * The host of an address, in small letters and without "www.": '' for one that is not an address.
+ * @param {string} url
+ */
+export function hostOf(url: string): string;
+/**
+ * An address as it is compared with another: the host in small letters, no slash at the end. Two addresses with the
+ * same key are the same address. One that is not an address has its own text (trimmed, without the slash) as its key.
+ * @param {string} url
+ */
+export function addressKey(url: string): string;
+/**
+ * The addresses a list of profiles has more than once (the second and later of each, as written); empty ones left out.
+ * @param {unknown[]} profiles
+ * @returns {string[]}
+ */
+export function twiceIn(profiles: unknown[]): string[];
+/**
+ * The network an address is a profile on, by its host; null for one not known (or not an address).
+ * @param {string} url
+ * @returns {(typeof NETWORKS)[number] | null}
+ */
+export function networkOf(url: string): (typeof NETWORKS)[number] | null;
+/**
+ * The file's data as it is written now: one from before the profiles were a list has its filled keys
+ * ("facebook": "https://…") as links in the list, where the first of them was, in their order, after any the
+ * list has; the other keys stay as and where they were. An address already in the list is not added again (nor is
+ * one twice in the keys). A file without those keys is given back as it is.
+ * @param {Record<string, unknown>} data
+ * @returns {Record<string, unknown>}
+ */
+export function upgradeSocial(data: Record<string, unknown>): Record<string, unknown>;
 /**
  * @param {Record<string, unknown> | undefined} raw
  * @returns {Social}
@@ -24,14 +57,38 @@ export function shareLinks(post: {
  * @returns {string[]}
  */
 export function sameAsOf(profiles: Social["profiles"]): string[];
-export const PROFILE_IDS: readonly ["facebook", "instagram", "linkedin", "x", "youtube", "tiktok", "pinterest"];
+/**
+ * The networks known by their addresses: for now those a post can be shared on (SHARE_IDS). The id, the name (a brand, the
+ * same in every language) and the hosts (one ending in ".*" is that name with a country or com after it: pinterest.dk). A host matches
+ * itself and any address under it (www.facebook.com, dk.linkedin.com). A host ending in ".*" has com, a country or a second level and a
+ * country after its name (pinterest.dk, pinterest.co.uk), nothing else. A link to any other site is a profile too, shown by
+ * its host.
+ */
+export const NETWORKS: readonly [{
+    readonly id: "facebook";
+    readonly name: "Facebook";
+    readonly hosts: readonly ["facebook.com", "fb.com", "fb.me"];
+}, {
+    readonly id: "x";
+    readonly name: "X";
+    readonly hosts: readonly ["x.com", "twitter.com"];
+}, {
+    readonly id: "linkedin";
+    readonly name: "LinkedIn";
+    readonly hosts: readonly ["linkedin.com", "lnkd.in"];
+}, {
+    readonly id: "pinterest";
+    readonly name: "Pinterest";
+    readonly hosts: readonly ["pinterest.*", "pin.it"];
+}];
 export const SHARE_IDS: readonly ["facebook", "x", "linkedin", "pinterest", "copy-link"];
-export type ProfileId = (typeof PROFILE_IDS)[number];
+export type NetworkId = (typeof NETWORKS)[number]["id"];
 export type ShareId = (typeof SHARE_IDS)[number];
+export type Profile = {
+    id: NetworkId | null;
+    url: string;
+};
 export type Social = {
-    profiles: {
-        id: ProfileId;
-        url: string;
-    }[];
+    profiles: Profile[];
     share: ShareId[];
 };

package/site/social.mjs

@@ -1,28 +1,146 @@
-// The site's social settings (src/data/social.json, Company > Social media in the editor): its profiles, for the structured
-// data (sameAs), and the share buttons under a blog post, with their addresses. Exposes socialOf, shareLinks, sameAsOf.
+// The site's social settings (src/data/social.json, Business › Social media in the editor): its profiles, a list of
+// links the owner adds ({ profiles: [{ url }] }), each one's network known by its address (networkOf), for the
+// structured data (sameAs); and the share buttons under a blog post, with their addresses. A file written before the
+// profiles were a list has a key for each of seven networks ("facebook": "https://…"): upgradeSocial makes it a list.
+// Exposes NETWORKS, networkOf, addressKey, twiceIn, upgradeSocial, socialOf, shareLinks, sameAsOf.
 
-export const PROFILE_IDS = /** @type {const} */ (['facebook', 'instagram', 'linkedin', 'x', 'youtube', 'tiktok', 'pinterest']);
+/**
+ * The networks known by their addresses: for now those a post can be shared on (SHARE_IDS). The id, the name (a brand, the
+ * same in every language) and the hosts (one ending in ".*" is that name with a country or com after it: pinterest.dk). A host matches
+ * itself and any address under it (www.facebook.com, dk.linkedin.com). A host ending in ".*" has com, a country or a second level and a
+ * country after its name (pinterest.dk, pinterest.co.uk), nothing else. A link to any other site is a profile too, shown by
+ * its host.
+ */
+export const NETWORKS = /** @type {const} */ ([
+  { id: 'facebook', name: 'Facebook', hosts: ['facebook.com', 'fb.com', 'fb.me'] },
+  { id: 'x', name: 'X', hosts: ['x.com', 'twitter.com'] },
+  { id: 'linkedin', name: 'LinkedIn', hosts: ['linkedin.com', 'lnkd.in'] },
+  { id: 'pinterest', name: 'Pinterest', hosts: ['pinterest.*', 'pin.it'] },
+]);
+
+/** The keys of a file from before the profiles were a list, one for each network, in the order they had. */
+const OLD_KEYS = ['facebook', 'instagram', 'linkedin', 'x', 'youtube', 'tiktok', 'pinterest'];
 export const SHARE_IDS = /** @type {const} */ (['facebook', 'x', 'linkedin', 'pinterest', 'copy-link']);
-/** @typedef {(typeof PROFILE_IDS)[number]} ProfileId */
+/** @typedef {(typeof NETWORKS)[number]['id']} NetworkId */
 /** @typedef {(typeof SHARE_IDS)[number]} ShareId */
-/** @typedef {{ profiles: { id: ProfileId, url: string }[], share: ShareId[] }} Social */
+/** @typedef {{ id: NetworkId | null, url: string }} Profile */
+/** @typedef {{ profiles: Profile[], share: ShareId[] }} Social */
+
+/**
+ * The host of an address, in small letters and without "www.": '' for one that is not an address.
+ * @param {string} url
+ */
+export function hostOf(url) {
+  try {
+    return new URL(url.trim()).hostname.toLowerCase().replace(/^www\./, '');
+  } catch {
+    return '';
+  }
+}
+
+/**
+ * An address as it is compared with another: the host in small letters, no slash at the end. Two addresses with the
+ * same key are the same address. One that is not an address has its own text (trimmed, without the slash) as its key.
+ * @param {string} url
+ */
+export function addressKey(url) {
+  const text = url.trim();
+  try {
+    const u = new URL(text);
+    return `${u.protocol}//${u.host}${u.pathname.replace(/\/+$/, '')}${u.search}${u.hash}`;
+  } catch {
+    return text.replace(/\/+$/, '');
+  }
+}
+
+/**
+ * The addresses a list of profiles has more than once (the second and later of each, as written); empty ones left out.
+ * @param {unknown[]} profiles
+ * @returns {string[]}
+ */
+export function twiceIn(profiles) {
+  const seen = new Set();
+  /** @type {string[]} */
+  const twice = [];
+  for (const item of profiles) {
+    const url =
+      item && typeof item === 'object' && typeof (/** @type {any} */ (item).url) === 'string' ? /** @type {any} */ (item).url.trim() : '';
+    if (!url) continue;
+    const key = addressKey(url);
+    if (seen.has(key)) twice.push(url);
+    else seen.add(key);
+  }
+  return twice;
+}
+
+// What a host ending in ".*" has after its name: com, a country (dk), or a second level and a country (co.uk, com.au).
+// Not any word: pinterest.evil.com is not Pinterest.
+const ENDING = '(?:com|[a-z]{2}|(?:co|com)\\.[a-z]{2})';
+
+/** @param {string} host @param {string} known */
+function hostIs(host, known) {
+  if (known.endsWith('.*')) return new RegExp(`(^|\\.)${known.slice(0, -2)}\\.${ENDING}$`).test(host);
+  return host === known || host.endsWith(`.${known}`);
+}
+
+/**
+ * The network an address is a profile on, by its host; null for one not known (or not an address).
+ * @param {string} url
+ * @returns {(typeof NETWORKS)[number] | null}
+ */
+export function networkOf(url) {
+  const host = hostOf(url);
+  if (!host) return null;
+  return NETWORKS.find((n) => n.hosts.some((h) => hostIs(host, h))) ?? null;
+}
+
+/**
+ * The file's data as it is written now: one from before the profiles were a list has its filled keys
+ * ("facebook": "https://…") as links in the list, where the first of them was, in their order, after any the
+ * list has; the other keys stay as and where they were. An address already in the list is not added again (nor is
+ * one twice in the keys). A file without those keys is given back as it is.
+ * @param {Record<string, unknown>} data
+ * @returns {Record<string, unknown>}
+ */
+export function upgradeSocial(data) {
+  if (!OLD_KEYS.some((k) => k in data)) return data;
+  const kept = Array.isArray(data.profiles) ? data.profiles : [];
+  const old = OLD_KEYS.map((k) => data[k])
+    .filter((v) => typeof v === 'string' && v.trim() !== '')
+    .map((v) => ({ url: /** @type {string} */ (v).trim() }));
+  const seen = new Set(kept.map((p) => (p && typeof p.url === 'string' ? addressKey(p.url) : '')).filter(Boolean));
+  const added = old.filter((p) => {
+    const key = addressKey(p.url);
+    if (seen.has(key)) return false;
+    seen.add(key);
+    return true;
+  });
+  /** @type {Record<string, unknown>} */
+  const out = {};
+  for (const [key, value] of Object.entries(data)) {
+    if (key === 'profiles' || OLD_KEYS.includes(key)) {
+      if (!('profiles' in out)) out.profiles = [...kept, ...added];
+    } else out[key] = value;
+  }
+  return out;
+}
 
 /**
  * @param {Record<string, unknown> | undefined} raw
  * @returns {Social}
  */
 export function socialOf(raw) {
-  const data = raw || {};
+  const data = upgradeSocial(raw || {});
 
-  // Profiles
+  // Profiles: the filled links, in their order, each with its network (null: one not known).
   const profiles = [];
-  for (const id of PROFILE_IDS) {
-    const value = data[id];
-    if (typeof value === 'string') {
-      const trimmed = value.trim();
-      if (trimmed !== '') {
-        profiles.push({ id, url: trimmed });
-      }
+  for (const item of Array.isArray(data.profiles) ? data.profiles : []) {
+    const value = item && typeof item === 'object' ? item.url : undefined;
+    if (typeof value === 'string' && value.trim() !== '') {
+      const url = value.trim();
+      // Only https:// addresses: the form asks for one, and a file written by hand may have javascript: or the like.
+      if (!/^https:\/\//i.test(url)) continue;
+      profiles.push({ id: networkOf(url)?.id ?? null, url });
     }
   }