@museumwnf/viewer-core 1.14.0 → 1.15.0

package/src/conventions.js

@@ -1,148 +1,252 @@
-import { computed, toValue } from 'vue'
-import { useRoute } from 'vue-router'
-import { useI18n } from './i18n/index.js'
-import { entityRef } from './composables/useEntities.js'
-
-// Three small conventions each website had written for itself.
-
-// ── Project names ──────────────────────────────────────────────────────────
-//
-// `mwnf3.projectnames`, the whole table rather than the projects a website
-// happens to borrow from, since that set moves with every reimport. The key
-// on the left is data; the entry on the right is a shared text
-// (`core.project.*` in viewer-i18n), written out so a reader can see the
-// eight this asks for. A key that is not here reads as itself.
-export const PROJECT_ENTRIES = Object.freeze({
-  ISL: 'core.project.islamicArt',
-  EPM: 'core.project.explorePartners',
-  DBA: 'core.project.baroqueArt',
-  BAR: 'core.project.baroqueArt',
-  AWE: 'core.project.sharingHistory',
-  awe: 'core.project.sharingHistory',
-  DCA: 'core.project.carpetArt',
-  DGA: 'core.project.glassArt',
-  EXTHE: 'core.project.tableIsSet',
-  GALLERIES: 'core.project.galleries',
-})
-
-/** The name of a project by its legacy key, through `t`; the key itself when unknown. */
-export function projectName(key, t) {
-  const entry = PROJECT_ENTRIES[key]
-  return entry ? t(entry) : (key ?? '')
-}
-
-/** `projectName` bound to the installed texts, for a component. */
-export function useProjectName() {
-  const { t } = useI18n()
-  return (key) => projectName(key, t)
-}
-
-// A member is borrowed from the MWNF project that originally published it,
-// and legacy names and colours that project on the item sheet and in the
-// results grid — two separate mappings, because legacy keeps them separate:
-// the name is per project key (`PROJECT_ENTRIES` above), the colour is per
-// project *family*, so ISL and EPM share a swatch and every exhibition
-// shares another. The two exhibition sites re-hard-coded this table as
-// English literals next to their own copy of the name table, which is why a
-// project name translates on the galleries and not on the exhibitions.
-export const PROJECT_FAMILIES = Object.freeze({
-  ISL: 'ISLandEPM',
-  EPM: 'ISLandEPM',
-  DBA: 'DBA',
-  BAR: 'DBA',
-  AWE: 'AWE',
-  awe: 'AWE',
-  DCA: 'DCA',
-  DGA: 'DGA',
-  EXTHE: 'EXH',
-  GALLERIES: 'Galleries',
-})
-
-/** A project's family by its legacy key — legacy's own class names, so a
- * site's CSS reads as the stylesheet it was copied from. A key with no
- * entry falls back to itself, the same rule `projectName` applies. */
-export function projectFamily(key) {
-  return PROJECT_FAMILIES[key] ?? (key ?? '')
-}
-
-// ── The section a route belongs to ─────────────────────────────────────────
-//
-// A route says what section it is (`meta: { section: 'collection' }`), and
-// the shell reads it here for the banner title or the active menu entry.
-// Four shells derived the same thing from `route.path.startsWith(…)` chains
-// of nine branches each; a route already knows.
-export function useSection() {
-  const route = useRoute()
-  return computed(() => String(route.meta?.section ?? ''))
-}
-
-// ── A featured record ──────────────────────────────────────────────────────
-
-// mulberry32 — a small seedable generator, so a test can pin the pick.
-function seeded(seed) {
-  let a = seed >>> 0
-  return () => {
-    a = (a + 0x6d2b79f5) >>> 0
-    let t = a
-    t = Math.imul(t ^ (t >>> 15), t | 1)
-    t ^= t + Math.imul(t ^ (t >>> 7), t | 61)
-    return ((t ^ (t >>> 14)) >>> 0) / 4294967296
-  }
-}
-
-/**
- * One record of `entity` chosen at random for a landing page's spotlight —
- * among those with an image when `withImage` is set (the default), among
- * all when none has one. Null until the entity is loaded. The pick is made
- * once per visit and again only when the records change; `seed` makes it
- * deterministic.
- */
-export function useFeaturedRecord(entity, { withImage = true, seed, images = 'images' } = {}) {
-  const records = entityRef(entity)
-  const random = seed == null ? Math.random : seeded(seed)
-  return computed(() => {
-    const all = toValue(records) ?? []
-    if (all.length === 0) return null
-    const pool = withImage ? all.filter((record) => (record?.[images]?.length ?? 0) > 0) : all
-    const candidates = pool.length > 0 ? pool : all
-    return candidates[Math.floor(random() * candidates.length)] ?? null
-  })
-}
-
-// ── A route's `meta.entities` ────────────────────────────────────────────
-
-/**
- * `sectionMeta(chrome)` returns a `meta(section, ...entities)` helper: a
- * route's `meta: { section, entities: [...chrome, ...entities] }` in one
- * call. `chrome` is the entities every page of the site loads regardless of
- * what it is (the DXA sites' `['gallery', 'items', 'partners', 'countries']`
- * — the shell reads them on every route); a route names on top of that only
- * the entities its own page adds. Four DXA configs each wrote this same
- * four-line closure next to their own `chrome` list.
- */
-export function sectionMeta(chrome = []) {
-  return (section, ...entities) => ({ section, entities: [...chrome, ...entities] })
-}
-
-// ── The MWNF portal ─────────────────────────────────────────────────────
-
-/**
- * The addresses every DXA `dataset.config.js` repeats under `links` —
- * the portal and the sibling standalone sites a gallery or an exhibition
- * links out to. Frozen: a site's own `links` may add to this object but
- * copying it is what this replaces.
- */
-export const mwnfLinks = Object.freeze({
-  portal: 'https://www.museumwnf.org',
-  galleries: 'https://galleries.museumwnf.org',
-  myCollection: 'https://www.museumwnf.org/mycollection/index.php',
-  about: 'https://www.museumwnf.org/about',
-  contact: 'https://www.museumwnf.org/about/contact',
-  legalNotice: 'https://www.museumwnf.org/about/legal-notice',
-  credits: 'https://www.museumwnf.org/about/credits',
-  cookies: 'https://www.museumwnf.org/about/cookies',
-  overallDatabase: 'https://www.museumwnf.org/database_searchform.php',
-  islamicArt: 'https://islamicart.museumwnf.org',
-  baroqueArt: 'https://baroqueart.museumwnf.org',
-  sharingHistory: 'https://sharinghistory.museumwnf.org',
-})
+import { computed, toValue } from 'vue'
+import { useRoute } from 'vue-router'
+import { useI18n } from './i18n/index.js'
+import { entityRef } from './composables/useEntities.js'
+import { useDataPackage } from './composables/useDataPackage.js'
+import { resolveRecordLanguage } from './composables/useRecordLanguage.js'
+
+// Three small conventions each website had written for itself.
+
+// ── Project names ──────────────────────────────────────────────────────────
+//
+// `mwnf3.projectnames`, the whole table rather than the projects a website
+// happens to borrow from, since that set moves with every reimport. The key
+// on the left is data; the entry on the right is a shared text
+// (`core.project.*` in viewer-i18n), written out so a reader can see the
+// eight this asks for. A key that is not here reads as itself.
+//
+// @deprecated Project data belongs in the data package, not in viewer-core.
+// Read a project's name from `manifest.projects` via `projectLabel()` /
+// `useProjects()` instead (epic metanull/inventory-app#1727, phase 3) — see
+// the migration table below. Kept only for sites that have not migrated yet
+// (phase 4); removed in the cleanup wave.
+export const PROJECT_ENTRIES = Object.freeze({
+  ISL: 'core.project.islamicArt',
+  EPM: 'core.project.explorePartners',
+  DBA: 'core.project.baroqueArt',
+  BAR: 'core.project.baroqueArt',
+  AWE: 'core.project.sharingHistory',
+  awe: 'core.project.sharingHistory',
+  DCA: 'core.project.carpetArt',
+  DGA: 'core.project.glassArt',
+  EXTHE: 'core.project.tableIsSet',
+  GALLERIES: 'core.project.galleries',
+})
+
+/** The name of a project by its legacy key, through `t`; the key itself when unknown. */
+export function projectName(key, t) {
+  const entry = PROJECT_ENTRIES[key]
+  return entry ? t(entry) : (key ?? '')
+}
+
+/** `projectName` bound to the installed texts, for a component. */
+export function useProjectName() {
+  const { t } = useI18n()
+  return (key) => projectName(key, t)
+}
+
+// A member is borrowed from the MWNF project that originally published it,
+// and legacy names and colours that project on the item sheet and in the
+// results grid — two separate mappings, because legacy keeps them separate:
+// the name is per project key (`PROJECT_ENTRIES` above), the colour is per
+// project *family*, so ISL and EPM share a swatch and every exhibition
+// shares another. The two exhibition sites re-hard-coded this table as
+// English literals next to their own copy of the name table, which is why a
+// project name translates on the galleries and not on the exhibitions.
+//
+// @deprecated Chip colour is a per-project site-config map keyed by the
+// project UUID (epic #1727 decision 1: no family/parent relation is modeled
+// anywhere, this table was always a frontend invention). Removed in the
+// cleanup wave alongside `PROJECT_ENTRIES`.
+export const PROJECT_FAMILIES = Object.freeze({
+  ISL: 'ISLandEPM',
+  EPM: 'ISLandEPM',
+  DBA: 'DBA',
+  BAR: 'DBA',
+  AWE: 'AWE',
+  awe: 'AWE',
+  DCA: 'DCA',
+  DGA: 'DGA',
+  EXTHE: 'EXH',
+  GALLERIES: 'Galleries',
+})
+
+/**
+ * A project's family by its legacy key — legacy's own class names, so a
+ * site's CSS reads as the stylesheet it was copied from. A key with no
+ * entry falls back to itself, the same rule `projectName` applies.
+ *
+ * @deprecated See `PROJECT_FAMILIES`.
+ */
+export function projectFamily(key) {
+  return PROJECT_FAMILIES[key] ?? (key ?? '')
+}
+
+// ── Projects, from the data package ─────────────────────────────────────────
+//
+// `manifest.projects` (epic metanull/inventory-app#1727, phase 2 —
+// `scripts/exporters`) is what `PROJECT_ENTRIES`/`PROJECT_FAMILIES` above
+// should have been: project data belongs in the data package a project's own
+// exporter writes, not in a table viewer-core carries for every website. Its
+// shape, one entry per project UUID:
+//
+//   manifest.projects[projectId] = {
+//     name: { <lang>: '…' },                    // per-language title
+//     site_url: 'https://…' | null,
+//     related_database_url: 'https://…' | null,
+//     artistic_introduction_url: 'https://…' | null,
+//   }
+//
+// A data package built before this phase simply has no `projects` key at
+// all; `projectLabel`/`projectLinks` answer `null` for that case exactly as
+// they do for an unknown `projectId` — a site notices nothing until it
+// migrates. Migration mapping, from the epic's design comment (§B):
+//
+//   RecordView citation line           → projectLabel(manifest, record.project_id, lang) (viewer-layout#81)
+//   ItemSheet "Source database" line   → same, plus a site-config colour map keyed by project UUID (no more `projectFamily`)
+//   "Search related database" block    → projectLinks(manifest, id).relatedDatabaseUrl, rendered iff non-null
+//   Artistic Introduction link         → projectLinks(manifest, id).artisticIntroductionUrl, iff non-null
+//   search-scope include-EPM checkbox  → stays the site's own dataset.config.js scope list (not modeled here — decision 5)
+//   partner Museums/Institutions split → partner.project_uuids matched against a site-config list (decision 5)
+//
+// `PROJECT_ENTRIES`, `PROJECT_FAMILIES` and `projectFamily` are deprecated by
+// this section and removed in the cleanup wave once every site has moved
+// (phase 4). `projectName()`/`useProjectName()` are unaffected — they still
+// resolve a *legacy key* through the installed texts, for whatever has not
+// migrated yet.
+
+/** One entry of `manifest.projects`, or `null` when the package predates
+ * the section or does not carry `projectId`. */
+function projectEntry(manifest, projectId) {
+  return manifest?.projects?.[projectId] ?? null
+}
+
+/**
+ * The name of a project by its data-package UUID, from
+ * `manifest.projects[projectId].name`. Language fallback follows the same
+ * rule every translated field in this package does (`resolveRecordLanguage`):
+ * `lang` when the entry carries it, this package's base language (`en`)
+ * when it does not, the first language the entry carries when it has
+ * neither. `null` — never a thrown error — when the package has no
+ * `projects` section, `projectId` is not one of its keys, or the entry
+ * names nothing at all.
+ */
+export function projectLabel(manifest, projectId, lang) {
+  const names = projectEntry(manifest, projectId)?.name
+  const codes = names ? Object.keys(names) : []
+  if (codes.length === 0) return null
+  return names[resolveRecordLanguage(codes, lang)] ?? null
+}
+
+/**
+ * The three URLs `manifest.projects[projectId]` carries. `null` for the
+ * whole result (not per field) when the package predates the section or
+ * does not carry `projectId`; each field is `null` on its own when the
+ * project simply has no value for it (import time never invents one).
+ */
+export function projectLinks(manifest, projectId) {
+  const entry = projectEntry(manifest, projectId)
+  if (!entry) return null
+  return {
+    siteUrl: entry.site_url ?? null,
+    relatedDatabaseUrl: entry.related_database_url ?? null,
+    artisticIntroductionUrl: entry.artistic_introduction_url ?? null,
+  }
+}
+
+/**
+ * `projectLabel`/`projectLinks` bound to the installed data package and
+ * texts, for a component — the manifest-driven analogue of
+ * `useProjectName()`. `label(projectId)` reads the site's active language;
+ * pass a language explicitly to read another.
+ */
+export function useProjects() {
+  const { manifest } = useDataPackage()
+  const { locale } = useI18n()
+  return {
+    label: (projectId, lang = locale.value) => projectLabel(manifest, projectId, lang),
+    links: (projectId) => projectLinks(manifest, projectId),
+  }
+}
+
+// ── The section a route belongs to ─────────────────────────────────────────
+//
+// A route says what section it is (`meta: { section: 'collection' }`), and
+// the shell reads it here for the banner title or the active menu entry.
+// Four shells derived the same thing from `route.path.startsWith(…)` chains
+// of nine branches each; a route already knows.
+export function useSection() {
+  const route = useRoute()
+  return computed(() => String(route.meta?.section ?? ''))
+}
+
+// ── A featured record ──────────────────────────────────────────────────────
+
+// mulberry32 — a small seedable generator, so a test can pin the pick.
+function seeded(seed) {
+  let a = seed >>> 0
+  return () => {
+    a = (a + 0x6d2b79f5) >>> 0
+    let t = a
+    t = Math.imul(t ^ (t >>> 15), t | 1)
+    t ^= t + Math.imul(t ^ (t >>> 7), t | 61)
+    return ((t ^ (t >>> 14)) >>> 0) / 4294967296
+  }
+}
+
+/**
+ * One record of `entity` chosen at random for a landing page's spotlight —
+ * among those with an image when `withImage` is set (the default), among
+ * all when none has one. Null until the entity is loaded. The pick is made
+ * once per visit and again only when the records change; `seed` makes it
+ * deterministic.
+ */
+export function useFeaturedRecord(entity, { withImage = true, seed, images = 'images' } = {}) {
+  const records = entityRef(entity)
+  const random = seed == null ? Math.random : seeded(seed)
+  return computed(() => {
+    const all = toValue(records) ?? []
+    if (all.length === 0) return null
+    const pool = withImage ? all.filter((record) => (record?.[images]?.length ?? 0) > 0) : all
+    const candidates = pool.length > 0 ? pool : all
+    return candidates[Math.floor(random() * candidates.length)] ?? null
+  })
+}
+
+// ── A route's `meta.entities` ────────────────────────────────────────────
+
+/**
+ * `sectionMeta(chrome)` returns a `meta(section, ...entities)` helper: a
+ * route's `meta: { section, entities: [...chrome, ...entities] }` in one
+ * call. `chrome` is the entities every page of the site loads regardless of
+ * what it is (the DXA sites' `['gallery', 'items', 'partners', 'countries']`
+ * — the shell reads them on every route); a route names on top of that only
+ * the entities its own page adds. Four DXA configs each wrote this same
+ * four-line closure next to their own `chrome` list.
+ */
+export function sectionMeta(chrome = []) {
+  return (section, ...entities) => ({ section, entities: [...chrome, ...entities] })
+}
+
+// ── The MWNF portal ─────────────────────────────────────────────────────
+
+/**
+ * The addresses every DXA `dataset.config.js` repeats under `links` —
+ * the portal and the sibling standalone sites a gallery or an exhibition
+ * links out to. Frozen: a site's own `links` may add to this object but
+ * copying it is what this replaces.
+ */
+export const mwnfLinks = Object.freeze({
+  portal: 'https://www.museumwnf.org',
+  galleries: 'https://galleries.museumwnf.org',
+  myCollection: 'https://www.museumwnf.org/mycollection/index.php',
+  about: 'https://www.museumwnf.org/about',
+  contact: 'https://www.museumwnf.org/about/contact',
+  legalNotice: 'https://www.museumwnf.org/about/legal-notice',
+  credits: 'https://www.museumwnf.org/about/credits',
+  cookies: 'https://www.museumwnf.org/about/cookies',
+  overallDatabase: 'https://www.museumwnf.org/database_searchform.php',
+  islamicArt: 'https://islamicart.museumwnf.org',
+  baroqueArt: 'https://baroqueart.museumwnf.org',
+  sharingHistory: 'https://sharinghistory.museumwnf.org',
+})

