fix: sidebar active

src/theme-default/components/Siderbar/index.tsx

@@ -2,21 +2,33 @@ 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`;
     let children: React.ReactElement[] = [];
     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

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 '/';