add Example endpoint

This commit is contained in:
jasongao97 2024-01-24 14:28:44 +08:00
parent 687b0a7900
commit 13d23d9c6c
3 changed files with 82 additions and 12 deletions

View file

@ -20,6 +20,26 @@ module.exports = ({ createResolvers }) => {
},
},
},
Example: {
screenshot: {
type: 'File',
resolve: async (source, args, context, info) => {
const screenshot = await context.nodeModel.findOne({
type: 'File',
query: {
filter: {
relativeDirectory: {
eq: source.relativeDirectory,
},
internal: { mediaType: { regex: '/^(image)/' } },
},
},
});
return screenshot;
},
},
},
};
createResolvers(resolvers);
};

View file

@ -67,15 +67,6 @@ export function parseContent(html) {
const ast = unified().use(rehypeParse, { fragment: true }).parse(html);
const transformedAst = unified()
.use(replaceMedia)
.use(externalLinkInNewTab)
.use(rehypeCodesplit)
.use(rehypeHighlight)
.use(rehypeSlug)
.use(rehypeKatex)
.runSync(ast);
/**
* Generate Table of Content
*/
@ -88,8 +79,46 @@ export function parseContent(html) {
});
});
/**
* List all examples
*/
const examples = [];
visit(ast, { tagName: 'div' }, (node) => {
if (node.properties.dataType !== 'example') {
return;
}
// Locate the h3 element within the current node's children
const titleNode = node.children.find((child) => child.tagName === 'h3');
const slug = titleNode && titleNode.properties.id;
const title =
titleNode && titleNode.children.length > 0
? titleNode.children[0].value
: '';
visit(node, { tagName: 'div' }, (embedDivNode) => {
if (embedDivNode.properties.dataType !== 'embed') return;
examples.push({
title,
slug,
relativeDirectory: embedDivNode.properties.dataExamplePath,
webEditorURL: embedDivNode.properties.dataP5Editor,
});
});
});
const transformedAst = unified()
.use(replaceMedia)
.use(externalLinkInNewTab)
.use(rehypeCodesplit)
.use(rehypeHighlight)
.use(rehypeSlug)
.use(rehypeKatex)
.runSync(ast);
return {
ast: transformedAst,
toc,
examples,
};
}

View file

@ -1,5 +1,11 @@
module.exports = async ({ node, actions, loadNodeContent }) => {
const { createNodeField } = actions;
module.exports = async ({
node,
actions,
loadNodeContent,
createContentDigest,
createNodeId,
}) => {
const { createNodeField, createNode, createParentChildLink } = actions;
if (node.internal.mediaType !== `text/html`) {
return;
@ -9,7 +15,7 @@ module.exports = async ({ node, actions, loadNodeContent }) => {
// load the html source to every HTML file node
const content = await loadNodeContent(node);
const { ast, toc } = parseContent(content);
const { ast, toc, examples } = parseContent(content);
createNodeField({
node,
@ -22,4 +28,19 @@ module.exports = async ({ node, actions, loadNodeContent }) => {
name: 'toc',
value: JSON.stringify(toc),
});
for (let example of examples) {
const exampleNode = {
id: createNodeId(example.relativeDirectory),
parent: node.id,
internal: {
type: 'Example',
contentDigest: createContentDigest(example),
},
...example,
};
createNode(exampleNode);
createParentChildLink({ parent: node, child: exampleNode });
}
};