From 53c004843e871e4bb904fe5ba6f3cfc5b80dcdf0 Mon Sep 17 00:00:00 2001 From: tangly1024 Date: Wed, 30 Mar 2022 15:34:25 +0800 Subject: [PATCH] =?UTF-8?q?=E7=AB=99=E7=82=B9=E4=BF=A1=E6=81=AF=E8=AF=BB?= =?UTF-8?q?=E5=8F=96Notion=E6=95=B0=E6=8D=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- blog.config.js | 9 ++- lib/notion/getNotionData.js | 59 +++++++++++++++++-- package.json | 2 +- pages/404.js | 25 ++++++++ pages/[slug].js | 32 +++++++---- pages/archive/index.js | 26 ++++----- pages/article/[slug].js | 67 ++++++++++++---------- pages/category/[category].js | 38 ++++++------ pages/category/index.js | 22 ++++--- pages/index.js | 16 ++---- pages/page/[page].js | 47 ++++++--------- pages/search/[keyword].js | 32 +++-------- pages/search/index.js | 23 +++----- pages/tag/[tag].js | 49 +++++++--------- pages/tag/index.js | 22 +++---- themes/example/LayoutArchive.js | 10 +--- themes/example/LayoutBase.js | 8 +-- themes/example/LayoutSlug.js | 10 +--- themes/fukasawa/Layout404.js | 2 +- themes/fukasawa/LayoutArchive.js | 12 +--- themes/fukasawa/LayoutCategory.js | 2 +- themes/fukasawa/LayoutCategoryIndex.js | 8 +-- themes/fukasawa/LayoutSlug.js | 10 +--- themes/fukasawa/LayoutTagIndex.js | 9 +-- themes/fukasawa/components/AsideLeft.js | 7 +-- themes/fukasawa/components/Logo.js | 6 +- themes/fukasawa/components/TopNav.js | 4 +- themes/hexo/Layout404.js | 23 +------- themes/hexo/LayoutArchive.js | 11 +--- themes/hexo/LayoutBase.js | 4 +- themes/hexo/LayoutCategory.js | 12 +--- themes/hexo/LayoutCategoryIndex.js | 8 +-- themes/hexo/LayoutIndex.js | 2 +- themes/hexo/LayoutSlug.js | 8 --- themes/hexo/LayoutTag.js | 11 +--- themes/hexo/LayoutTagIndex.js | 8 +-- themes/hexo/components/ArticleRecommend.js | 2 +- themes/hexo/components/Header.js | 11 ++-- themes/hexo/components/HeaderArticle.js | 4 +- themes/hexo/components/LatestPostsGroup.js | 3 +- themes/hexo/components/Logo.js | 6 +- themes/hexo/components/TopNav.js | 4 +- themes/hexo/config_hexo.js | 1 - themes/medium/Layout404.js | 2 +- themes/medium/LayoutArchive.js | 10 +--- themes/medium/LayoutCategory.js | 2 +- themes/medium/LayoutSlug.js | 8 --- themes/medium/components/LogoBar.js | 6 +- themes/medium/components/TopNavBar.js | 2 +- themes/next/Layout404.js | 5 +- themes/next/LayoutArchive.js | 11 +--- themes/next/LayoutBase.js | 4 +- themes/next/LayoutCategory.js | 10 +--- themes/next/LayoutCategoryIndex.js | 8 +-- themes/next/LayoutSlug.js | 8 --- themes/next/LayoutTag.js | 11 +--- themes/next/LayoutTagIndex.js | 8 +-- themes/next/components/Logo.js | 8 +-- themes/next/components/SideAreaLeft.js | 4 +- themes/next/components/TopNav.js | 2 +- themes/next/config_next.js | 1 - 61 files changed, 322 insertions(+), 463 deletions(-) create mode 100644 pages/404.js diff --git a/blog.config.js b/blog.config.js index 2088e10c..1e7de4a5 100644 --- a/blog.config.js +++ b/blog.config.js @@ -1,7 +1,5 @@ // 注: process.env.XX是Vercel的环境变量,配置方式见:https://docs.tangly1024.com/zh/features/personality const BLOG = { - TITLE: process.env.NEXT_PUBLIC_TITLE || 'NotionNext BLOG', // 站点标题 - DESCRIPTION: process.env.NEXT_PUBLIC_DESCRIPTION || '这是一个由NotionNext生成的站点', // 站点描述 AUTHOR: 'tangly1024', // 作者 BIO: '一个普通的干饭人🍚', // 作者简介 LINK: 'https://tangly1024.com', // 网站地址 @@ -14,6 +12,7 @@ const BLOG = { THEME: process.env.NEXT_PUBLIC_THEME || 'next', // 主题, 支持 ['next','hexo',"fukasawa','medium'] THEME_SWITCH: process.env.NEXT_PUBLIC_THEME_SWITCH || false, // 是否显示切换主题按钮 LANG: 'zh-CN', // e.g 'zh-CN','en-US' see /lib/lang.js for more. + HOME_BANNER_IMAGE: './bg_image.jpg', // 首页背景大图,默认文件:/public/bg_image.jpg 。会被Notion中的封面图覆盖。 SINCE: 2021, // e.g if leave this empty, current year will be used. BEI_AN: process.env.NEXT_PUBLIC_BEI_AN || '', // 备案号 闽ICP备XXXXXXX APPEARANCE: 'light', // ['light', 'dark', 'auto'], // light 日间模式 , dark夜间模式, auto根据时间和主题自动夜间模式 @@ -91,8 +90,12 @@ const BLOG = { ADSENSE_GOOGLE_ID: process.env.NEXT_PUBLIC_ADSENSE_GOOGLE_ID || '', // 谷歌广告ID e.g ca-pub-xxxxxxxxxxxxxxxx + // 无关紧要的配置 + TITLE: process.env.NEXT_PUBLIC_TITLE || 'NotionNext BLOG', // 站点标题 ,被notion中的页面标题覆盖 + DESCRIPTION: process.env.NEXT_PUBLIC_DESCRIPTION || '这是一个由NotionNext生成的站点', // 站点描述,被notion中的页面描述覆盖 + isProd: process.env.VERCEL_ENV === 'production', // distinguish between development and production environment (ref: https://vercel.com/docs/environment-variables#system-environment-variables) isProd: process.env.VERCEL_ENV === 'production' // distinguish between development and production environment (ref: https://vercel.com/docs/environment-variables#system-environment-variables) - VERSION: '2.8.4' // 版本号 + VERSION: '2.9.0' // 版本号 } module.exports = BLOG diff --git a/lib/notion/getNotionData.js b/lib/notion/getNotionData.js index 4e03cfc0..4640633b 100644 --- a/lib/notion/getNotionData.js +++ b/lib/notion/getNotionData.js @@ -20,7 +20,12 @@ import { getAllTags } from './getAllTags' categories, 所有分类 postCount, customNav, 自定义导航菜单 - tags 所有标签 + tags, 所有标签 + siteInfo:{ + title, + description, + pageCover + } } * */ @@ -33,15 +38,16 @@ export async function getGlobalNotionData ({ pageType = ['Post'] }) { const notionPageData = await getNotionPageData({ pageId, from }) + const siteInfo = await getBlogInfo({ notionPageData, from }) const tagOptions = notionPageData.tagOptions const categoryOptions = notionPageData.categoryOptions + const customNav = await getCustomNav({ notionPageData }) const allPosts = await getAllPosts({ notionPageData, from, pageType }) const postCount = await getAllPostCount({ notionPageData, from }) - const customNav = await getCustomNav({ notionPageData }) const categories = await getAllCategories({ allPosts, categoryOptions, sliceCount: categoryCount }) const tags = await getAllTags({ allPosts, tagOptions, sliceCount: tagsCount }) const latestPosts = await getLatestPosts({ notionPageData, from, latestPostCount }) - return { allPosts, latestPosts, categories, postCount, customNav, tags } + return { allPosts, latestPosts, categories, postCount, customNav, tags, siteInfo } } /** @@ -83,12 +89,16 @@ export async function getNotionPageData ({ pageId, from }) { const pageRecordMap = await getPageRecordMapByNotionAPI({ pageId, from }) // 存入缓存 if (pageRecordMap) { - console.log('[站点数据]', pageRecordMap) await setDataToCache(cacheKey, pageRecordMap) } return pageRecordMap } +/** + * 获取用户自定义单页菜单 + * @param notionPageData + * @returns {Promise<[]|*[]>} + */ async function getCustomNav ({ notionPageData }) { if (!notionPageData) { notionPageData = await getNotionPageData({ from: 'custom-nav' }) @@ -121,12 +131,53 @@ function getTagOptions (schema) { return tagSchema?.options || [] } +/** + * 获取分类选项 + * @param schema + * @returns {{}|*|*[]} + */ function getCategoryOptions (schema) { if (!schema) return {} const categorySchema = Object.values(schema).find(e => e.name === 'category') return categorySchema?.options || [] } +/** + * 站点信息 + * @param notionPageData + * @param from + * @returns {Promise<{title,description,pageCover}>} + */ +async function getBlogInfo ({ notionPageData, from }) { + if (!notionPageData) { + notionPageData = await getNotionPageData({ from }) + } + if (!notionPageData) { + return null + } + const collection = notionPageData?.collection + const title = collection?.name[0][0] || BLOG.TITLE + const description = collection?.description[0][0] || BLOG.DESCRIPTION + const pageCover = mapCoverUrl(collection?.cover) + return { title, description, pageCover } +} + +/** + * 网站封面背景图 + * @param pageCover + * @returns {string} + */ +const mapCoverUrl = pageCover => { + if (!pageCover || pageCover === '') { + return BLOG.HOME_BANNER_IMAGE + } + if (pageCover.indexOf('/images') === 0) { + return 'https://www.notion.so' + pageCover + } else { + return pageCover + } +} + /** * 调用NotionAPI获取Page数据 * @returns {Promise} diff --git a/package.json b/package.json index 8925efcf..47c448f1 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "notion-next", - "version": "2.8.4", + "version": "2.9.0", "homepage": "https://github.com/tangly1024/NotionNext.git", "license": "MIT", "repository": { diff --git a/pages/404.js b/pages/404.js new file mode 100644 index 00000000..16f4206f --- /dev/null +++ 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 +} + +export async function getStaticProps () { + const props = await getGlobalNotionData({ from: 'category-index-props', categoryCount: 0 }) + return { + props, + revalidate: 1 + } +} + +export default NoFound diff --git a/pages/[slug].js b/pages/[slug].js index 175e6283..8b9f9149 100644 --- 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 } @@ -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 } } diff --git a/pages/archive/index.js b/pages/archive/index.js index 75bf91b1..88f3d619 100644 --- 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 + const { siteInfo } = props + const meta = { + title: `${locale.NAV.ARCHIVE} | ${siteInfo.title}`, + description: siteInfo.description, + type: 'website' + } + + return } 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 } } diff --git a/pages/article/[slug].js b/pages/article/[slug].js index 7787bf5a..9c0f8d97 100644 --- 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 + const router = useRouter() + useEffect(() => { + setTimeout(() => { + if (window) { + const article = document.getElementById('container') + if (!article) { + router.push('/404').then(() => { + console.log('找不到页面', router.asPath) + }) + } + } + }, 3000) + }) + + return

