站点信息读取Notion数据

themes/next/Layout404.js

@@ -1,9 +1,8 @@
 import { useRouter } from 'next/router'
 import LayoutBase from './LayoutBase'
-import BLOG from '@/blog.config'
 import { useEffect } from 'react'
 
-export const Layout404 = (props) => {
+export const Layout404 = props => {
   const router = useRouter()
   useEffect(() => {
     // 延时3秒如果加载失败就返回首页
@@ -19,7 +18,7 @@ export const Layout404 = (props) => {
     }, 3000)
   })
 
-  return <LayoutBase meta={{ title: `${BLOG.TITLE} | 页面找不到啦` }} {...props}>
+  return <LayoutBase {...props}>
     <div
       className='md:-mt-20 text-black w-full h-screen text-center justify-center content-center items-center flex flex-col'>
       <div className='dark:text-gray-200'>

themes/next/LayoutArchive.js

@@ -1,12 +1,9 @@
-import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import React, { useEffect } from 'react'
 import LayoutBase from './LayoutBase'
 import BlogPostArchive from './components/BlogPostArchive'
 
 export const LayoutArchive = (props) => {
   const { posts } = props
-  const { locale } = useGlobal()
   // 深拷贝
   const postsSortByDate = Object.create(posts)
 
@@ -17,12 +14,6 @@ export const LayoutArchive = (props) => {
     return dateB - dateA
   })
 
-  const meta = {
-    title: `${locale.NAV.ARCHIVE} | ${BLOG.TITLE}`,
-    description: BLOG.DESCRIPTION,
-    type: 'website'
-  }
-
   const archivePosts = {}
 
   postsSortByDate.forEach(post => {
@@ -49,7 +40,7 @@ export const LayoutArchive = (props) => {
   }, [])
 
   return (
-    <LayoutBase meta={meta} {...props}>
+    <LayoutBase {...props}>
       <div className="mb-10 pb-20 bg-white md:p-12 p-3 dark:bg-gray-800 shadow-md min-h-full">
         {Object.keys(archivePosts).map(archiveTitle => (
           <BlogPostArchive

themes/next/LayoutBase.js

@@ -20,7 +20,7 @@ import Live2D from '@/components/Live2D'
  * @constructor
  */
 const LayoutBase = (props) => {
-  const { children, headerSlot, meta, sideBarSlot, floatSlot, rightAreaSlot } = props
+  const { children, headerSlot, meta, sideBarSlot, floatSlot, rightAreaSlot, siteInfo } = props
   const { onLoading } = useGlobal()
   const targetRef = useRef(null)
   const leftAreaSlot = <Live2D/>
@@ -75,7 +75,7 @@ const LayoutBase = (props) => {
         </div>
       </div>
 
-      <Footer title={meta.title}/>
+      <Footer title={siteInfo?.title}/>
       </>
   )
 }

themes/next/LayoutCategory.js

@@ -1,5 +1,3 @@
-import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import LayoutBase from './LayoutBase'
 import StickyBar from './components/StickyBar'
 import CategoryList from './components/CategoryList'
@@ -7,13 +5,7 @@ import BlogPostListScroll from './components/BlogPostListScroll'
 
 export const LayoutCategory = (props) => {
   const { tags, posts, category, categories } = props
-  const { locale } = useGlobal()
-  const meta = {
-    title: `${category} | ${locale.COMMON.CATEGORY} | ${BLOG.TITLE}`,
-    description: BLOG.DESCRIPTION,
-    type: 'website'
-  }
-  return <LayoutBase meta={meta} currentCategory={category} {...props}>
+  return <LayoutBase currentCategory={category} {...props}>
     <StickyBar>
       <CategoryList currentCategory={category} categories={categories} />
     </StickyBar>

themes/next/LayoutCategoryIndex.js

@@ -1,17 +1,11 @@
 import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import LayoutBase from './LayoutBase'
 import Link from 'next/link'
 
 export const LayoutCategoryIndex = (props) => {
   const { allPosts, categories } = props
   const { locale } = useGlobal()
-  const meta = {
-    title: `${locale.COMMON.CATEGORY} | ${BLOG.TITLE}`,
-    description: BLOG.DESCRIPTION,
-    type: 'website'
-  }
-  return <LayoutBase meta={meta} totalPosts={allPosts} {...props}>
+  return <LayoutBase totalPosts={allPosts} {...props}>
     <div className='bg-white dark:bg-gray-700 px-10 py-10 shadow h-full'>
       <div className='dark:text-gray-200 mb-5'>
         <i className='mr-4 fas faTh' />{locale.COMMON.CATEGORY}:

themes/next/LayoutSlug.js

@@ -1,4 +1,3 @@
-import BLOG from '@/blog.config'
 import { getPageTableOfContents } from 'notion-utils'
 import TocDrawerButton from './components/TocDrawerButton'
 import LayoutBase from './LayoutBase'
@@ -12,12 +11,6 @@ import { ArticleLock } from './components/ArticleLock'
 
 export const LayoutSlug = (props) => {
   const { post, latestPosts, lock, validPassword } = props
-  const meta = {
-    title: `${post.title} | ${BLOG.TITLE}`,
-    description: post.summary,
-    type: 'article',
-    tags: post.tags
-  }
 
   if (!lock && post?.blockMap?.block) {
     post.content = Object.keys(post.blockMap.block)
@@ -35,7 +28,6 @@ export const LayoutSlug = (props) => {
   return (
     <LayoutBase
       {...props}
-      meta={meta}
       floatSlot={floatSlot}
       rightAreaSlot={
         CONFIG_NEXT.RIGHT_LATEST_POSTS && <Card><LatestPostsGroup posts={latestPosts} /></Card>

themes/next/LayoutTag.js

@@ -1,5 +1,3 @@
-import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import LayoutBase from './LayoutBase'
 import StickyBar from './components/StickyBar'
 import TagList from './components/TagList'
@@ -7,15 +5,8 @@ import BlogPostListScroll from './components/BlogPostListScroll'
 
 export const LayoutTag = (props) => {
   const { tags, posts, tag } = props
-  const { locale } = useGlobal()
 
-  const meta = {
-    title: `${tag} | ${locale.COMMON.TAGS} | ${BLOG.TITLE}`,
-    description: BLOG.DESCRIPTION,
-    type: 'website'
-  }
-
-  return <LayoutBase meta={meta} currentTag={tag} {...props}>
+  return <LayoutBase currentTag={tag} {...props}>
     <StickyBar>
       <TagList tags={tags} currentTag={tag}/>
     </StickyBar>

themes/next/LayoutTagIndex.js

@@ -1,17 +1,11 @@
 import { useGlobal } from '@/lib/global'
-import BLOG from '@/blog.config'
 import LayoutBase from './LayoutBase'
 import TagItem from './components/TagItem'
 
 export const LayoutTagIndex = (props) => {
   const { tags } = props
   const { locale } = useGlobal()
-  const meta = {
-    title: `${locale.COMMON.TAGS} | ${BLOG.TITLE}`,
-    description: BLOG.DESCRIPTION,
-    type: 'website'
-  }
-  return <LayoutBase meta={meta} {...props}>
+  return <LayoutBase {...props}>
     <div className='bg-white dark:bg-gray-700 px-10 py-10 shadow h-full'>
       <div className='dark:text-gray-200 mb-5'><i className='fas fa-tags mr-4'/>{locale.COMMON.TAGS}:</div>
       <div id='tags-list' className='duration-200 flex flex-wrap'>

themes/next/components/Logo.js

@@ -1,12 +1,12 @@
 import Link from 'next/link'
-import BLOG from '@/blog.config'
 import React from 'react'
 
-const Logo = () => {
+const Logo = props => {
+  const { siteInfo } = props
   return <Link href='/' passHref>
         <div className='flex flex-col justify-center items-center cursor-pointer bg-black space-y-3 h-32 font-bold'>
-          <div className='font-serif text-xl text-white'> {BLOG.TITLE}</div>
-          <div className='text-sm text-gray-300 font-light'> {BLOG.DESCRIPTION}</div>
+          <div className='font-serif text-xl text-white'> {siteInfo?.title}</div>
+          <div className='text-sm text-gray-300 font-light'> {siteInfo?.description}</div>
         </div>
   </Link>
 }

themes/next/components/SideAreaLeft.js

@@ -18,7 +18,7 @@ import CONFIG_NEXT from '../config_next'
  * @returns {JSX.Element}
  * @constructor
  */
-const SideAreaLeft = (props) => {
+const SideAreaLeft = props => {
   const { post, slot, postCount } = props
   const { locale } = useGlobal()
   const showToc = post && post.toc && post.toc.length > 1
@@ -27,7 +27,7 @@ const SideAreaLeft = (props) => {
     <section className='w-60'>
       {/* 菜单 */}
       <section className='shadow hidden lg:block mb-5 pb-4 bg-white dark:bg-gray-800 hover:shadow-xl duration-200'>
-        <Logo/>
+        <Logo {...props}/>
         <div className='pt-2 px-2 font-sans'>
         <MenuButtonGroup allowCollapse={true} {...props} />
         </div>

themes/next/components/TopNav.js

@@ -98,7 +98,7 @@ const TopNav = (props) => {
         </div>
 
         <div className='flex'>
-         <Logo/>
+         <Logo {...props}/>
         </div>
 
         {/* 右侧功能 */}

themes/next/config_next.js

@@ -2,7 +2,6 @@ const CONFIG_NEXT = {
 
   HOME_BANNER: false, // 首页是否显示大图及标语 [true,false]
   HOME_BANNER_Strings: ['Hi，我是一个程序员', 'Hi，我是一个打工人', 'Hi，我是一个干饭人', '欢迎来到我的博客🎉'], // 首页大图标语文字
-  HOME_BANNER_IMAGE: './bg_image.jpg', // 背景图地址
 
   NAV_TYPE: 'normal', // ['fixed','autoCollapse','normal'] 分别是固定屏幕顶部、屏幕顶部自动折叠，不固定