docs: add sidebar sorting logic (#11751)

* docs: add sidebar sorting logic

* generate sidebar

www/packages/build-scripts/src/generate-sidebar.ts

@@ -5,6 +5,7 @@ import { getSidebarItemLink, sidebarAttachHrefCommonOptions } from "./index.js"
 import getCoreFlowsRefSidebarChildren from "./utils/get-core-flows-ref-sidebar-children.js"
 import { parseTags } from "./utils/parse-tags.js"
 import numberSidebarItems from "./utils/number-sidebar-items.js"
+import { sortSidebarItems } from "./utils/sidebar-sorting.js"
 
 export type ItemsToAdd = SidebarItem & {
   sidebar_position?: number
@@ -160,6 +161,11 @@ async function checkItem(item: RawSidebarItem): Promise<RawSidebarItem> {
     item.children = await checkItems(item.children)
   }
 
+  item.children = sortSidebarItems({
+    items: item.children as RawSidebarItem[],
+    type: item.sort_sidebar,
+  })
+
   return item
 }
 

www/packages/build-scripts/src/utils/sidebar-sorting.ts

@@ -0,0 +1,49 @@
+import { InteractiveSidebarItem, RawSidebarItem, SidebarSortType } from "types"
+
+type Options = {
+  items: RawSidebarItem[]
+  type?: SidebarSortType
+}
+
+export const sortSidebarItems = ({
+  items,
+  type = "none",
+}: Options): RawSidebarItem[] => {
+  switch (type) {
+    case "alphabetize":
+      return alphabetizeSidebarItems(items)
+    default:
+      return items
+  }
+}
+
+const alphabetizeSidebarItems = (items: RawSidebarItem[]): RawSidebarItem[] => {
+  const segments: RawSidebarItem[][] = []
+  let currentSegment: RawSidebarItem[] = []
+
+  items.forEach((item) => {
+    if (item.type === "separator") {
+      if (currentSegment.length > 0) {
+        segments.push(currentSegment)
+        currentSegment = []
+      }
+      segments.push([item])
+    } else {
+      currentSegment.push(item)
+    }
+  })
+
+  if (currentSegment.length > 0) {
+    segments.push(currentSegment)
+  }
+
+  return segments
+    .map((segment) => {
+      return segment[0].type === "separator"
+        ? segment
+        : (segment as InteractiveSidebarItem[]).sort((a, b) =>
+            a.title.localeCompare(b.title)
+          )
+    })
+    .flat()
+}