站点信息读取Notion数据

2026-05-27 23:16:52 +00:00 · 2022-03-30 15:34:25 +08:00
parent 914e9a108f
commit 53c004843e
61 changed files with 322 additions and 463 deletions
--- a/pages/404.js
+++ b/pages/404.js
@@ -0,0 +1,25 @@
+import { getGlobalNotionData } from '@/lib/notion/getNotionData'
+import * as ThemeMap from '@/themes'
+import { useGlobal } from '@/lib/global'
+
+/**
+ * 404
+ * @param {*} props
+ * @returns
+ */
+const NoFound = props => {
+  const { theme } = useGlobal()
+  const ThemeComponents = ThemeMap[theme]
+  const meta = { title: `${props?.siteInfo?.title} | 页面找不到啦` }
+  return <ThemeComponents.Layout404 {...props} meta={meta}/>
+}
+
+export async function getStaticProps () {
+  const props = await getGlobalNotionData({ from: 'category-index-props', categoryCount: 0 })
+  return {
+    props,
+    revalidate: 1
+  }
+}
+
+export default NoFound
--- a/pages/[slug].js
+++ b/pages/[slug].js
@@ -10,7 +10,7 @@ import { useEffect, useState } from 'react'
 * @param {*} props
 * @returns
 */
-const Slug = (props) => {
+const Slug = props => {
  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]
  const { post } = props
@@ -38,7 +38,15 @@ const Slug = (props) => {
    }
  }

-  props = { ...props, lock, setLock, validPassword }
+  const { siteInfo } = props
+  const meta = {
+    title: `${post.title} | ${siteInfo.title}`,
+    description: post.summary,
+    type: 'article',
+    tags: post.tags
+  }
+
+  props = { ...props, meta, lock, setLock, validPassword }

  return <ThemeComponents.LayoutSlug {...props} showArticleInfo={false}/>
 }
