@canopy-iiif/app 1.5.15 → 1.5.17

package/lib/build/mdx.js

@@ -11,6 +11,7 @@ const {
   CACHE_DIR,
   ensureDirSync,
   withBase,
+  readSiteMetadata,
 } = require("../common");
 let remarkGfm = null;
 try {
@@ -1043,10 +1044,12 @@ async function compileMdxFile(filePath, outPath, Layout, extraProps = {}) {
     : contentNode;
   const withApp = React.createElement(app.App, null, withLayout);
   const PageContext = getPageContext();
+  const siteMeta = readSiteMetadata();
   const contextValue = {
     navigation:
       extraProps && extraProps.navigation ? extraProps.navigation : null,
     page: extraProps && extraProps.page ? extraProps.page : null,
+    site: siteMeta ? {...siteMeta} : null,
   };
   const withContext = PageContext
     ? React.createElement(PageContext.Provider, {value: contextValue}, withApp)

package/lib/common.js

@@ -1,6 +1,7 @@
 const fs = require('fs');
 const fsp = fs.promises;
 const path = require('path');
+const yaml = require('js-yaml');
 const { resolveCanopyConfigPath } = require('./config-path');
 
 const CONTENT_DIR = path.resolve('content');
@@ -13,6 +14,11 @@ const { readBasePath, withBasePath } = require('./base-path');
 const BASE_PATH = readBasePath();
 let cachedAppearance = null;
 let cachedAccent = null;
+let cachedSiteMetadata = null;
+let cachedSearchPageMetadata = null;
+const DEFAULT_SITE_TITLE = 'Site title';
+const DEFAULT_SEARCH_PAGE_TITLE = 'Search';
+const DEFAULT_SEARCH_PAGE_DESCRIPTION = '';
 
 function resolveThemeAppearance() {
   if (cachedAppearance) return cachedAppearance;
@@ -47,17 +53,69 @@ function resolveThemeAccent() {
 
 function readYamlConfigBaseUrl() {
   try {
-    const y = require('js-yaml');
     const p = resolveCanopyConfigPath();
     if (!fs.existsSync(p)) return '';
     const raw = fs.readFileSync(p, 'utf8');
-    const data = y.load(raw) || {};
+    const data = yaml.load(raw) || {};
     const site = data && data.site;
     const url = site && site.baseUrl ? String(site.baseUrl) : '';
     return url;
   } catch (_) { return ''; }
 }
 
+function readSiteMetadata() {
+  if (cachedSiteMetadata) return cachedSiteMetadata;
+  cachedSiteMetadata = { title: DEFAULT_SITE_TITLE };
+  try {
+    const cfgPath = resolveCanopyConfigPath();
+    if (!fs.existsSync(cfgPath)) return cachedSiteMetadata;
+    const raw = fs.readFileSync(cfgPath, 'utf8');
+    const data = yaml.load(raw) || {};
+    const directTitle = data && typeof data.title === 'string' ? data.title.trim() : '';
+    const nestedTitle =
+      data && data.site && typeof data.site.title === 'string'
+        ? data.site.title.trim()
+        : '';
+    const resolved = directTitle || nestedTitle || DEFAULT_SITE_TITLE;
+    cachedSiteMetadata = { title: resolved };
+  } catch (_) {}
+  return cachedSiteMetadata;
+}
+
+function getSiteTitle() {
+  const site = readSiteMetadata();
+  if (site && typeof site.title === 'string' && site.title.trim()) {
+    return site.title.trim();
+  }
+  return DEFAULT_SITE_TITLE;
+}
+
+function readSearchPageMetadata() {
+  if (cachedSearchPageMetadata) return cachedSearchPageMetadata;
+  cachedSearchPageMetadata = {
+    title: DEFAULT_SEARCH_PAGE_TITLE,
+    description: DEFAULT_SEARCH_PAGE_DESCRIPTION,
+  };
+  try {
+    const cfgPath = resolveCanopyConfigPath();
+    if (!fs.existsSync(cfgPath)) return cachedSearchPageMetadata;
+    const raw = fs.readFileSync(cfgPath, 'utf8');
+    const data = yaml.load(raw) || {};
+    const searchCfg = data && data.search ? data.search : null;
+    const pageCfg = searchCfg && searchCfg.page ? searchCfg.page : null;
+    const title = pageCfg && typeof pageCfg.title === 'string' ? pageCfg.title.trim() : '';
+    const description =
+      pageCfg && typeof pageCfg.description === 'string'
+        ? pageCfg.description.trim()
+        : '';
+    cachedSearchPageMetadata = {
+      title: title || DEFAULT_SEARCH_PAGE_TITLE,
+      description: description || DEFAULT_SEARCH_PAGE_DESCRIPTION,
+    };
+  } catch (_) {}
+  return cachedSearchPageMetadata;
+}
+
 // Determine the absolute site origin (scheme + host[:port])
 // Priority:
 // 1) CANOPY_BASE_URL env
@@ -224,4 +282,10 @@ module.exports = {
   applyBaseToHtml,
   rootRelativeHref,
   canopyBodyClassForType,
+  readSiteMetadata,
+  getSiteTitle,
+  DEFAULT_SITE_TITLE,
+  readSearchPageMetadata,
+  DEFAULT_SEARCH_PAGE_TITLE,
+  DEFAULT_SEARCH_PAGE_DESCRIPTION,
 };

package/lib/head.js

@@ -1,5 +1,5 @@
 const React = require('react');
-const { withBase, rootRelativeHref, absoluteUrl } = require('./common');
+const { withBase, rootRelativeHref, absoluteUrl, getSiteTitle } = require('./common');
 const { getPageContext } = require('./page-context');
 
 const DEFAULT_STYLESHEET_PATH = '/styles/styles.css';
@@ -56,10 +56,16 @@ function Meta(props = {}) {
     page.title ||
     fallbackTitle;
   const pageTitle = normalizeText(rawTitle);
-  const siteTitle = normalizeText(props.siteTitle) || '';
-  const defaultTitle = siteTitle || 'Canopy IIIF';
+  const fallbackSiteTitle = normalizeText(getSiteTitle()) || '';
+  const explicitSiteTitle = normalizeText(props.siteTitle) || '';
+  const siteTitle = explicitSiteTitle || fallbackSiteTitle;
+  const defaultTitle = siteTitle || fallbackSiteTitle || 'Site title';
   const title = pageTitle ? pageTitle : defaultTitle;
-  const fullTitle = siteTitle ? (pageTitle ? `${pageTitle} | ${siteTitle}` : siteTitle) : title;
+  const fullTitle = siteTitle
+    ? pageTitle
+      ? `${pageTitle} | ${siteTitle}`
+      : siteTitle
+    : title;
   const rawDescription =
     props.description ||
     (metaFromPage && metaFromPage.description) ||
@@ -108,6 +114,35 @@ function Meta(props = {}) {
   if (description) nodes.push(React.createElement('meta', { key: 'twitter-description', name: 'twitter:description', content: description }));
   if (twitterImage) nodes.push(React.createElement('meta', { key: 'twitter-image', name: 'twitter:image', content: twitterImage }));
 
+  const slug = typeof page.slug === 'string' ? page.slug : '';
+  const relPath = typeof page.relativePath === 'string' ? page.relativePath : '';
+  const hrefRaw = page && typeof page.href === 'string' ? page.href : '';
+  const urlRaw = page && typeof page.url === 'string' ? page.url : '';
+  const normalizedHref = hrefRaw ? rootRelativeHref(hrefRaw) : '';
+  const normalizedUrl = urlRaw ? rootRelativeHref(urlRaw) : '';
+  const isHomepage = !!(
+    (slug === '' && page && page.isIndex) ||
+    relPath === 'index.mdx' ||
+    normalizedHref === '/' ||
+    normalizedUrl === '/'
+  );
+  const siteTitleForJsonLd = siteTitle || fallbackSiteTitle || 'Site title';
+  if (isHomepage && siteTitleForJsonLd) {
+    const ldPayload = {
+      '@context': 'https://schema.org',
+      '@type': 'WebSite',
+      name: siteTitleForJsonLd,
+      url: absoluteUrl('/'),
+    };
+    nodes.push(
+      React.createElement('script', {
+        key: 'canopy-website-json-ld',
+        type: 'application/ld+json',
+        dangerouslySetInnerHTML: { __html: JSON.stringify(ldPayload) },
+      })
+    );
+  }
+
   return React.createElement(React.Fragment, null, nodes);
 }
 

package/lib/page-context.js

@@ -13,7 +13,7 @@ function getGlobalRoot() {
 function getPageContext() {
   const root = getGlobalRoot();
   if (root[CONTEXT_KEY]) return root[CONTEXT_KEY];
-  const ctx = React.createContext({ navigation: null, page: null });
+  const ctx = React.createContext({ navigation: null, page: null, site: null });
   root[CONTEXT_KEY] = ctx;
   return ctx;
 }

package/lib/search/search.js

@@ -11,6 +11,7 @@ const {
   OUT_DIR,
   htmlShell,
   canopyBodyClassForType,
+  readSearchPageMetadata,
 } = require('../common');
 const { resolveCanopyConfigPath } = require('../config-path');
 
@@ -259,14 +260,25 @@ async function buildSearchPage() {
     }
     const mdx = require('../build/mdx');
     const searchHref = rootRelativeHref('search.html');
+    const searchPageMeta = readSearchPageMetadata() || {};
+    const pageTitle =
+      typeof searchPageMeta.title === 'string' && searchPageMeta.title.trim()
+        ? searchPageMeta.title.trim()
+        : 'Search';
+    const pageDescription =
+      typeof searchPageMeta.description === 'string'
+        ? searchPageMeta.description
+        : '';
     const pageDetails = {
-      title: 'Search',
+      title: pageTitle,
+      description: pageDescription,
       href: searchHref,
       url: searchHref,
       type: 'search',
       canonical: searchHref,
       meta: {
-        title: 'Search',
+        title: pageTitle,
+        description: pageDescription,
         type: 'search',
         url: searchHref,
         canonical: searchHref,
@@ -312,7 +324,7 @@ async function buildSearchPage() {
       }
     } catch (_) {}
     const bodyClass = canopyBodyClassForType('search');
-    let html = htmlShell({ title: 'Search', body, cssHref: null, scriptHref: jsRel, headExtra, bodyClass });
+    let html = htmlShell({ title: pageTitle, body, cssHref: null, scriptHref: jsRel, headExtra, bodyClass });
     try { html = require('../common').applyBaseToHtml(html); } catch (_) {}
     await fsp.writeFile(outPath, html, 'utf8');
     console.log('Search: Built', path.relative(process.cwd(), outPath));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@canopy-iiif/app",
-  "version": "1.5.15",
+  "version": "1.5.17",
   "private": false,
   "license": "MIT",
   "author": "Mat Jordan <mat@northwestern.edu>",

package/ui/dist/index.mjs

@@ -1211,7 +1211,7 @@ function getSharedRoot() {
 function getSafePageContext() {
   const root = getSharedRoot();
   if (root && root[CONTEXT_KEY]) return root[CONTEXT_KEY];
-  const ctx = React15.createContext({ navigation: null, page: null });
+  const ctx = React15.createContext({ navigation: null, page: null, site: null });
   if (root) root[CONTEXT_KEY] = ctx;
   return ctx;
 }
@@ -1278,13 +1278,18 @@ function CanopyHeader(props = {}) {
     searchHotkey = "mod+k",
     searchPlaceholder = "Search\u2026",
     brandHref = "/",
-    title = "Canopy IIIF",
+    title: titleProp,
     logo: SiteLogo
   } = props;
   const navLinks = ensureArray(navLinksProp);
   const PageContext = getSafePageContext();
   const context = React15.useContext(PageContext);
   const contextNavigation = context && context.navigation ? context.navigation : null;
+  const contextSite = context && context.site ? context.site : null;
+  const contextSiteTitle = contextSite && typeof contextSite.title === "string" ? contextSite.title.trim() : "";
+  const defaultHeaderTitle = contextSiteTitle || "Site title";
+  const normalizedTitleProp = typeof titleProp === "string" ? titleProp.trim() : "";
+  const resolvedTitle = normalizedTitleProp || defaultHeaderTitle;
   const sectionNavigation = contextNavigation && contextNavigation.root ? contextNavigation : null;
   const navigationRoots = contextNavigation && contextNavigation.allRoots ? contextNavigation.allRoots : null;
   const sectionHeading = sectionNavigation && sectionNavigation.title || (sectionNavigation && sectionNavigation.root ? sectionNavigation.root.title : "");
@@ -1313,7 +1318,7 @@ function CanopyHeader(props = {}) {
     /* @__PURE__ */ React15.createElement("div", { className: "canopy-header__brand" }, /* @__PURE__ */ React15.createElement(
       CanopyBrand,
       {
-        label: title,
+        label: resolvedTitle,
         href: brandHref,
         className: "canopy-header__brand-link",
         Logo: SiteLogo
@@ -1408,7 +1413,7 @@ function CanopyHeader(props = {}) {
       id: "canopy-modal-nav",
       variant: "nav",
       labelledBy: "canopy-modal-nav-label",
-      label: title,
+      label: resolvedTitle,
       logo: SiteLogo,
       href: brandHref,
       closeLabel: "Close navigation",
@@ -1503,7 +1508,7 @@ function CanopyHeader(props = {}) {
       id: "canopy-modal-search",
       variant: "search",
       labelledBy: "canopy-modal-search-label",
-      label: title,
+      label: resolvedTitle,
       logo: SiteLogo,
       href: brandHref,
       closeLabel: "Close search",