整理filterNavPages

themes/gitbook/components/NavPostList.js

@@ -10,12 +10,24 @@ import NavPostItem from './NavPostItem'
  * @constructor
  */
 const NavPostList = (props) => {
-  const { filteredPostGroups } = props
+  const { filteredNavPages } = props
   const router = useRouter()
   let selectedSth = false
+  const groupedArray = filteredNavPages?.reduce((groups, item) => {
+    const categoryName = item?.category ? item?.category : '' // 将category转换为字符串
+    const lastGroup = groups[groups.length - 1] // 获取最后一个分组
+
+    if (!lastGroup || lastGroup?.category !== categoryName) { // 如果当前元素的category与上一个元素不同，则创建新分组
+      groups.push({ category: categoryName, items: [] })
+    }
+
+    groups[groups.length - 1].items.push(item) // 将元素加入对应的分组
+
+    return groups
+  }, [])
 
   // 处理是否选中
-  filteredPostGroups?.map((group) => {
+  groupedArray?.map((group) => {
     let groupSelected = false
     for (const post of group?.items) {
       if (router.asPath.split('?')[0] === '/' + post.slug) {
@@ -28,16 +40,16 @@ const NavPostList = (props) => {
   })
 
   // 如果都没有选中默认打开第一个
-  if (!selectedSth && filteredPostGroups && filteredPostGroups?.length > 0) {
-    filteredPostGroups[0].selected = true
+  if (!selectedSth && groupedArray && groupedArray?.length > 0) {
+    groupedArray[0].selected = true
   }
 
-  if (!filteredPostGroups || filteredPostGroups.length === 0) {
+  if (!groupedArray || groupedArray.length === 0) {
     return <NavPostListEmpty />
   } else {
     return <div id='posts-wrapper' className='w-full flex-grow'>
             {/* 文章列表 */}
-            {filteredPostGroups?.map((group, index) => <NavPostItem key={index} group={group} onHeightChange={props.onHeightChange}/>)}
+            {groupedArray?.map((group, index) => <NavPostItem key={index} group={group} onHeightChange={props.onHeightChange}/>)}
         </div>
   }
 }