From 27a2fc6ed211c11a28ce074d19af888c73a2253c Mon Sep 17 00:00:00 2001
From: sanyuan <494130947@qq.com>
Date: Sun, 16 Oct 2022 21:31:57 +0800
Subject: [PATCH] fix: sidebar active

---
 src/theme-default/components/Siderbar/index.tsx | 16 ++++++++++++++--
 src/theme-default/logic/utils.ts                |  4 ++++
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/src/theme-default/components/Siderbar/index.tsx b/src/theme-default/components/Siderbar/index.tsx
index 1d92b793..b35bf869 100644
--- a/src/theme-default/components/Siderbar/index.tsx
+++ b/src/theme-default/components/Siderbar/index.tsx
@@ -2,13 +2,20 @@ import styles from './index.module.scss';
 import React from 'react';
 import { Link } from '../Link/index';
 import { DefaultTheme } from '../../../shared/types';
-import { normalizeHref, useSidebarData } from '../../logic/index';
+import {
+  normalizeHref,
+  useLocaleSiteData,
+  useSidebarData,
+  normalizeSlash
+} from '../../logic/index';
 import { useLocation } from 'react-router-dom';
 import { isActive } from '../../logic/index';
 
 export function SideBar() {
   const { pathname } = useLocation();
+  const localesData = useLocaleSiteData();
   const { items: sidebarData } = useSidebarData(pathname);
+  const langRoutePrefix = normalizeSlash(localesData.routePrefix || '');
 
   const renderGroupItem = (item: DefaultTheme.SidebarItem, depth = 0) => {
     const marginLeft = `${depth * 20}px`;
@@ -16,7 +23,12 @@ export function SideBar() {
     if ('items' in item) {
       children = item.items.map((child) => renderGroupItem(child, depth + 1));
     }
-    const active = isActive(pathname, item.link);
+    // Extract lang route prefix
+    // TODO: base url
+    const active = isActive(
+      pathname.replace(langRoutePrefix, ''),
+      item.link?.replace(langRoutePrefix, '')
+    );
     return (
       <div style={{ marginLeft }}>
         <div
diff --git a/src/theme-default/logic/utils.ts b/src/theme-default/logic/utils.ts
index a2276184..18a2aeda 100644
--- a/src/theme-default/logic/utils.ts
+++ b/src/theme-default/logic/utils.ts
@@ -10,6 +10,10 @@ export function removeTrailingSlash(url: string) {
   return url.charAt(url.length - 1) === '/' ? url.slice(0, -1) : url;
 }
 
+export function normalizeSlash(url: string) {
+  return removeTrailingSlash(addLeadingSlash(url));
+}
+
 export function normalizeHref(url?: string) {
   if (!url) {
     return '/';