Sort NavigationTree alphabetically
#112
Conversation
There was a problem hiding this comment.
Adding a simple accordion to show the sorting
| export function Accordion({ children }: AccordionProps) { | ||
| return ( | ||
| <details> | ||
| <summary>Hello 👋</summary> | ||
| Nice meeting you! How's everything going? | ||
| </details> | ||
| ) | ||
| } |
There was a problem hiding this comment.
Using the built in HTML elements for this, I imagine down the line we'll use the components package Dylan is working on
| function compareTitleSort<T extends CategoryNode | NavigationNode>( | ||
| a: T, | ||
| b: T | ||
| ): -1 | 0 | 1 { | ||
| const aHasChildren = 'children' in a && a.children.length > 0 | ||
| const bHasChildren = 'children' in b && b.children.length > 0 | ||
| if (aHasChildren) { | ||
| a.children.sort(compareTitleSort) | ||
| } | ||
| if (bHasChildren) { | ||
| b.children.sort(compareTitleSort) | ||
| } | ||
| if (a.title > b.title) { | ||
| return 1 | ||
| } | ||
| if (b.title > a.title) { | ||
| return -1 | ||
| } | ||
| return 0 | ||
| } |
There was a problem hiding this comment.
Made the compare function recursive per our discussion. @BRKalow
This way the tree will be sorted no matter how deep the structure gets as long as we keep using the children key to handle nesting
| if (aHasChildren) { | ||
| a.children.sort(compareTitleSort) | ||
| } | ||
| if (bHasChildren) { | ||
| b.children.sort(compareTitleSort) | ||
| } |
There was a problem hiding this comment.
I'm thinking this might not be the proper place to call sort recursively, as each element might get passed to the compare function more than once, which would result in us sorting an element's children multiple times. We'll likely want to separate out traversing the tree from the actual sorting.
There was a problem hiding this comment.
Are you suggesting, something like:
- Create a
toBeSorted = Map() - Traverse the tree, while checking which nodes have children
- If
hasChildren == true. Store reference to the node intoBeSorted - Loop through the map and sort
1. Rewrote the test for `parseComponentPath` 2. Added test for `getNavigationTree` 3. renamed `get-nav-tree.ts` to `get-navigation-tree.ts` Co-authored-by: Preston Bourne <[email protected]>
Note that tests will continue to fail inaccurately until GH-110 is merged
Follow up for this PR
Solves #111
These changes do the following:
NavigationTreeusing the built in sort methodComponentEntityinexamples/basicto better demonstrate the alphabetical sorting.