package/src/createViewer.js

@@ -1,29 +1,29 @@
-import { createApp } from 'vue'
-import AppRoot from './AppRoot.vue'
-import { useDataPackage } from './composables/useDataPackage.js'
-import { createI18n } from './i18n/index.js'
-import { connectLanguageToRouter, resolveInitialLanguage } from './i18n/language.js'
-import { VIEWER_CONFIG } from './injectionKeys.js'
-import { createViewerRouter } from './router/index.js'
-import { setSiteConfig } from './siteConfig.js'
-import './styles/base.css'
-
-export function createViewer(config = {}) {
-  const { languages: datasetLanguages } = useDataPackage()
-  const languages = config.languages ?? datasetLanguages
-  const messages = config.messages ?? {}
-  const resolved = { ...config, languages }
-
-  const router = createViewerRouter(config)
-  const i18n = createI18n({ messages, locale: resolveInitialLanguage(languages) })
-
-  const app = createApp(AppRoot)
-  setSiteConfig(resolved)
-  app.provide(VIEWER_CONFIG, resolved)
-  app.use(router)
-  app.use(i18n)
-
-  connectLanguageToRouter({ locale: i18n.locale, offered: languages, router })
-
-  return app
-}
+import { createApp } from 'vue'
+import AppRoot from './AppRoot.vue'
+import { useDataPackage } from './composables/useDataPackage.js'
+import { createI18n } from './i18n/index.js'
+import { connectLanguageToRouter, resolveInitialLanguage } from './i18n/language.js'
+import { VIEWER_CONFIG } from './injectionKeys.js'
+import { createViewerRouter } from './router/index.js'
+import { setSiteConfig } from './siteConfig.js'
+import './styles/base.css'
+
+export function createViewer(config = {}) {
+  const { languages: datasetLanguages } = useDataPackage()
+  const languages = config.languages ?? datasetLanguages
+  const messages = config.messages ?? {}
+  const resolved = { ...config, languages }
+
+  const router = createViewerRouter(config)
+  const i18n = createI18n({ messages, locale: resolveInitialLanguage(languages) })
+
+  const app = createApp(AppRoot)
+  setSiteConfig(resolved)
+  app.provide(VIEWER_CONFIG, resolved)
+  app.use(router)
+  app.use(i18n)
+
+  connectLanguageToRouter({ locale: i18n.locale, offered: languages, router })
+
+  return app
+}

