@MattReimer Based on our discussions, I am pulling in all pages MDX files as defined in gatsby-config.js and using their information for the side menu. Please test and verify if the setup is as intended.
Summary
This pull request introduces a new AllPagesMenu component, which dynamically generates a nested navigation menu based on a provided list of MDX nodes. The component processes the page nodes, which include titles and slugs from the MDX frontmatter, to group them by slug levels and output a structured navigation menu.
Changes
New Component: AllPagesMenu
Takes nodes, heading, headingType, and showHeading as props.
Default heading is "All pages".
Default headingType is 'h2'.
Default showHeading is false.
Utility Functions:
convertToStructure(entries): Recursively transforms grouped entries into a new object structure suitable for the SideNav component.
groupItemsBySlugLevels(entries): Groups page entries by their slug levels, facilitating the creation of nested menu items.
Integration:
The groupedItemsObject is passed to the SideNav component as content.
Implementation Details
Grouping Logic:
groupItemsBySlugLevels(entries): Iterates through the page nodes to group them by their slug levels.
Constructs a nested object where each level corresponds to a part of the slug path.
Each entry at the final slug level includes the url and title.
Conversion to Menu Structure:
convertToStructure(entries): Converts the grouped object into an array format suitable for rendering by the SideNav component.
Ensures that each item contains title, url, and items properties.
Rendering:
The AllPagesMenu component renders a nav element containing the SideNav component.
Passes the structured navigation data and heading configuration to SideNav.
@MattReimer Based on our discussions, I am pulling in all pages MDX files as defined in
gatsby-config.jsand using their information for the side menu. Please test and verify if the setup is as intended.Summary
This pull request introduces a new
AllPagesMenucomponent, which dynamically generates a nested navigation menu based on a provided list of MDX nodes. The component processes the page nodes, which include titles and slugs from the MDX frontmatter, to group them by slug levels and output a structured navigation menu.Changes
AllPagesMenunodes,heading,headingType, andshowHeadingas props.headingis "All pages".headingTypeis 'h2'.showHeadingisfalse.convertToStructure(entries): Recursively transforms grouped entries into a new object structure suitable for theSideNavcomponent.groupItemsBySlugLevels(entries): Groups page entries by their slug levels, facilitating the creation of nested menu items.groupedItemsObjectis passed to theSideNavcomponent ascontent.Implementation Details
groupItemsBySlugLevels(entries): Iterates through the page nodes to group them by their slug levels.urlandtitle.convertToStructure(entries): Converts the grouped object into an array format suitable for rendering by theSideNavcomponent.title,url, anditemsproperties.AllPagesMenucomponent renders anavelement containing theSideNavcomponent.SideNav.