Redirecting...

} // 文章锁🔐 @@ -40,7 +56,15 @@ const Slug = (props) => { props = { ...props, lock, setLock, validPassword } - return + const { siteInfo } = props + const meta = { + title: `${props.post.title} | ${siteInfo.title}`, + description: props.post.summary, + type: 'article', + tags: props.post.tags + } + + return } 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 } } diff --git a/pages/category/[category].js b/pages/category/[category].js index ba0cbf37..0505767e 100644 --- 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 + const { siteInfo, posts } = props + const { locale } = useGlobal() + if (!posts) { + return + } + const meta = { + title: `${props.category} | ${locale.COMMON.CATEGORY} | ${siteInfo?.title || ''}`, + description: siteInfo?.description, + type: 'website' + } + return } -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 } } diff --git a/pages/category/index.js b/pages/category/index.js index dd195d4c..8890ddeb 100644 --- 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 + const { locale } = useGlobal() + const { siteInfo } = props + const meta = { + title: `${locale.COMMON.CATEGORY} | ${siteInfo.title}`, + description: siteInfo.description, + type: 'website' + } + return } 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 } } diff --git a/pages/index.js b/pages/index.js index 8691c8ee..bfbda4dd 100644 --- 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 } diff --git a/pages/page/[page].js b/pages/page/[page].js index 0c3d62e5..00ef030b 100644 --- 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 + if (!siteInfo) { + return <> } - return + const meta = { + title: `${props.page} | Page | ${siteInfo.title}`, + description: siteInfo.description, + type: 'website' + } + return } 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 } } diff --git a/pages/search/[keyword].js b/pages/search/[keyword].js index 8f0cf779..145f9a71 100644 --- 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 @@ -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 } } diff --git a/pages/search/index.js b/pages/search/index.js index bf0849d4..ab64aed0 100644 --- 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 + return } /** * 浏览器前端搜索 */ 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 } } diff --git a/pages/tag/[tag].js b/pages/tag/[tag].js index 238248bd..ab87f0da 100644 --- 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 + const { locale } = useGlobal() + const { tag, siteInfo, posts } = props + + if (!posts) { + return + } + + const meta = { + title: `${tag} | ${locale.COMMON.TAGS} | ${siteInfo?.title}`, + description: siteInfo?.description, + type: 'website' + } + return } -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 } } diff --git a/pages/tag/index.js b/pages/tag/index.js index d8a7911a..a4ab47a7 100644 --- 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 + const { locale } = useGlobal() + const { siteInfo } = props + const meta = { + title: `${locale.COMMON.TAGS} | ${siteInfo.title}`, + description: siteInfo.description, + type: 'website' + } + return } 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 } } diff --git a/themes/example/LayoutArchive.js b/themes/example/LayoutArchive.js index 04a6d647..0ad74453 100644 --- a/themes/example/LayoutArchive.js +++ b/themes/example/LayoutArchive.js @@ -1,11 +1,9 @@ import BLOG from '@/blog.config' -import { useGlobal } from '@/lib/global' import Link from 'next/link' import LayoutBase from './LayoutBase' export const LayoutArchive = props => { const { posts } = props - const { locale } = useGlobal() const postsSortByDate = Object.create(posts) postsSortByDate.sort((a, b) => { @@ -14,12 +12,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 => { @@ -31,7 +23,7 @@ export const LayoutArchive = props => { } }) return ( - +
{Object.keys(archivePosts).map(archiveTitle => (
diff --git a/themes/example/LayoutBase.js b/themes/example/LayoutBase.js index b8f41545..36c92cd1 100644 --- a/themes/example/LayoutBase.js +++ b/themes/example/LayoutBase.js @@ -11,7 +11,7 @@ import { useGlobal } from '@/lib/global' * @constructor */ const LayoutBase = props => { - const { children, meta, customNav } = props + const { children, meta, customNav, siteInfo } = props const { locale } = useGlobal() const d = new Date() const currentYear = d.getFullYear() @@ -35,10 +35,10 @@ const LayoutBase = props => {
- + -
{BLOG.TITLE}
+
{siteInfo.title}
@@ -126,7 +126,7 @@ const LayoutBase = props => { {' '}
-

{meta?.title || BLOG.TITLE}

+

{meta?.title || siteInfo.title}

) diff --git a/themes/example/LayoutSlug.js b/themes/example/LayoutSlug.js index 7ff9b624..fc7f81e1 100644 --- a/themes/example/LayoutSlug.js +++ b/themes/example/LayoutSlug.js @@ -1,4 +1,3 @@ -import BLOG from '@/blog.config' import { getPageTableOfContents } from 'notion-utils' import 'prismjs' import 'prismjs/components/prism-bash' @@ -24,13 +23,6 @@ const mapPageUrl = id => { export const LayoutSlug = props => { const { post, 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) post.toc = getPageTableOfContents(post, post.blockMap) @@ -55,7 +47,7 @@ export const LayoutSlug = props => { } }) return ( - +

{post?.title}

diff --git a/themes/fukasawa/Layout404.js b/themes/fukasawa/Layout404.js index bb21c100..183001c9 100644 --- a/themes/fukasawa/Layout404.js +++ b/themes/fukasawa/Layout404.js @@ -1,5 +1,5 @@ import LayoutBase from './LayoutBase' -export const Layout404 = (props) => { +export const Layout404 = props => { return 404 } diff --git a/themes/fukasawa/LayoutArchive.js b/themes/fukasawa/LayoutArchive.js index 9b32f7af..79f6ea85 100644 --- a/themes/fukasawa/LayoutArchive.js +++ b/themes/fukasawa/LayoutArchive.js @@ -1,11 +1,8 @@ -import BLOG from '@/blog.config' -import { useGlobal } from '@/lib/global' import { useEffect } from 'react' import BlogArchiveItem from './components/BlogPostArchive' import LayoutBase from './LayoutBase' export const LayoutArchive = (props) => { - const { locale } = useGlobal() const { posts } = props // 深拷贝 const postsSortByDate = Object.create(posts) @@ -16,13 +13,6 @@ export const LayoutArchive = (props) => { const dateB = new Date(b?.date.start_date || b.createdTime) return dateB - dateA }) - - const meta = { - title: `${locale.NAV.ARCHIVE} | ${BLOG.TITLE}`, - description: BLOG.DESCRIPTION, - type: 'website' - } - const archivePosts = {} postsSortByDate.forEach(post => { @@ -47,7 +37,7 @@ export const LayoutArchive = (props) => { } } }, []) - return + return
{Object.keys(archivePosts).map(archiveTitle => ( { +export const LayoutCategory = props => { return diff --git a/themes/fukasawa/LayoutCategoryIndex.js b/themes/fukasawa/LayoutCategoryIndex.js index 2c9f2298..d517d65c 100644 --- a/themes/fukasawa/LayoutCategoryIndex.js +++ b/themes/fukasawa/LayoutCategoryIndex.js @@ -1,4 +1,3 @@ -import BLOG from '@/blog.config' import { useGlobal } from '@/lib/global' import Link from 'next/link' import LayoutBase from './LayoutBase' @@ -6,12 +5,7 @@ import LayoutBase from './LayoutBase' export const LayoutCategoryIndex = (props) => { const { locale } = useGlobal() const { categories } = props - const meta = { - title: `${locale.COMMON.CATEGORY} | ${BLOG.TITLE}`, - description: BLOG.DESCRIPTION, - type: 'website' - } - return + return
{locale.COMMON.CATEGORY}: diff --git a/themes/fukasawa/LayoutSlug.js b/themes/fukasawa/LayoutSlug.js index 214f71c1..08c128b4 100644 --- a/themes/fukasawa/LayoutSlug.js +++ b/themes/fukasawa/LayoutSlug.js @@ -1,4 +1,3 @@ -import BLOG from '@/blog.config' import { getPageTableOfContents } from 'notion-utils' import 'prismjs' import 'prismjs/components/prism-bash' @@ -12,20 +11,13 @@ import { ArticleLock } from './components/ArticleLock' export const LayoutSlug = (props) => { const { post, 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) post.toc = getPageTableOfContents(post, post.blockMap) } return ( - + {!lock && } {lock && } diff --git a/themes/fukasawa/LayoutTagIndex.js b/themes/fukasawa/LayoutTagIndex.js index 0642dbd9..d49d032e 100644 --- a/themes/fukasawa/LayoutTagIndex.js +++ b/themes/fukasawa/LayoutTagIndex.js @@ -1,4 +1,3 @@ -import BLOG from '@/blog.config' import { useGlobal } from '@/lib/global' import TagItem from './components/TagItem' import LayoutBase from './LayoutBase' @@ -6,13 +5,7 @@ import LayoutBase from './LayoutBase' export const LayoutTagIndex = (props) => { const { locale } = useGlobal() const { tags } = props - const meta = { - title: `${locale.COMMON.TAGS} | ${BLOG.TITLE}`, - description: BLOG.DESCRIPTION, - type: 'website' - } - - return + return
{locale.COMMON.TAGS}:
diff --git a/themes/fukasawa/components/AsideLeft.js b/themes/fukasawa/components/AsideLeft.js index c9a0175f..c7f52d69 100644 --- a/themes/fukasawa/components/AsideLeft.js +++ b/themes/fukasawa/components/AsideLeft.js @@ -1,4 +1,3 @@ -import BLOG from '@/blog.config' import Logo from './Logo' import GroupCategory from './GroupCategory' import GroupMenu from './GroupMenu' @@ -9,10 +8,10 @@ import Catalog from './Catalog' import { useRouter } from 'next/router' function AsideLeft (props) { - const { tags, currentTag, categories, currentCategory, post, slot } = props + const { tags, currentTag, categories, currentCategory, post, slot, siteInfo } = props const router = useRouter() return
- +

@@ -26,7 +25,7 @@ function AsideLeft (props) {

- { BLOG.DESCRIPTION } + { siteInfo.description }
{router.asPath !== '/tag' &&
diff --git a/themes/fukasawa/components/Logo.js b/themes/fukasawa/components/Logo.js index 8e90b47b..14633529 100644 --- a/themes/fukasawa/components/Logo.js +++ b/themes/fukasawa/components/Logo.js @@ -1,10 +1,10 @@ -import BLOG from '@/blog.config' import Link from 'next/link' -function Logo () { +const Logo = props => { + const { siteInfo } = props return
- {BLOG.TITLE} + {siteInfo.title}
} diff --git a/themes/fukasawa/components/TopNav.js b/themes/fukasawa/components/TopNav.js index 0adf1a63..139310f6 100644 --- a/themes/fukasawa/components/TopNav.js +++ b/themes/fukasawa/components/TopNav.js @@ -8,7 +8,7 @@ import Logo from './Logo' * @param {*} param0 * @returns */ -const TopNav = (props) => { +const TopNav = props => { const [isOpen, changeShow] = useState(false) const toggleMenuOpen = () => { @@ -27,7 +27,7 @@ const TopNav = (props) => {
{/* 左侧LOGO 标题 */}
- +
diff --git a/themes/hexo/Layout404.js b/themes/hexo/Layout404.js index 6b9db681..6140c8fb 100644 --- a/themes/hexo/Layout404.js +++ b/themes/hexo/Layout404.js @@ -1,34 +1,15 @@ -import BLOG from '@/blog.config' -import { useRouter } from 'next/router' -import { useEffect } from 'react' import LayoutBase from './LayoutBase' export const Layout404 = props => { - const router = useRouter() - useEffect(() => { - // 延时3秒如果加载失败就返回首页 - setTimeout(() => { - if (window) { - const article = document.getElementById('container') - if (!article) { - router.push('/').then(() => { - console.log('找不到页面', router.asPath) - }) - } - } - }, 3000) - }) - return ( - +

- 404

-

页面无法加载,即将返回首页

+

页面未找到

diff --git a/themes/hexo/LayoutArchive.js b/themes/hexo/LayoutArchive.js index a42b7993..d2f86b3b 100644 --- a/themes/hexo/LayoutArchive.js +++ b/themes/hexo/LayoutArchive.js @@ -1,5 +1,3 @@ -import BLOG from '@/blog.config' -import { useGlobal } from '@/lib/global' import { useEffect } from 'react' import BlogPostArchive from './components/BlogPostArchive' import Card from './components/Card' @@ -7,7 +5,6 @@ import LayoutBase from './LayoutBase' export const LayoutArchive = (props) => { const { posts } = props - const { locale } = useGlobal() // 深拷贝 const postsSortByDate = Object.create(posts) @@ -18,12 +15,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 => { @@ -48,7 +39,7 @@ export const LayoutArchive = (props) => { } } }, []) - return + return
{Object.keys(archivePosts).map(archiveTitle => ( diff --git a/themes/hexo/LayoutBase.js b/themes/hexo/LayoutBase.js index 064743bf..bfe0ea72 100644 --- a/themes/hexo/LayoutBase.js +++ b/themes/hexo/LayoutBase.js @@ -18,7 +18,7 @@ import { useGlobal } from '@/lib/global' * @constructor */ const LayoutBase = (props) => { - const { children, headerSlot, floatSlot, meta } = props + const { children, headerSlot, floatSlot, meta, siteInfo } = props const [show, switchShow] = useState(false) // const [percent, changePercent] = useState(0) // 页面阅读百分比 const rightAreaSlot = @@ -72,7 +72,7 @@ const LayoutBase = (props) => {
-
+
) } diff --git a/themes/hexo/LayoutCategory.js b/themes/hexo/LayoutCategory.js index 92c5a8a1..8c6854a1 100644 --- a/themes/hexo/LayoutCategory.js +++ b/themes/hexo/LayoutCategory.js @@ -1,17 +1,9 @@ -import BLOG from '@/blog.config' -import { useGlobal } from '@/lib/global' import BlogPostListScroll from './components/BlogPostListScroll' import LayoutBase from './LayoutBase' -export const LayoutCategory = (props) => { +export const LayoutCategory = props => { const { tags, posts, category } = props - const { locale } = useGlobal() - const meta = { - title: `${category} | ${locale.COMMON.CATEGORY} | ${BLOG.TITLE}`, - description: BLOG.DESCRIPTION, - type: 'website' - } - return + return } diff --git a/themes/hexo/LayoutCategoryIndex.js b/themes/hexo/LayoutCategoryIndex.js index 1556861a..6d21da03 100644 --- a/themes/hexo/LayoutCategoryIndex.js +++ b/themes/hexo/LayoutCategoryIndex.js @@ -1,4 +1,3 @@ -import BLOG from '@/blog.config' import { useGlobal } from '@/lib/global' import Link from 'next/link' import Card from './components/Card' @@ -7,13 +6,8 @@ import LayoutBase from './LayoutBase' export const LayoutCategoryIndex = props => { const { categories } = props const { locale } = useGlobal() - const meta = { - title: `${locale.COMMON.CATEGORY} | ${BLOG.TITLE}`, - description: BLOG.DESCRIPTION, - type: 'website' - } return ( - +
diff --git a/themes/hexo/LayoutIndex.js b/themes/hexo/LayoutIndex.js index d7a7c3af..db058549 100644 --- a/themes/hexo/LayoutIndex.js +++ b/themes/hexo/LayoutIndex.js @@ -4,7 +4,7 @@ import CONFIG_HEXO from './config_hexo' import LayoutBase from './LayoutBase' export const LayoutIndex = (props) => { - return }> + return }> } diff --git a/themes/hexo/LayoutSlug.js b/themes/hexo/LayoutSlug.js index 0fac6b7c..86c1cd62 100644 --- a/themes/hexo/LayoutSlug.js +++ b/themes/hexo/LayoutSlug.js @@ -1,4 +1,3 @@ -import BLOG from '@/blog.config' import { getPageTableOfContents } from 'notion-utils' import 'prismjs' import 'prismjs/components/prism-bash' @@ -18,12 +17,6 @@ import LayoutBase from './LayoutBase' export const LayoutSlug = props => { const { post, 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) @@ -48,7 +41,6 @@ export const LayoutSlug = props => { } {...props} - meta={meta} showCategory={false} showTag={false} floatSlot={floatSlot} diff --git a/themes/hexo/LayoutTag.js b/themes/hexo/LayoutTag.js index 7f6249e1..7380aef0 100644 --- a/themes/hexo/LayoutTag.js +++ b/themes/hexo/LayoutTag.js @@ -1,19 +1,10 @@ -import BLOG from '@/blog.config' -import { useGlobal } from '@/lib/global' import BlogPostListScroll from './components/BlogPostListScroll' import LayoutBase from './LayoutBase' 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 + return } diff --git a/themes/hexo/LayoutTagIndex.js b/themes/hexo/LayoutTagIndex.js index 89cfcbad..7649a704 100644 --- a/themes/hexo/LayoutTagIndex.js +++ b/themes/hexo/LayoutTagIndex.js @@ -1,4 +1,3 @@ -import BLOG from '@/blog.config' import { useGlobal } from '@/lib/global' import Card from './components/Card' import TagItemMini from './components/TagItemMini' @@ -7,13 +6,8 @@ import LayoutBase from './LayoutBase' export const LayoutTagIndex = props => { const { tags } = props const { locale } = useGlobal() - const meta = { - title: `${locale.COMMON.TAGS} | ${BLOG.TITLE}`, - description: BLOG.DESCRIPTION, - type: 'website' - } return ( - +
diff --git a/themes/hexo/components/ArticleRecommend.js b/themes/hexo/components/ArticleRecommend.js index 2bde709c..0640a38e 100644 --- a/themes/hexo/components/ArticleRecommend.js +++ b/themes/hexo/components/ArticleRecommend.js @@ -25,7 +25,7 @@ export default function ArticleRecommend ({ recommendPosts }) { {recommendPosts.map(post => { const headerImage = post?.page_cover ? `url("${post.page_cover}")` - : `url("/${CONFIG_HEXO.HOME_BANNER_IMAGE}")` + : `url("/${BLOG.HOME_BANNER_IMAGE}")` return ( diff --git a/themes/hexo/components/Header.js b/themes/hexo/components/Header.js index 5566984f..f214d58c 100644 --- a/themes/hexo/components/Header.js +++ b/themes/hexo/components/Header.js @@ -1,4 +1,3 @@ -import BLOG from '@/blog.config' import { useGlobal } from '@/lib/global' import { useEffect, useState } from 'react' import Typed from 'typed.js' @@ -12,10 +11,10 @@ let autoScroll = false * * @returns 头图 */ -export default function Header () { +const Header = props => { const [typed, changeType] = useState() const { isDarkMode } = useGlobal() - + const { siteInfo } = props useEffect(() => { scrollTrigger() updateHeaderHeight() @@ -102,11 +101,11 @@ export default function Header () { className="duration-500 md:bg-fixed w-full bg-cover bg-center h-screen bg-black text-white" style={{ backgroundImage: - `linear-gradient(rgba(0, 0, 0, 0.8), rgba(0,0,0,0.2), rgba(0, 0, 0, 0.8) ),url("${CONFIG_HEXO.HOME_BANNER_IMAGE}")` + `linear-gradient(rgba(0, 0, 0, 0.8), rgba(0,0,0,0.2), rgba(0, 0, 0, 0.8) ),url("${siteInfo.pageCover}")` }} >
-
{BLOG.TITLE}
+
{siteInfo.title}
@@ -122,3 +121,5 @@ export default function Header () { ) } + +export default Header diff --git a/themes/hexo/components/HeaderArticle.js b/themes/hexo/components/HeaderArticle.js index 1f9438dd..36530fd6 100644 --- a/themes/hexo/components/HeaderArticle.js +++ b/themes/hexo/components/HeaderArticle.js @@ -1,11 +1,11 @@ import Link from 'next/link' import { useGlobal } from '@/lib/global' import formatDate from '@/lib/formatDate' -import CONFIG_HEXO from '../config_hexo' import { useEffect } from 'react' +import BLOG from '@/blog.config' export default function HeaderArticle ({ post }) { - const headerImage = post?.page_cover ? `url("${post.page_cover}")` : `url("/${CONFIG_HEXO.HOME_BANNER_IMAGE}")` + const headerImage = post?.page_cover ? `url("${post.page_cover}")` : `url("/${BLOG.HOME_BANNER_IMAGE}")` const { isDarkMode } = useGlobal() const { locale } = useGlobal() diff --git a/themes/hexo/components/LatestPostsGroup.js b/themes/hexo/components/LatestPostsGroup.js index a2e39f31..dc4a993d 100644 --- a/themes/hexo/components/LatestPostsGroup.js +++ b/themes/hexo/components/LatestPostsGroup.js @@ -2,7 +2,6 @@ import BLOG from '@/blog.config' import { useGlobal } from '@/lib/global' import Link from 'next/link' import { useRouter } from 'next/router' -import CONFIG_HEXO from '../config_hexo' /** * 最新文章列表 @@ -30,7 +29,7 @@ const LatestPostsGroup = ({ posts }) => { const selected = currentPath === `${BLOG.PATH}/article/${post.slug}` const headerImage = post?.page_cover ? `url("${post.page_cover}")` - : `url("/${CONFIG_HEXO.HOME_BANNER_IMAGE}")` + : `url("/${BLOG.HOME_BANNER_IMAGE}")` return ( { +const Logo = props => { + const { siteInfo } = props return
-
{BLOG.TITLE}
+
{siteInfo.title}
} diff --git a/themes/hexo/components/TopNav.js b/themes/hexo/components/TopNav.js index d4a14b00..1455ef8e 100644 --- a/themes/hexo/components/TopNav.js +++ b/themes/hexo/components/TopNav.js @@ -18,7 +18,7 @@ let windowTop = 0 * @param {*} param0 * @returns */ -const TopNav = (props) => { +const TopNav = props => { const { tags, currentTag, categories, currentCategory } = props const { locale } = useGlobal() const searchDrawer = useRef() @@ -94,7 +94,7 @@ const TopNav = (props) => {