From 8162b64ac33d6fb303724612feea0047e552ce5d Mon Sep 17 00:00:00 2001 From: Matt Reimer Date: Fri, 3 Jan 2025 14:35:40 -0500 Subject: [PATCH] sort by weight is back #33 --- .../contentPages/contentSubFolder/index.mdx | 1 + .../page/contentPages/interiorPage.mdx | 1 + .../content/page/contentPages/noWeight.mdx | 7 +++ sites/devsite/content/page/index.mdx | 6 ++- theme/gatsby-node.js | 1 + theme/src/components/menus/allPagesMenu.tsx | 46 +++++++++++++------ theme/src/templates/PageTemplate.tsx | 3 ++ 7 files changed, 49 insertions(+), 16 deletions(-) create mode 100644 sites/devsite/content/page/contentPages/noWeight.mdx diff --git a/sites/devsite/content/page/contentPages/contentSubFolder/index.mdx b/sites/devsite/content/page/contentPages/contentSubFolder/index.mdx index 703adfa..da4aabe 100644 --- a/sites/devsite/content/page/contentPages/contentSubFolder/index.mdx +++ b/sites/devsite/content/page/contentPages/contentSubFolder/index.mdx @@ -1,6 +1,7 @@ --- title: SubPage banner: true +menuWeight: 1 --- Consectetur laboris eiusmod ad eiusmod nostrud proident est voluptate officia tempor. Exercitation eiusmod deserunt occaecat elit. Voluptate sunt sint veniam velit cillum magna occaecat ut cillum eiusmod pariatur ullamco ad. Excepteur culpa veniam duis nostrud Lorem duis aliquip elit adipisicing mollit consequat. Est excepteur amet cupidatat excepteur nostrud. Sunt sunt aliquip excepteur ea consequat. diff --git a/sites/devsite/content/page/contentPages/interiorPage.mdx b/sites/devsite/content/page/contentPages/interiorPage.mdx index 26e755a..0b77736 100644 --- a/sites/devsite/content/page/contentPages/interiorPage.mdx +++ b/sites/devsite/content/page/contentPages/interiorPage.mdx @@ -1,5 +1,6 @@ --- title: Interior Page +menuWeight: 4 --- Culpa ipsum eiusmod labore in in nulla duis incididunt labore. Amet ullamco minim enim aliqua nostrud velit aute sunt nostrud duis enim dolore. Reprehenderit anim aute voluptate officia duis ea laborum eiusmod consectetur ex. diff --git a/sites/devsite/content/page/contentPages/noWeight.mdx b/sites/devsite/content/page/contentPages/noWeight.mdx new file mode 100644 index 0000000..61b3017 --- /dev/null +++ b/sites/devsite/content/page/contentPages/noWeight.mdx @@ -0,0 +1,7 @@ +--- +title: No Weight +--- + +Culpa ipsum eiusmod labore in in nulla duis incididunt labore. Amet ullamco minim enim aliqua nostrud velit aute sunt nostrud duis enim dolore. Reprehenderit anim aute voluptate officia duis ea laborum eiusmod consectetur ex. + +Ea consectetur ex dolore est aliqua ad cupidatat dolore. Eu ad labore cupidatat anim adipisicing velit. Nostrud duis et Lorem occaecat enim exercitation ut ad. Magna nostrud ipsum esse ex enim adipisicing sunt cillum consequat. Sunt nulla exercitation est sunt. \ No newline at end of file diff --git a/sites/devsite/content/page/index.mdx b/sites/devsite/content/page/index.mdx index 7973462..5fd14f8 100644 --- a/sites/devsite/content/page/index.mdx +++ b/sites/devsite/content/page/index.mdx @@ -1,9 +1,13 @@ --- -title: Home +title: Gatsby Theme Test Site description: "Riverscapes website" banner: true --- +This is not really a Riverscapes site. It is a test for the Gatsby theme. + +Please go to [riverscapes.net](https://riverscapes.net) to learn more about the riverscapes consortium. + This is the homepage. hello [this is an internal link to fair](./About_Us/fair). - [LINK1](./About_Us/fair). diff --git a/theme/gatsby-node.js b/theme/gatsby-node.js index 5a7a85d..66415f4 100644 --- a/theme/gatsby-node.js +++ b/theme/gatsby-node.js @@ -95,6 +95,7 @@ exports.createSchemaCustomization = ({ actions }) => { } type MdxFrontmatter { title: String + menuWeight: Int description: String blurb: String date(formatString: String): String diff --git a/theme/src/components/menus/allPagesMenu.tsx b/theme/src/components/menus/allPagesMenu.tsx index 6ebad3d..b8e6b3f 100644 --- a/theme/src/components/menus/allPagesMenu.tsx +++ b/theme/src/components/menus/allPagesMenu.tsx @@ -15,19 +15,34 @@ const AllPagesMenu: React.FC = ({ showHeading = false, }) => { // Function to group entries based on slug levels and convert to new object structure - const convertToStructure = (entries) => { - return Object.keys(entries).map((key) => { - const entry = entries[key] - const newItem = { - title: entry.title || key, - url: entry.url || '', - items: [], - } - if (entry.items) { - newItem.items = convertToStructure(entry.items) - } - return newItem - }) + const convertToStructure = (groupedItems) => { + const result = [] + + const traverse = (items, parent = null) => { + Object.keys(items).forEach((key) => { + const item = items[key] + const newItem = { + title: item.title || key, + url: item.url || '', + menuWeight: item.menuWeight || 999, + items: [], + } + if (item.items) { + traverse(item.items, newItem.items) + } + parent.push(newItem) + }) + // Sort the items array first by weight and then alphabetically by title + parent.sort((a, b) => { + if (a.menuWeight !== b.menuWeight) { + return a.menuWeight - b.menuWeight + } + return a.title.localeCompare(b.title) + }) + } + + traverse(groupedItems, result) + return result } // Function to group entries based on slug levels @@ -44,14 +59,15 @@ const AllPagesMenu: React.FC = ({ slugLevels.forEach((level, index) => { if (!currentGroup[level]) { - currentGroup[level] = {} + currentGroup[level] = { items: [] } } if (index === slugLevels.length - 1) { currentGroup[level].url = entry.fields.slug || '' currentGroup[level].title = entry.frontmatter.title + currentGroup[level].menuWeight = entry.frontmatter.menuWeight || 999 } else { if (!currentGroup[level].items) { - currentGroup[level].items = {} + currentGroup[level].items = [] } currentGroup = currentGroup[level].items } diff --git a/theme/src/templates/PageTemplate.tsx b/theme/src/templates/PageTemplate.tsx index bbc46bb..376229b 100644 --- a/theme/src/templates/PageTemplate.tsx +++ b/theme/src/templates/PageTemplate.tsx @@ -123,6 +123,7 @@ export const pageQuery = graphql` body frontmatter { title + menuWeight date(formatString: "MMMM DD, YYYY") description banner @@ -140,6 +141,7 @@ export const pageQuery = graphql` frontmatter { description title + menuWeight blurb isHome imageAlt @@ -155,6 +157,7 @@ export const pageQuery = graphql` nodes { frontmatter { title + menuWeight } fields { slug