@@ -63,23 +71,23 @@ export async function getStaticPaths () {

 export async function getStaticProps ({ params: { slug } }) {
  const from = `slug-props-${slug}`
-  const { allPosts, categories, tags, postCount, latestPosts, customNav } = await getGlobalNotionData({ from, pageType: ['Page'] })
+  const props = await getGlobalNotionData({ from, pageType: ['Page'] })
+  const { allPosts } = props
  const post = allPosts.find(p => p.slug === slug)
  if (!post) {
    return { props: {}, revalidate: 1 }
  }

-  post.blockMap = await getPostBlocks(post.id, 'slug')
+  try {
+    post.blockMap = await getPostBlocks(post.id, 'slug')
+  } catch (error) {
+    console.error('获取文章详情失败', error)
+  }
+
+  props.post = post

  return {
-    props: {
-      post,
-      tags,
-      categories,
-      postCount,
-      latestPosts,
-      customNav
-    },
+    props,
    revalidate: 1
  }
 }
--- a/pages/archive/index.js
+++ b/pages/archive/index.js
@@ -3,24 +3,24 @@ import React from 'react'
 import { useGlobal } from '@/lib/global'
 import * as ThemeMap from '@/themes'

-const ArchiveIndex = (props) => {
-  const { theme } = useGlobal()
+const ArchiveIndex = props => {
+  const { theme, locale } = useGlobal()
  const ThemeComponents = ThemeMap[theme]
-  return <ThemeComponents.LayoutArchive {...props}/>
+  const { siteInfo } = props
+  const meta = {
+    title: `${locale.NAV.ARCHIVE} | ${siteInfo.title}`,
+    description: siteInfo.description,
+    type: 'website'
+  }
+
+  return <ThemeComponents.LayoutArchive {...props} meta={meta}/>
 }

 export async function getStaticProps () {
-  const { allPosts, categories, tags, postCount, customNav } =
-    await getGlobalNotionData({ from: 'archive-index' })
-
+  const props = await getGlobalNotionData({ from: 'archive-index' })
+  props.posts = props.allPosts
  return {
-    props: {
-      posts: allPosts,
-      tags,
-      categories,
-      postCount,
-      customNav
-    },
+    props,
    revalidate: 1
  }
 }
--- a/pages/article/[slug].js
+++ b/pages/article/[slug].js
@@ -4,18 +4,34 @@ import { getGlobalNotionData } from '@/lib/notion/getNotionData'
 import { useGlobal } from '@/lib/global'
 import * as ThemeMap from '@/themes'
 import { useEffect, useState } from 'react'
+import { useRouter } from 'next/router'

 /**
 * 根据notion的slug访问页面
 * @param {*} props
 * @returns
 */
-const Slug = (props) => {
+const Slug = props => {
  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]
  const { post } = props
+
  if (!post) {
-    return <ThemeComponents.Layout404 {...props}/>
+    const router = useRouter()
+    useEffect(() => {
+      setTimeout(() => {
+        if (window) {
+          const article = document.getElementById('container')
+          if (!article) {
+            router.push('/404').then(() => {
+              console.log('找不到页面', router.asPath)
+            })
+          }
+        }
+      }, 3000)
+    })
+
+    return <p>Redirecting...</p>
  }

  // 文章锁🔐
@@ -40,7 +56,15 @@ const Slug = (props) => {

  props = { ...props, lock, setLock, validPassword }

-  return <ThemeComponents.LayoutSlug {...props} showArticleInfo={true}/>
+  const { siteInfo } = props
+  const meta = {
+    title: `${props.post.title} | ${siteInfo.title}`,
+    description: props.post.summary,
+    type: 'article',
+    tags: props.post.tags
+  }
+
+  return <ThemeComponents.LayoutSlug {...props} showArticleInfo={true} meta={meta}/>
 }

 export async function getStaticPaths () {
@@ -61,35 +85,20 @@ export async function getStaticPaths () {

 export async function getStaticProps ({ params: { slug } }) {
  const from = `slug-props-${slug}`
-  const { customNav, allPosts, categories, tags, postCount, latestPosts } =
-    await getGlobalNotionData({ from, pageType: ['Post'] })
-
-  const post = allPosts.find(p => p.slug === slug)
-
-  if (!post) {
-    return { props: {}, revalidate: 1 }
+  const props = await getGlobalNotionData({ from, pageType: ['Post'] })
+  const allPosts = props.allPosts
+  props.post = props.allPosts.find(p => p.slug === slug)
+  if (!props.post) {
+    return { props, revalidate: 1 }
  }
+  props.post.blockMap = await getPostBlocks(props.post.id, 'slug')

-  post.blockMap = await getPostBlocks(post.id, 'slug')
-
-  const index = allPosts.indexOf(post)
-  const prev = allPosts.slice(index - 1, index)[0] ?? allPosts.slice(-1)[0]
-  const next = allPosts.slice(index + 1, index + 2)[0] ?? allPosts[0]
-
-  const recommendPosts = getRecommendPost(post, allPosts, BLOG.POST_RECOMMEND_COUNT)
-
+  const index = allPosts.indexOf(props.post)
+  props.prev = allPosts.slice(index - 1, index)[0] ?? allPosts.slice(-1)[0]
+  props.next = allPosts.slice(index + 1, index + 2)[0] ?? allPosts[0]
+  props.recommendPosts = getRecommendPost(props.post, allPosts, BLOG.POST_RECOMMEND_COUNT)
  return {
-    props: {
-      post,
-      tags,
-      prev,
-      next,
-      recommendPosts,
-      categories,
-      postCount,
-      latestPosts,
-      customNav
-    },
+    props,
    revalidate: 1
  }
 }
--- a/pages/category/[category].js
+++ b/pages/category/[category].js
@@ -6,33 +6,29 @@ import * as ThemeMap from '@/themes'
 export default function Category (props) {
  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]
-  return <ThemeComponents.LayoutCategory {...props} />
+  const { siteInfo, posts } = props
+  const { locale } = useGlobal()
+  if (!posts) {
+    return <ThemeComponents.Layout404 {...props}/>
+  }
+  const meta = {
+    title: `${props.category} | ${locale.COMMON.CATEGORY} | ${siteInfo?.title || ''}`,
+    description: siteInfo?.description,
+    type: 'website'
+  }
+  return <ThemeComponents.LayoutCategory {...props} meta={meta} />
 }

-export async function getStaticProps ({ params }) {
+export async function getStaticProps ({ params: { category } }) {
  const from = 'category-props'
-  const category = params.category
-  const {
-    allPosts,
-    categories,
-    tags,
-    postCount,
-    latestPosts,
-    customNav
-  } = await getGlobalNotionData({ from })
-  const filteredPosts = allPosts.filter(
+  let props = await getGlobalNotionData({ from })
+  const posts = props.allPosts.filter(
    post => post && post.category && post.category.includes(category)
  )
+  props = { ...props, posts, category }
+
  return {
-    props: {
-      tags,
-      posts: filteredPosts,
-      category,
-      categories,
-      postCount,
-      latestPosts,
-      customNav
-    },
+    props,
    revalidate: 1
  }
 }
--- a/pages/category/index.js
+++ b/pages/category/index.js
@@ -6,22 +6,20 @@ import * as ThemeMap from '@/themes'
 export default function Category (props) {
  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]
-  return <ThemeComponents.LayoutCategoryIndex {...props}/>
+  const { locale } = useGlobal()
+  const { siteInfo } = props
+  const meta = {
+    title: `${locale.COMMON.CATEGORY} | ${siteInfo.title}`,
+    description: siteInfo.description,
+    type: 'website'
+  }
+  return <ThemeComponents.LayoutCategoryIndex {...props} meta={meta}/>
 }

 export async function getStaticProps () {
-  const from = 'category-index-props'
-  const { allPosts, categories, tags, postCount, latestPosts, customNav } = await getGlobalNotionData({ from, categoryCount: 0 })
-
+  const props = await getGlobalNotionData({ from: 'category-index-props', categoryCount: 0 })
  return {
-    props: {
-      tags,
-      allPosts,
-      categories,
-      postCount,
-      latestPosts,
-      customNav
-    },
+    props,
    revalidate: 1
  }
 }
--- a/pages/index.js
+++ b/pages/index.js
@@ -11,10 +11,11 @@ const Index = (props) => {

 export async function getStaticProps () {
  const from = 'index'
-  const { allPosts, latestPosts, categories, tags, postCount, customNav } = await getGlobalNotionData({ from, pageType: ['Post'] })
+  const props = await getGlobalNotionData({ from, pageType: ['Post'] })
+  const { allPosts, siteInfo } = props
  const meta = {
-    title: `${BLOG.TITLE}`,
-    description: BLOG.DESCRIPTION,
+    title: `${siteInfo.title}`,
+    description: siteInfo.description,
    type: 'website'
  }

@@ -38,16 +39,11 @@ export async function getStaticProps () {
      }
    }
  }
+  props.posts = postsToShow

  return {
    props: {
-      posts: postsToShow,
-      latestPosts,
-      postCount,
-      tags,
-      categories,
-      meta,
-      customNav
+      meta, ...props
    },
    revalidate: 1
  }
--- a/pages/page/[page].js
+++ b/pages/page/[page].js
@@ -4,13 +4,19 @@ import { getGlobalNotionData } from '@/lib/notion/getNotionData'
 import { useGlobal } from '@/lib/global'
 import * as ThemeMap from '@/themes'

-const Page = (props) => {
+const Page = props => {
  const { theme } = useGlobal()
+  const { siteInfo } = props
  const ThemeComponents = ThemeMap[theme]
-  if (!props?.meta) {
-    return <ThemeComponents.Layout404 {...props}/>
+  if (!siteInfo) {
+    return <></>
  }
-  return <ThemeComponents.LayoutPage {...props} />
+  const meta = {
+    title: `${props.page} | Page | ${siteInfo.title}`,
+    description: siteInfo.description,
+    type: 'website'
+  }
+  return <ThemeComponents.LayoutPage {...props} meta={meta} />
 }

 export async function getStaticPaths () {
@@ -26,28 +32,16 @@ export async function getStaticPaths () {

 export async function getStaticProps ({ params: { page } }) {
  const from = `page-${page}`
-  const {
-    allPosts,
-    latestPosts,
-    categories,
-    tags,
-    postCount,
-    customNav
-  } = await getGlobalNotionData({ from })
-  const meta = {
-    title: `${page} | Page | ${BLOG.TITLE}`,
-    description: BLOG.DESCRIPTION,
-    type: 'website'
-  }
-
+  const props = await getGlobalNotionData({ from })
+  props.page = page
  // 处理分页
-  const postsToShow = allPosts.slice(
+  props.posts = props.allPosts.slice(
    BLOG.POSTS_PER_PAGE * (page - 1),
    BLOG.POSTS_PER_PAGE * page
  )
  if (BLOG.POST_LIST_PREVIEW === 'true') {
-    for (const i in postsToShow) {
-      const post = postsToShow[i]
+    for (const i in props.posts) {
+      const post = props.posts[i]
      const blockMap = await getPostBlocks(post.id, 'slug', BLOG.POST_PREVIEW_LINES)
      if (blockMap) {
        post.blockMap = blockMap
@@ -56,16 +50,7 @@ export async function getStaticProps ({ params: { page } }) {
  }

  return {
-    props: {
-      page,
-      posts: postsToShow,
-      postCount,
-      latestPosts,
-      tags,
-      categories,
-      meta,
-      customNav
-    },
+    props,
    revalidate: 1
  }
 }
--- a/pages/search/[keyword].js
+++ b/pages/search/[keyword].js
@@ -1,18 +1,16 @@
 import { getGlobalNotionData } from '@/lib/notion/getNotionData'
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import { getDataFromCache } from '@/lib/cache/cache_manager'
 import * as ThemeMap from '@/themes'

-const Index = (props) => {
-  const { keyword } = props
+const Index = props => {
+  const { keyword, siteInfo } = props
  const { locale } = useGlobal()
  const meta = {
-    title: `${keyword || ''} | ${locale.NAV.SEARCH} | ${BLOG.TITLE}  `,
-    description: BLOG.DESCRIPTION,
+    title: `${keyword || ''} | ${locale.NAV.SEARCH} | ${siteInfo.title}`,
+    description: siteInfo.title,
    type: 'website'
  }
-
  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]
  return <ThemeComponents.LayoutSearch {...props} meta={meta} currentSearch={keyword} />
@@ -24,26 +22,10 @@ const Index = (props) => {
 * @returns
 */
 export async function getServerSideProps ({ params: { keyword } }) {
-  const {
-    allPosts,
-    categories,
-    tags,
-    postCount,
-    latestPosts,
-    customNav
-  } = await getGlobalNotionData({ from: 'search-props', pageType: ['Post'] })
-
-  const filterPosts = await filterByMemCache(allPosts, keyword)
+  const props = await getGlobalNotionData({ from: 'search-props', pageType: ['Post'] })
+  props.posts = await filterByMemCache(props.allPosts, keyword)
  return {
-    props: {
-      posts: filterPosts,
-      tags,
-      categories,
-      postCount,
-      latestPosts,
-      customNav,
-      keyword
-    }
+    props
  }
 }

--- a/pages/search/index.js
+++ b/pages/search/index.js
@@ -1,11 +1,10 @@
 import { getGlobalNotionData } from '@/lib/notion/getNotionData'
-import BLOG from '@/blog.config'
 import { useGlobal } from '@/lib/global'
 import { useRouter } from 'next/router'
 import * as ThemeMap from '@/themes'

-const Search = (props) => {
-  const { posts } = props
+const Search = props => {
+  const { posts, siteInfo } = props
  let filteredPosts
  const searchKey = getSearchKey()
  // 静态过滤
@@ -22,31 +21,25 @@ const Search = (props) => {

  const { locale } = useGlobal()
  const meta = {
-    title: `${searchKey || ''} | ${locale.NAV.SEARCH} | ${BLOG.TITLE}  `,
-    description: BLOG.DESCRIPTION,
+    title: `${searchKey || ''} | ${locale.NAV.SEARCH} | ${siteInfo.title}`,
+    description: siteInfo.description,
    type: 'website'
  }

  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]

-  return <ThemeComponents.LayoutSearch {...props} posts={filteredPosts} meta={meta} currentSearch={searchKey} />
+  return <ThemeComponents.LayoutSearch {...props} posts={filteredPosts} currentSearch={searchKey} meta={meta} />
 }

 /**
 * 浏览器前端搜索
 */
 export async function getStaticProps () {
-  const { allPosts, categories, tags, postCount, latestPosts, customNav } = await getGlobalNotionData({ from: 'search-props', pageType: ['Post'] })
+  const props = await getGlobalNotionData({ from: 'search-props', pageType: ['Post'] })
+  props.posts = props.allPosts
  return {
-    props: {
-      posts: allPosts,
-      tags,
-      categories,
-      postCount,
-      latestPosts,
-      customNav
-    },
+    props,
    revalidate: 1
  }
 }
--- a/pages/tag/[tag].js
+++ b/pages/tag/[tag].js
@@ -2,40 +2,31 @@ import { useGlobal } from '@/lib/global'
 import { getGlobalNotionData } from '@/lib/notion/getNotionData'
 import * as ThemeMap from '@/themes'

-const Tag = (props) => {
+const Tag = props => {
  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]
-  return <ThemeComponents.LayoutTag {...props} />
+  const { locale } = useGlobal()
+  const { tag, siteInfo, posts } = props
+
+  if (!posts) {
+    return <ThemeComponents.Layout404 {...props}/>
+  }
+
+  const meta = {
+    title: `${tag} | ${locale.COMMON.TAGS} | ${siteInfo?.title}`,
+    description: siteInfo?.description,
+    type: 'website'
+  }
+  return <ThemeComponents.LayoutTag {...props} meta={meta}/>
 }

-export async function getStaticProps ({ params }) {
-  const tag = params.tag
-  const from = 'tag-props'
-  const {
-    allPosts,
-    categories,
-    tags,
-    postCount,
-    latestPosts,
-    customNav
-  } = await getGlobalNotionData({
-    from,
-    includePage: false,
-    tagsCount: 0
-  })
-  const filteredPosts = allPosts.filter(
-    post => post && post.tags && post.tags.includes(tag)
-  )
+export async function getStaticProps ({ params: { tag } }) {
+  const props = await getGlobalNotionData({ from: 'tag-props', includePage: false, tagsCount: 0 })
+  const { allPosts } = props
+  props.posts = allPosts.filter(post => post && post.tags && post.tags.includes(tag))
+  props.tag = tag
  return {
-    props: {
-      tags,
-      posts: filteredPosts,
-      tag,
-      categories,
-      postCount,
-      latestPosts,
-      customNav
-    },
+    props,
    revalidate: 1
  }
 }
--- a/pages/tag/index.js
+++ b/pages/tag/index.js
@@ -3,24 +3,24 @@ import React from 'react'
 import { useGlobal } from '@/lib/global'
 import * as ThemeMap from '@/themes'

-const TagIndex = (props) => {
+const TagIndex = props => {
  const { theme } = useGlobal()
  const ThemeComponents = ThemeMap[theme]
-  return <ThemeComponents.LayoutTagIndex {...props} />
+  const { locale } = useGlobal()
+  const { siteInfo } = props
+  const meta = {
+    title: `${locale.COMMON.TAGS} | ${siteInfo.title}`,
+    description: siteInfo.description,
+    type: 'website'
+  }
+  return <ThemeComponents.LayoutTagIndex {...props} meta={meta} />
 }

 export async function getStaticProps () {
  const from = 'tag-index-props'
-  const { categories, tags, postCount, latestPosts, customNav } = await getGlobalNotionData({ from, tagsCount: 0 })
-
+  const props = await getGlobalNotionData({ from, tagsCount: 0 })
  return {
-    props: {
-      tags,
-      categories,
-      postCount,
-      latestPosts,
-      customNav
-    },
+    props,
    revalidate: 1
  }
 }