Today's coding scratchpad shows my thought process working through a valid return value for Docusaurus's frontmatter. You can see my left-right-left-right shuffle through "Will it render an array? No? It's a map? Just checking, is it really?" The answer is that Docusaurus will make Maps within Maps within Maps for any frontmatter values to capture the nested structure. flatMap() to the rescue! Probably a very common pattern to work with.

Here is the code for future me to look back on fondly when the heat death of the internet nukes photos:

<!-- Ugly -->

<!--
<ul>
{
Object.entries(frontMatter).filter(
    frontmatter => frontmatter[0] === 'tags'
    ).flat().slice(1,).flat().map((value) => <li> {value} </li>)
}
</ul>
-->

<!-- Better -->

<!--
<ul>
{
Object.entries(frontMatter).filter(
    frontmatter => frontmatter[0] === 'tags')[0].pop().map(
    (value) => <button class='tag__badge'><li classname='tag__badge'> {value} </li></button>)
}
</ul> 
-->   

<!-- Best -->

<ul>
{
Object.entries(frontMatter).filter(
    frontmatter => frontmatter[0] === 'tags')[0].flatMap(
    (value) => <button class='tag__badge'><li classname='tag__badge'> {value} </li></button>)
}
</ul>