From 198a57f2a78e4fefc85378e29c9424b402eae2a8 Mon Sep 17 00:00:00 2001
From: unix <unix.bio@gmail.com>
Date: Fri, 20 Mar 2020 21:13:18 +0800
Subject: [PATCH] docs(sidebar): fix active state rendering error on the server

---
 lib/components/index.ts                         | 4 ++--
 lib/components/{ => sidebar}/active-catalog.tsx | 0
 lib/components/{ => sidebar}/active-link.tsx    | 7 ++++---
 lib/components/sidebar/side-item.tsx            | 6 +++---
 4 files changed, 9 insertions(+), 8 deletions(-)
 rename lib/components/{ => sidebar}/active-catalog.tsx (100%)
 rename lib/components/{ => sidebar}/active-link.tsx (90%)

diff --git a/lib/components/index.ts b/lib/components/index.ts
index f486cce..dc424a1 100644
--- a/lib/components/index.ts
+++ b/lib/components/index.ts
@@ -1,7 +1,7 @@
 
 export { default as Layout } from  './layout'
-export { default as ActiveLink } from  './active-link'
-export { default as ActiveCatalog } from  './active-catalog'
+export { default as ActiveLink } from 'lib/components/sidebar/active-link'
+export { default as ActiveCatalog } from 'lib/components/sidebar/active-catalog'
 export { default as Sidebar } from  './sidebar'
 export { default as Playground } from  './playground'
 export { default as ExampleBlock } from  './example-block'
diff --git a/lib/components/active-catalog.tsx b/lib/components/sidebar/active-catalog.tsx
similarity index 100%
rename from lib/components/active-catalog.tsx
rename to lib/components/sidebar/active-catalog.tsx
diff --git a/lib/components/active-link.tsx b/lib/components/sidebar/active-link.tsx
similarity index 90%
rename from lib/components/active-link.tsx
rename to lib/components/sidebar/active-link.tsx
index 28bf2aa..b4a9d87 100644
--- a/lib/components/active-link.tsx
+++ b/lib/components/sidebar/active-link.tsx
@@ -13,12 +13,13 @@ export interface Props {
 const ActiveLink: React.FC<React.PropsWithChildren<Props>> = React.memo(
   ({ children, index, href }) => {
     const { updateShouldScroll } = useConfigs()
-    const { asPath } = useRouter()
-    const isActive = asPath === href
+    const { pathname } = useRouter()
+    const isActive = pathname === href
     const child = Children.only(children)
-    
+  
     useEffect(() => {
       if (!isActive) return
+      
       updateShouldScroll && updateShouldScroll(index > 16)
     }, [isActive])
 
diff --git a/lib/components/sidebar/side-item.tsx b/lib/components/sidebar/side-item.tsx
index 5cc7d99..fb2104d 100644
--- a/lib/components/sidebar/side-item.tsx
+++ b/lib/components/sidebar/side-item.tsx
@@ -1,7 +1,7 @@
 import React, { useState, ReactElement, useCallback } from 'react'
-import ArrowIcon from 'lib/components/icons/arrow'
-import ActiveLink from 'lib/components/active-link'
-import ActiveCatalog from 'lib/components/active-catalog'
+import ActiveLink from './active-link'
+import ArrowIcon from '../icons/arrow'
+import ActiveCatalog from './active-catalog'
 import { useTheme } from 'components'
 
 export type Sides = {