medium 主题相关

themes/medium/components/TopNavBar.js

@@ -4,6 +4,9 @@ import LogoBar from './LogoBar'
 import React from 'react'
 import Collapse from '@/components/Collapse'
 import GroupMenu from './GroupMenu'
+import { useGlobal } from '@/lib/global'
+import CONFIG_MEDIUM from '../config_medium'
+
 /**
  * 顶部导航栏 + 菜单
  * @param {} param0
@@ -14,11 +17,23 @@ export default function TopNavBar(props) {
   const router = useRouter()
   const [isOpen, changeShow] = React.useState(false)
 
+  const { locale } = useGlobal()
+
+  const defaultLinks = [
+    { icon: 'fas fa-th', name: locale.COMMON.CATEGORY, to: '/category', show: CONFIG_MEDIUM.MENU_CATEGORY },
+    { icon: 'fas fa-tag', name: locale.COMMON.TAGS, to: '/tag', show: CONFIG_MEDIUM.MENU_TAG },
+    { icon: 'fas fa-archive', name: locale.NAV.ARCHIVE, to: '/archive', show: CONFIG_MEDIUM.MENU_ARCHIVE },
+    { icon: 'fas fa-search', name: locale.NAV.SEARCH, to: '/search', show: CONFIG_MEDIUM.MENU_SEARCH }
+  ]
+
+  const navs = defaultLinks.concat(customNav)
+
   const toggleMenuOpen = () => {
     changeShow(!isOpen)
   }
 
   return <div id='top-nav' className={'sticky top-0 lg:relative w-full z-40 ' + className}>
+        {/* 折叠菜单 */}
         <Collapse type='vertical' isOpen={isOpen} className='md:hidden'>
             <div className='bg-white dark:bg-hexo-black-gray pt-1 py-2 px-5 lg:hidden '>
                 <GroupMenu {...props} />
@@ -26,6 +41,8 @@ export default function TopNavBar(props) {
         </Collapse>
 
         <div className='flex w-full h-12 shadow bg-white dark:bg-hexo-black-gray px-5 items-between'>
+
+            {/* 图标Logo */}
             <LogoBar {...props} />
 
             {/* 右侧功能 */}
@@ -37,7 +54,7 @@ export default function TopNavBar(props) {
 
             {/* 顶部菜单 */}
             <div className='hidden md:flex'>
-                {customNav && customNav.map(link => {
+                {navs && navs.map(link => {
                   if (link.show) {
                     const selected = (router.pathname === link.to) || (router.asPath === link.to)
                     return <Link key={`${link.id}-${link.to}`} title={link.to} href={link.to} >