feat(sidebar): get directory title from frontmatter (#483)

Author: nekomeowww

docs/.vitepress/config.ts

@@ -7,6 +7,7 @@ import { InlineLinkPreviewElementTransform } from '@nolebase/vitepress-plugin-in
 
 import { transformHeadMeta } from '@nolebase/vitepress-plugin-meta/vitepress'
 import { buildEndGenerateOpenGraphImages } from '@nolebase/vitepress-plugin-og-image/vitepress'
+import { calculateSidebar } from '@nolebase/vitepress-plugin-sidebar'
 import { transformerTwoslash } from '@shikijs/vitepress-twoslash'
 import { gray } from 'colorette'
 import MarkdownItFootnote from 'markdown-it-footnote'
@@ -19,265 +20,15 @@ function noTwoslash() {
   return argv.some(v => v.includes('vitepress')) && argv.includes('dev')
 }
 
-export const sidebars: Record<string, DefaultTheme.Sidebar> = {
+export const sidebars: Record<string, DefaultTheme.SidebarItem[] | DefaultTheme.SidebarMulti> = {
   'en': {
-    '/': [
-      {
-        text: 'Guides',
-        items: [
-          { text: 'Getting Started', link: '/pages/en/guide/getting-started' },
-          { text: 'Recent Updated', link: '/pages/en/recent-updates' },
-        ],
-      },
-      {
-        text: 'Integrations',
-        items: [
-          { text: 'Overview', link: '/pages/en/integrations/' },
-        ],
-      },
-      {
-        text: 'Markdown It Plugins',
-        items: [
-          {
-            text: 'Bi-directional links',
-            collapsed: true,
-            items: [
-              { text: 'Overview', link: '/pages/en/integrations/markdown-it-bi-directional-links/' },
-              { text: 'Getting Started', link: '/pages/en/integrations/markdown-it-bi-directional-links/getting-started' },
-              { text: 'Syntax', link: '/pages/en/integrations/markdown-it-bi-directional-links/syntax' },
-            ],
-          },
-          { text: 'Elements Transformation', link: '/pages/en/integrations/markdown-it-element-transform/' },
-          { text: 'Lazy loading blurred thumbnails', link: '/pages/en/integrations/markdown-it-unlazy-img/' },
-        ],
-      },
-      {
-        text: 'VitePress Plugins',
-        items: [
-          { text: 'Auto Sidebar', link: '/pages/en/integrations/vitepress-plugin-sidebar/' },
-          { text: 'Breadcrumbs', link: '/pages/en/integrations/vitepress-plugin-breadcrumbs/' },
-          { text: 'Enhanced Readabilities', link: '/pages/en/integrations/vitepress-plugin-enhanced-readabilities/' },
-          { text: 'Index Page', link: '/pages/en/integrations/vitepress-plugin-index/' },
-          {
-            text: 'Inline Links Previewing',
-            collapsed: true,
-            items: [
-              { text: 'Overview', link: '/pages/en/integrations/vitepress-plugin-inline-link-preview/' },
-              { text: 'Getting started', link: '/pages/en/integrations/vitepress-plugin-inline-link-preview/getting-started' },
-              { text: 'Configuration', link: '/pages/en/integrations/vitepress-plugin-inline-link-preview/configuration' },
-            ],
-          },
-          { text: 'Blinking highlight targeted heading', link: '/pages/en/integrations/vitepress-plugin-highlight-targeted-heading/' },
-          {
-            text: 'Git-based page histories',
-            collapsed: true,
-            items: [
-              { text: 'Overview', link: '/pages/en/integrations/vitepress-plugin-git-changelog/' },
-              { text: 'Getting started', link: '/pages/en/integrations/vitepress-plugin-git-changelog/getting-started' },
-              { text: 'Configure Vite Plugins', link: '/pages/en/integrations/vitepress-plugin-git-changelog/configure-vite-plugins' },
-              { text: 'Configure UI', link: '/pages/en/integrations/vitepress-plugin-git-changelog/configure-ui' },
-            ],
-          },
-          { text: 'Page properties', link: '/pages/en/integrations/vitepress-plugin-page-properties/' },
-          { text: 'Page metadata generation', link: '/pages/en/integrations/vitepress-plugin-meta/' },
-          { text: 'Previewing image (social media card) generation', link: '/pages/en/integrations/vitepress-plugin-og-image/' },
-          { text: 'Enhanced mark elements', link: '/pages/en/integrations/vitepress-plugin-enhanced-mark/' },
-          {
-            text: 'Thumbnail hashing for images',
-            collapsed: true,
-            items: [
-              { text: 'Usage', link: '/pages/en/integrations/vitepress-plugin-thumbnail-hash/' },
-              { text: 'Try ThumbHash', link: '/pages/en/integrations/vitepress-plugin-thumbnail-hash/thumbhash' },
-            ],
-          },
-        ],
-      },
-      {
-        text: 'Obsidian Plugins',
-        items: [
-          { text: 'UnoCSS', link: '/pages/en/integrations/obsidian-plugin-unocss/' },
-        ],
-      },
-      {
-        text: 'UI Components',
-        items: [
-          { text: 'Overview', link: '/pages/en/ui/' },
-        ],
-      },
-      {
-        text: 'Releasing',
-        items: [
-          {
-            text: 'Migration guides',
-            items: [
-              {
-                text: 'Migrate from v1 to v2',
-                link: '/pages/en/releases/migrations/v1-to-v2',
-              },
-              {
-                text: 'Migrate from v2 to v3',
-                link: '/pages/en/releases/migrations/v2-to-v3',
-              },
-            ],
-          },
-        ],
-      },
-    ],
-    '/pages/en/ui/': [
-      {
-        text: 'UI Components',
-        items: [
-          { text: 'Overview', link: '/pages/en/ui/' },
-        ],
-      },
-      {
-        text: 'Actions',
-        items: [
-          { text: 'Button', link: '/pages/en/ui/button/' },
-        ],
-      },
-      {
-        text: 'Inputs',
-        items: [
-          { text: 'Radio Group (Horizontal)', link: '/pages/en/ui/input-horizontal-radio-group/' },
-          { text: 'Slider', link: '/pages/en/ui/input-slider/' },
-        ],
-      },
-      {
-        text: 'Animations',
-        items: [
-          { text: 'Asciinema player', link: '/pages/en/ui/asciinema-player/' },
-          { text: 'Rive Canvas (Lazy Teleport)', link: '/pages/en/ui/lazy-teleport-rive-canvas/' },
-        ],
-      },
-    ],
-  },
+    '/pages/en/': calculateSidebar(['pages/en/guide', 'pages/en/integrations', 'pages/en/releases'], undefined, { '/': 2 }),
+    '/pages/en/ui/': calculateSidebar(['pages/en/ui'], undefined, { '/': 2 }),
+  } as DefaultTheme.SidebarMulti,
   'zh-CN': {
-    '/': [
-      {
-        text: '指南',
-        items: [
-          { text: '如何开始', link: '/pages/zh-CN/guide/getting-started' },
-        ],
-      },
-      {
-        text: '集成',
-        items: [
-          { text: '概览', link: '/pages/zh-CN/integrations/' },
-          { text: '最近更新', link: '/pages/zh-CN/recent-updates' },
-        ],
-      },
-      {
-        text: 'Markdown It 插件',
-        items: [
-          {
-            text: '双向链接',
-            collapsed: true,
-            items: [
-              { text: '介绍', link: '/pages/zh-CN/integrations/markdown-it-bi-directional-links/' },
-              { text: '快速上手', link: '/pages/zh-CN/integrations/markdown-it-bi-directional-links/getting-started' },
-              { text: '语法', link: '/pages/zh-CN/integrations/markdown-it-bi-directional-links/syntax' },
-            ],
-          },
-          { text: '元素转换', link: '/pages/zh-CN/integrations/markdown-it-element-transform/' },
-          { text: '懒加载模糊缩略图', link: '/pages/zh-CN/integrations/markdown-it-unlazy-img/' },
-        ],
-      },
-      {
-        text: 'VitePress 插件',
-        items: [
-          { text: '自动生成侧边栏', link: '/pages/zh-CN/integrations/vitepress-plugin-sidebar/' },
-          { text: '面包屑导航', link: '/pages/zh-CN/integrations/vitepress-plugin-breadcrumbs/' },
-          { text: '阅读增强', link: '/pages/zh-CN/integrations/vitepress-plugin-enhanced-readabilities/' },
-          { text: '索引页', link: '/pages/zh-CN/integrations/vitepress-plugin-index/' },
-          {
-            text: '行内链接预览',
-            collapsed: true,
-            items: [
-              { text: '介绍', link: '/pages/zh-CN/integrations/vitepress-plugin-inline-link-preview/' },
-              { text: '快速上手', link: '/pages/zh-CN/integrations/vitepress-plugin-inline-link-preview/getting-started' },
-              { text: '配置', link: '/pages/zh-CN/integrations/vitepress-plugin-inline-link-preview/configuration' },
-            ],
-          },
-          { text: '闪烁高亮当前的目标标题', link: '/pages/zh-CN/integrations/vitepress-plugin-highlight-targeted-heading/' },
-          {
-            text: '基于 Git 的页面历史',
-            collapsed: true,
-            items: [
-              { text: '介绍', link: '/pages/zh-CN/integrations/vitepress-plugin-git-changelog/' },
-              { text: '快速上手', link: '/pages/zh-CN/integrations/vitepress-plugin-git-changelog/getting-started' },
-              { text: '配置 Vite 插件', link: '/pages/zh-CN/integrations/vitepress-plugin-git-changelog/configure-vite-plugins' },
-              { text: '配置 UI 组件', link: '/pages/zh-CN/integrations/vitepress-plugin-git-changelog/configure-ui' },
-            ],
-          },
-          { text: '页面属性', link: '/pages/zh-CN/integrations/vitepress-plugin-page-properties/' },
-          { text: '页面元信息生成', link: '/pages/zh-CN/integrations/vitepress-plugin-meta/' },
-          { text: '预览图片（社交媒体卡片）生成', link: '/pages/zh-CN/integrations/vitepress-plugin-og-image/' },
-          { text: 'mark 元素增强', link: '/pages/zh-CN/integrations/vitepress-plugin-enhanced-mark/' },
-          {
-            text: '缩略图模糊哈希生成',
-            collapsed: true,
-            items: [
-              { text: '用法', link: '/pages/zh-CN/integrations/vitepress-plugin-thumbnail-hash/' },
-              { text: '尝试 ThumbHash', link: '/pages/zh-CN/integrations/vitepress-plugin-thumbnail-hash/thumbhash' },
-            ],
-          },
-        ],
-      },
-      {
-        text: 'Obsidian 插件',
-        items: [
-          { text: 'UnoCSS', link: '/pages/zh-CN/integrations/obsidian-plugin-unocss/' },
-        ],
-      },
-      {
-        text: '版本发布',
-        items: [
-          {
-            text: '迁移指南',
-            items: [
-              {
-                text: '自 v1 迁移至 v2',
-                link: '/pages/zh-CN/releases/migrations/v1-to-v2',
-              },
-              {
-                text: '自 v2 迁移至 v3',
-                link: '/pages/zh-CN/releases/migrations/v2-to-v3',
-              },
-            ],
-          },
-        ],
-      },
-    ],
-    '/pages/zh-CN/ui/': [
-      {
-        text: 'UI 组件',
-        items: [
-          { text: '概览', link: '/pages/zh-CN/ui/' },
-        ],
-      },
-      {
-        text: '操作',
-        items: [
-          { text: '按钮', link: '/pages/zh-CN/ui/button/' },
-        ],
-      },
-      {
-        text: '输入',
-        items: [
-          { text: '多个单选（水平）', link: '/pages/zh-CN/ui/input-horizontal-radio-group/' },
-          { text: '滑块', link: '/pages/zh-CN/ui/input-slider/' },
-        ],
-      },
-      {
-        text: '动画',
-        items: [
-          { text: 'Asciinema 播放器', link: '/pages/en/ui/asciinema-player/' },
-          { text: 'Rive Canvas（懒 Teleport）', link: '/pages/zh-CN/ui/lazy-teleport-rive-canvas/' },
-        ],
-      },
-    ],
-  },
+    '/pages/zh-CN/': calculateSidebar(['pages/zh-CN/guide', 'pages/zh-CN/integrations', 'pages/zh-CN/releases'], undefined, { '/': 2 }),
+    '/pages/zh-CN/ui/': calculateSidebar(['pages/zh-CN/ui'], undefined, { '/': 2 }),
+  } as DefaultTheme.SidebarMulti,
 }
 
 function getVueProdHydrationMismatchDetailsFlag() {

docs/pages/en/guide/_page.md

@@ -0,0 +1,4 @@
+---
+sidebarTitle: Guide
+sidebarCollapsed: false
+---

docs/pages/en/recent-updates.md renamed to docs/pages/en/guide/recent-updates.md

@@ -1,11 +1,12 @@
 ---
+title: Recent Updates
 nolebase:
   gitChangelog: false
   pageProperties: false
 ---
 
 <script setup>
-import { data } from '../../data/en/recentUpdates.data'
+import { data } from '../../../data/en/recentUpdates.data'
 </script>
 
 <NolebaseRecentUpdates :data="data" />

docs/pages/en/integrations/index.md

@@ -1,6 +1,7 @@
 ---
 title: Integrations
 category: Index
+sidebarCollapsed: false
 ---
 
 <script setup>

docs/pages/en/integrations/markdown-it-bi-directional-links/Bi-directional Links Example Page.md

@@ -1,6 +1,8 @@
 ---
 title: Bi-directional Links
 category: Bi-directional Links
+sidebarTitle: Bi-directional Links Example Page
+sidebarHide: true
 ---
 
 # Bi-directional Links Example Page

docs/pages/en/integrations/markdown-it-bi-directional-links/Bi-directional Links Example Same Name Page.md

@@ -1,6 +1,8 @@
 ---
 title: Bi-directional Links
 category: Bi-directional Links
+sidebarTitle: Bi-directional Links Example Same Name Page
+sidebarHide: true
 ---
 
 # Bi-directional Links Example Same Name Page

docs/pages/en/integrations/markdown-it-bi-directional-links/getting-started.md

@@ -1,6 +1,7 @@
 ---
 title: Bi-directional Links
 category: Bi-directional Links
+sidebarTitle: Getting Started
 ---
 
 # Getting started

docs/pages/en/integrations/markdown-it-bi-directional-links/images/README.md

@@ -1 +1,5 @@
+---
+sidebarHide: true
+---
+
 All images are provided by [Lorem Picsum](https://picsum.photos/) - The Lorem Ipsum for photos.

docs/pages/en/integrations/markdown-it-bi-directional-links/same-name/Bi-directional Links Example Same Name Page.md

@@ -1,6 +1,7 @@
 ---
 title: Bi-directional Links
 category: Bi-directional Links
+sidebarHide: true
 ---
 
 # Bi-directional Links Example Same Name Page

docs/pages/en/integrations/markdown-it-bi-directional-links/syntax.md

@@ -1,6 +1,7 @@
 ---
 title: Bi-directional Links
 category: Bi-directional Links
+sidebarTitle: Syntax
 ---
 
 # Syntax