package/src/i18n/I18nText.vue

@@ -1,17 +1,17 @@
-<script setup>
-import { computed } from 'vue'
-import { useI18n } from './index.js'
-import { renderBlock } from './markdown.js'
-
-const props = defineProps({
-  keypath: { type: String, required: true },
-  tag: { type: String, default: 'div' },
-})
-
-const { t } = useI18n()
-const html = computed(() => renderBlock(t(props.keypath)))
-</script>
-
-<template>
-  <component :is="tag" class="vc-text" v-html="html" />
-</template>
+<script setup>
+import { computed } from 'vue'
+import { useI18n } from './index.js'
+import { renderBlock } from './markdown.js'
+
+const props = defineProps({
+  keypath: { type: String, required: true },
+  tag: { type: String, default: 'div' },
+})
+
+const { t } = useI18n()
+const html = computed(() => renderBlock(t(props.keypath)))
+</script>
+
+<template>
+  <component :is="tag" class="vc-text" v-html="html" />
+</template>

package/src/i18n/I18nTextInline.vue

@@ -1,17 +1,17 @@
-<script setup>
-import { computed } from 'vue'
-import { useI18n } from './index.js'
-import { renderInline } from './markdown.js'
-
-const props = defineProps({
-  keypath: { type: String, required: true },
-  tag: { type: String, default: 'span' },
-})
-
-const { t } = useI18n()
-const html = computed(() => renderInline(t(props.keypath)))
-</script>
-
-<template>
-  <component :is="tag" class="vc-text-inline" v-html="html" />
-</template>
+<script setup>
+import { computed } from 'vue'
+import { useI18n } from './index.js'
+import { renderInline } from './markdown.js'
+
+const props = defineProps({
+  keypath: { type: String, required: true },
+  tag: { type: String, default: 'span' },
+})
+
+const { t } = useI18n()
+const html = computed(() => renderInline(t(props.keypath)))
+</script>
+
+<template>
+  <component :is="tag" class="vc-text-inline" v-html="html" />
+</template>