Handle frontmatter parts as mdast/frontmatter objects

packages/common/src/utils.ts

@@ -188,23 +188,23 @@ export function updatePageStaticLinksInplace(data: PageLoader, updateUrl: Update
       return { ...exp, url: updateUrl(exp.url) };
     });
   }
-  const allMdastTrees = [data.mdast, ...Object.values(data.frontmatter?.parts ?? {})];
-  allMdastTrees.forEach((tree) => {
+  const allMdastTrees = [data, ...Object.values(data.frontmatter?.parts ?? {})];
+  allMdastTrees.forEach(({ mdast }) => {
     // Fix all of the images to point to the CDN
-    const images = selectAll('image', tree) as Image[];
+    const images = selectAll('image', mdast) as Image[];
     images.forEach((node) => {
       node.url = updateUrl(node.url);
       if (node.urlOptimized) {
         node.urlOptimized = updateUrl(node.urlOptimized);
       }
     });
-    const links = selectAll('link,linkBlock,card', tree) as Link[];
-    const staticLinks = links.filter((node) => node.static);
+    const links = selectAll('link,linkBlock,card', mdast) as Link[];
+    const staticLinks = links?.filter((node) => node.static);
     staticLinks.forEach((node) => {
       // These are static links to thinks like PDFs or other referenced files
       node.url = updateUrl(node.url);
     });
-    const outputs = selectAll('output', tree) as Output[];
+    const outputs = selectAll('output', mdast) as Output[];
     outputs.forEach((node) => {
       if (!node.data) return;
       walkOutputs(node.data, (obj) => {

packages/myst-to-react/src/crossReference.tsx

@@ -13,7 +13,7 @@ import { InlineError } from './inlineError.js';
 import { default as useSWR } from 'swr';
 import { HoverPopover } from './components/index.js';
 import { MyST } from './MyST.js';
-import type { GenericNode } from 'myst-common';
+import type { GenericNode, GenericParent } from 'myst-common';
 import { selectMdastNodes } from 'myst-common';
 import { scrollToElement } from './hashLink.js';
 
@@ -106,11 +106,11 @@ function useSelectNodes({ load, identifier }: { load?: boolean; identifier: stri
   const { remote, url, remoteBaseUrl, dataUrl } = useXRefState();
   if (!load) return;
   const { data, error } = useFetchMdast({ remote, url, remoteBaseUrl, dataUrl });
-  const mdast = data ? data.mdast : references?.article;
-  const parts = data ? data.frontmatter?.parts : frontmatter?.parts;
+  const mdast = data ? (data.mdast as GenericParent) : references?.article;
+  const parts = data ? (data.frontmatter?.parts as { mdast: GenericParent }) : frontmatter?.parts;
   let nodes: GenericNode[] = [];
   let htmlId: string | undefined;
-  [mdast, ...Object.values(parts ?? {})].forEach((tree) => {
+  [{ mdast }, ...Object.values(parts ?? {})].forEach(({ mdast: tree }) => {
     if (!tree || nodes.length > 0) return;
     const selected = selectMdastNodes(tree, identifier, 3);
     nodes = selected.nodes;
@@ -141,8 +141,8 @@ export function CrossReferenceHover({
   const parent = useXRefState();
   const remoteBaseUrl = remoteBaseUrlIn ?? parent.remoteBaseUrl;
   const remote = !!remoteBaseUrl || parent.remote || remoteIn;
-  const url = parent.remote ? urlIn ?? parent.url : urlIn;
-  const dataUrl = parent.remote ? dataUrlIn ?? parent.dataUrl : dataUrlIn;
+  const url = parent.remote ? (urlIn ?? parent.url) : urlIn;
+  const dataUrl = parent.remote ? (dataUrlIn ?? parent.dataUrl) : dataUrlIn;
   const external = !!remoteBaseUrl || (url?.startsWith('http') ?? false);
   const scroll: React.MouseEventHandler<HTMLAnchorElement> = (e) => {
     e.preventDefault();

packages/site/src/pages/Article.tsx

@@ -42,7 +42,14 @@ export const ArticlePage = React.memo(function ({
   const downloads = combineDownloads(manifest?.downloads, article.frontmatter);
   const tree = copyNode(article.mdast);
   const keywords = article.frontmatter?.keywords ?? [];
-  const parts = { ...extractKnownParts(tree), ...article.frontmatter?.parts };
+  const parts = {
+    ...extractKnownParts(tree),
+    ...Object.fromEntries(
+      Object.entries(article.frontmatter?.parts ?? {}).map(([k, v]) => {
+        return [k, v.mdast];
+      }),
+    ),
+  };
 
   return (
     <ReferencesProvider

packages/site/src/pages/ErrorUnhandled.tsx

@@ -8,7 +8,7 @@ export function ErrorUnhandled({ error }: { error: ErrorResponse }) {
     <>
       <h1>Unexpected Error Occurred</h1>
       <p>Status: {error.status}</p>
-      <p>{error.data.message}</p>
+      <p>{error.data?.message ?? ''}</p>
     </>
   );
 }

themes/article/app/components/Article.tsx

@@ -34,7 +34,14 @@ export function Article({
 }) {
   const keywords = article.frontmatter?.keywords ?? [];
   const tree = copyNode(article.mdast);
-  const parts = { ...extractKnownParts(tree), ...article.frontmatter?.parts };
+  const parts = {
+    ...extractKnownParts(tree),
+    ...Object.fromEntries(
+      Object.entries(article.frontmatter?.parts ?? {}).map(([k, v]) => {
+        return [k, v.mdast];
+      }),
+    ),
+  };
   const { title, subtitle } = article.frontmatter;
   const compute = useComputeOptions();
   const top = useThemeTop();

themes/book/app/components/ArticlePage.tsx

@@ -74,7 +74,14 @@ export const ArticlePage = React.memo(function ({
   const downloads = combineDownloads(manifest?.downloads, article.frontmatter);
   const tree = copyNode(article.mdast);
   const keywords = article.frontmatter?.keywords ?? [];
-  const parts = { ...extractKnownParts(tree), ...article.frontmatter?.parts };
+  const parts = {
+    ...extractKnownParts(tree),
+    ...Object.fromEntries(
+      Object.entries(article.frontmatter?.parts ?? {}).map(([k, v]) => {
+        return [k, v.mdast];
+      }),
+    ),
+  };
   const isOutlineMargin = useMediaQuery('(min-width: 1024px)');
   return (
     <ReferencesProvider