docs(SideNav): use `a` tag for navigation (#230)

* chore(docs): use `a` tag for navigate

* chore: update semi-site-header version

* chore: update semi-site-header 0.0.2

Co-authored-by: zwlafk <[email protected]>

package.json

@@ -37,7 +37,7 @@
   "dependencies": {
     "@douyinfe/semi-site-banner": "0.0.1",
     "@douyinfe/semi-site-doc-style": "0.0.1",
-    "@douyinfe/semi-site-header": "0.0.1",
+    "@douyinfe/semi-site-header": "0.0.2",
     "@douyinfe/semi-site-markdown-blocks": "0.0.1",
     "@mdx-js/react": "^1.6.22",
     "@svgr/core": "^5.5.0",

src/components/side-nav.js

@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useMemo, Suspense } from 'react';
 import { Nav, Icon } from '@douyinfe/semi-ui';
-import { navigate, withPrefix } from 'gatsby';
+import { withPrefix, Link } from 'gatsby';
 import { getLocale } from 'utils/locale';
 import IconMap from '../images/docIcons';
 
@@ -45,8 +45,20 @@ const SideNav = ({ location = null, type = null, itemsArr, edges, style, hasBann
                 navData[categoryIndex].items.sort((a, b) => a.order - b.order);
             }
         });
-
-        return navData;
+        return navData.map(category=>{
+            const { items, ...rest } = category
+            return (
+                <Nav.Sub {...rest} key={rest.itemKey}>
+                    {items.map(item=>{
+                        return (
+                            <Link to={item.itemKey} key={item.itemKey} >
+                                <Nav.Item {...item} />
+                            </Link>
+                        )
+                    })}
+                </Nav.Sub>
+            )
+        })
     }
 
     const computedNavData = useMemo(() => getNavData(itemsArr), [itemsArr, localeCode]);
@@ -75,8 +87,6 @@ const SideNav = ({ location = null, type = null, itemsArr, edges, style, hasBann
 
 
     const onNavSelect = ({ itemKey, selectedKeys }) => {
-        setSelectedKeys([...selectedKeys]);
-        navigate(itemKey);
         window?.__semi__?.Tea?.eventHappened('mainSiteNavClicked', itemKey);
     };
 
@@ -96,12 +106,13 @@ const SideNav = ({ location = null, type = null, itemsArr, edges, style, hasBann
                 subNavMotion={subNavMotion}
                 bodyStyle={{ height: '100%' }}
                 onSelect={onNavSelect}
-                items={computedNavData}
                 selectedKeys={selectedKeys}
                 onOpenChange={onOpenChange}
                 defaultOpenKeys={computedNavData.map(item => item.itemKey)}
                 openKeys={openKeys}
-            />
+            >
+                {computedNavData}
+            </Nav>
         </div>
     );
 };

src/sitePages/newHome/components/comments/comments.jsx

@@ -21,7 +21,7 @@ function Comments(props) {
                 <div className={styles.group3737}>
                     <Button onClick={goStart} size="large" theme="solid" className={styles.extraLarge}>{_t("start_using", { }, "开始使用")}</Button>
                     <div onClick={goGithub} className={styles.buttonSecondarySolid_4427b030}>
-                        <IconGithubLogo size="extra-large" /><p className={styles.text_bff7eaeb}>Github</p>
+                        <IconGithubLogo size="extra-large" /><p className={styles.text_bff7eaeb}>GitHub</p>
                     </div>
                 </div>
             </div>