fix: nested overview page with index file in sidebar

.changeset/polite-schools-wait.md

@@ -0,0 +1,5 @@
+---
+'@rspress/core': patch
+---
+
+release

e2e/fixtures/nested-overview/doc/_meta.json

@@ -0,0 +1,7 @@
+[
+  {
+    "text": "Guide",
+    "link": "/level1/",
+    "activeMatch": "/level1/"
+  }
+]

e2e/fixtures/nested-overview/doc/index.mdx

@@ -0,0 +1 @@
+# index

e2e/fixtures/nested-overview/doc/level1/index.mdx

@@ -0,0 +1,3 @@
+---
+overview: true
+---

e2e/fixtures/nested-overview/doc/level1/level2/index.mdx

@@ -0,0 +1,3 @@
+---
+overview: true
+---

e2e/fixtures/nested-overview/doc/level1/level2/level3/index.mdx

@@ -0,0 +1,3 @@
+---
+overview: true
+---

e2e/fixtures/nested-overview/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "@rspress-fixture/rspress-nested-overview",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "dev": "rspress dev",
+    "build": "rspress build",
+    "preview": "rspress preview"
+  },
+  "dependencies": {
+    "rspress": "workspace:*"
+  },
+  "devDependencies": {
+    "@types/node": "^18.11.17"
+  }
+}

e2e/fixtures/nested-overview/rspress.config.ts

@@ -0,0 +1,6 @@
+import * as path from 'node:path';
+import { defineConfig } from 'rspress/config';
+
+export default defineConfig({
+  root: path.join(__dirname, 'doc'),
+});

e2e/fixtures/nested-overview/tsconfig.json

@@ -0,0 +1 @@
+{}

e2e/tests/nested-overview.test.ts

@@ -0,0 +1,72 @@
+import { expect, test } from '@playwright/test';
+import path from 'node:path';
+import { getPort, killProcess, runDevCommand } from '../utils/runCommands';
+
+const fixtureDir = path.resolve(__dirname, '../fixtures');
+
+test.describe('Nested overview page', async () => {
+  let appPort;
+  let app;
+  test.beforeAll(async () => {
+    const appDir = path.join(fixtureDir, 'nested-overview');
+    appPort = await getPort();
+    app = await runDevCommand(appDir, appPort);
+  });
+
+  test.afterAll(async () => {
+    if (app) {
+      await killProcess(app);
+    }
+  });
+
+  test('Should load nested overview page correctly - level 1', async ({
+    page,
+  }) => {
+    await page.goto(`http://localhost:${appPort}/level1/index.html`, {
+      waitUntil: 'networkidle',
+    });
+
+    const h2 = await page.$$('.overview-index h2');
+    const h2Texts = await Promise.all(h2.map(element => element.textContent()));
+    expect(h2Texts.join(',')).toEqual(['level2'].join(','));
+
+    const h3 = await page.$$('.overview-group_8f375 h3');
+    const h3Texts = await Promise.all(h3.map(element => element.textContent()));
+    expect(h3Texts.join(',')).toEqual(['index', 'level3', 'two'].join(','));
+  });
+
+  test('Should load nested overview page correctly - level 2', async ({
+    page,
+  }) => {
+    await page.goto(`http://localhost:${appPort}/level1/level2/index.html`, {
+      waitUntil: 'networkidle',
+    });
+
+    const h2 = await page.$$('.overview-index h2');
+    const h2Texts = await Promise.all(h2.map(element => element.textContent()));
+    expect(h2Texts.join(',')).toEqual(['level3', 'two'].join(','));
+
+    const h3 = await page.$$('.overview-group_8f375 h3');
+    const h3Texts = await Promise.all(h3.map(element => element.textContent()));
+    expect(h3Texts.join(',')).toEqual(['index', 'three', 'two'].join(','));
+  });
+
+  test('Should load nested overview page correctly - level 3', async ({
+    page,
+  }) => {
+    await page.goto(
+      `http://localhost:${appPort}/level1/level2/level3/index.html`,
+      {
+        waitUntil: 'networkidle',
+      },
+    );
+
+    const h2 = await page.$$('.overview-index h2');
+    const h2Texts = await Promise.all(h2.map(element => element.textContent()));
+    expect(h2Texts.join(',')).toEqual(['three'].join(','));
+
+    const h3 = await page.$$('.overview-group_8f375 h3');
+    const h3Texts = await Promise.all(h3.map(element => element.textContent()));
+    expect(h3Texts.join(',')).toEqual(['three'].join(','));
+  });
+});

packages/theme-default/src/components/Overview/index.tsx

@@ -132,11 +132,24 @@ export function Overview(props: {
     }
     return '';
   };
+
+  const removeIndex = (link: string) => {
+    if (link.endsWith('/index')) {
+      return link.slice(0, -5);
+    }
+    return link;
+  };
+
   const findItemByRoutePath = (items, routePath, originalItems) => {
     for (const item of items) {
       if (withBase(item.link) === routePath) {
         return [item];
       }
+
+      if (removeIndex(withBase(item.link)) === routePath) {
+        return items;
+      }
+
       if (item.items) {
         const foundItem = findItemByRoutePath(
           item.items,