diff --git a/lib/config.js b/lib/config.js
index 8002e046..8b27c7f1 100644
--- a/lib/config.js
+++ b/lib/config.js
@@ -14,15 +14,38 @@ import { deepClone } from './utils'
* @param {*} extendConfig ; 参考配置对象{key:val},如果notion中找不到优先尝试在这里面查找
* @returns
*/
-export const siteConfig = (key, defaultVal = null, extendConfig = null) => {
- let global = null
+export const siteConfig = (key, defaultVal = null, extendConfig = {}) => {
+ if (!key) {
+ return null
+ }
+
+ // 特殊配置处理;某些配置只在服务端生效;而Global的NOTION_CONFIG仅限前端组件使用,因此需要从extendConfig中读取
+ switch (key) {
+ case 'NEXT_REVALIDATE_SECOND':
+ case 'POST_RECOMMEND_COUNT':
+ case 'IMAGE_COMPRESS_WIDTH':
+ case 'PSEUDO_STATIC':
+ case 'POSTS_SORT_BY':
+ case 'POSTS_PER_PAGE':
+ case 'POST_PREVIEW_LINES':
+ case 'POST_URL_PREFIX':
+ case 'POST_LIST_STYLE':
+ case 'POST_LIST_PREVIEW':
+ case 'POST_URL_PREFIX_MAPPING_CATEGORY':
+ return convertVal(extendConfig[key] || defaultVal || BLOG[key])
+ default:
+ }
+
+ let global = {}
try {
- const isClient = typeof window !== 'undefined'
+ // const isClient = typeof window !== 'undefined'
// eslint-disable-next-line react-hooks/rules-of-hooks
- global = isClient ? useGlobal() : {}
+ global = useGlobal()
// eslint-disable-next-line react-hooks/rules-of-hooks
// global = useGlobal()
- } catch (error) {}
+ } catch (error) {
+ console.warn('SiteConfig警告', key, error)
+ }
// 首先 配置最优先读取NOTION中的表格配置
let val = null
@@ -66,6 +89,16 @@ export const siteConfig = (key, defaultVal = null, extendConfig = null) => {
}
// 从Notion_CONFIG读取的配置通常都是字符串,适当转义
+ return convertVal(val)
+}
+
+/**
+ * 配置默认都是string类型;
+ * 识别配置的值是否数字、布尔、[]数组,若是则转成对应类型
+ * @param {*} val
+ * @returns
+ */
+export const convertVal = val => {
if (typeof val === 'string') {
// 解析布尔
if (val === 'true' || val === 'false') {
diff --git a/lib/db/getSiteData.js b/lib/db/getSiteData.js
index f814a905..2b9f6838 100755
--- a/lib/db/getSiteData.js
+++ b/lib/db/getSiteData.js
@@ -236,12 +236,13 @@ function getCategoryOptions(schema) {
* @param from
* @returns {Promise<{title,description,pageCover,icon}>}
*/
-function getSiteInfo({ collection, block, NOTION_CONFIG, pageId }) {
- const defaultTitle = siteConfig('TITLE', '', NOTION_CONFIG)
- const defaultDescription = siteConfig('DESCRIPTION', '', NOTION_CONFIG)
- const defaultPageCover = siteConfig('HOME_BANNER_IMAGE', '', NOTION_CONFIG)
- const defaultIcon = siteConfig('AVATAR', '', NOTION_CONFIG)
- const defaultLink = siteConfig('LINK', '', NOTION_CONFIG)
+function getSiteInfo({ collection, block, NOTION_CONFIG }) {
+ const defaultTitle = NOTION_CONFIG?.TITLE || BLOG.TITLE
+ const defaultDescription = NOTION_CONFIG?.DESCRIPTION || BLOG.DESCRIPTION
+ const defaultPageCover =
+ NOTION_CONFIG?.HOME_BANNER_IMAGE || BLOG.HOME_BANNER_IMAGE
+ const defaultIcon = NOTION_CONFIG?.AVATAR || BLOG.AVATAR
+ const defaultLink = NOTION_CONFIG?.LINK || BLOG.LINK
if (!collection && !block) {
return {
title: defaultTitle,
diff --git a/lib/notion/getPageProperties.js b/lib/notion/getPageProperties.js
index 39ebb97d..38eede18 100644
--- a/lib/notion/getPageProperties.js
+++ b/lib/notion/getPageProperties.js
@@ -186,7 +186,7 @@ export function adjustPageProperties(properties, NOTION_CONFIG) {
}
// 开启伪静态路径
- if (siteConfig('PSEUDO_STATIC', false, NOTION_CONFIG)) {
+ if (JSON.parse(NOTION_CONFIG?.PSEUDO_STATIC || BLOG.PSEUDO_STATIC)) {
if (
!properties?.href?.endsWith('.html') &&
!properties?.href?.startsWith('http')
diff --git a/lib/robots.txt.js b/lib/robots.txt.js
index 4dbc61c2..45e11606 100644
--- a/lib/robots.txt.js
+++ b/lib/robots.txt.js
@@ -1,8 +1,8 @@
import fs from 'fs'
-import { siteConfig } from './config'
-export async function generateRobotsTxt(NOTION_CONFIG) {
- const LINK = siteConfig('LINK', '', NOTION_CONFIG)
+export async function generateRobotsTxt(props) {
+ const { siteInfo } = props
+ const LINK = siteInfo?.link
const content = `
# *
User-agent: *
diff --git a/lib/rss.js b/lib/rss.js
index 8b09bdce..fd183b6d 100644
--- a/lib/rss.js
+++ b/lib/rss.js
@@ -1,9 +1,9 @@
+import BLOG from '@/blog.config'
import NotionPage from '@/components/NotionPage'
import { getPostBlocks } from '@/lib/db/getSiteData'
import { Feed } from 'feed'
import fs from 'fs'
import ReactDOMServer from 'react-dom/server'
-import { siteConfig } from './config'
/**
* 生成RSS内容
@@ -25,30 +25,33 @@ const createFeedContent = async post => {
}
}
-export async function generateRss(NOTION_CONFIG, posts) {
- const link = siteConfig('LINK', '', NOTION_CONFIG)
- const author = siteConfig('AUTHOR', '', NOTION_CONFIG)
- const lang = siteConfig('LANG', '', NOTION_CONFIG)
- const subPath = siteConfig('SUB_PATH', '', NOTION_CONFIG)
-
+export async function generateRss(props) {
+ const { NOTION_CONFIG, siteInfo, latestPosts } = props
+ const TITLE = siteInfo?.title
+ const DESCRIPTION = siteInfo?.description
+ const LINK = siteInfo?.link
+ const AUTHOR = NOTION_CONFIG?.AUTHOR || BLOG.AUTHOR
+ const LANG = NOTION_CONFIG?.LANG || BLOG.LANG
+ const SUB_PATH = NOTION_CONFIG?.SUB_PATH || BLOG.SUB_PATH
+ const CONTACT_EMAIL = NOTION_CONFIG?.CONTACT_EMAIL || BLOG.CONTACT_EMAIL
const year = new Date().getFullYear()
const feed = new Feed({
- title: siteConfig('TITLE', '', NOTION_CONFIG),
- description: siteConfig('DESCRIPTION', '', NOTION_CONFIG),
- link: `${link}/${subPath}`,
- language: lang,
- favicon: `${link}/favicon.png`,
- copyright: `All rights reserved ${year}, ${author}`,
+ title: TITLE,
+ description: DESCRIPTION,
+ link: `${LINK}/${SUB_PATH}`,
+ language: LANG,
+ favicon: `${LINK}/favicon.png`,
+ copyright: `All rights reserved ${year}, ${AUTHOR}`,
author: {
- name: author,
- email: siteConfig('CONTACT_EMAIL', '', NOTION_CONFIG),
- link: link
+ name: AUTHOR,
+ email: CONTACT_EMAIL,
+ link: LINK
}
})
- for (const post of posts) {
+ for (const post of latestPosts) {
feed.addItem({
title: post.title,
- link: `${link}/${post.slug}`,
+ link: `${LINK}/${post.slug}`,
description: post.summary,
content: await createFeedContent(post),
date: new Date(post?.publishDay)
diff --git a/pages/category/[category]/index.js b/pages/category/[category]/index.js
index 7542b2bb..879dc642 100644
--- a/pages/category/[category]/index.js
+++ b/pages/category/[category]/index.js
@@ -37,7 +37,10 @@ export async function getStaticProps({ params: { category }, locale }) {
if (siteConfig('POST_LIST_STYLE') === 'scroll') {
// 滚动列表 给前端返回所有数据
} else if (siteConfig('POST_LIST_STYLE') === 'page') {
- props.posts = props.posts?.slice(0, siteConfig('POSTS_PER_PAGE'))
+ props.posts = props.posts?.slice(
+ 0,
+ siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)
+ )
}
delete props.allPages
diff --git a/pages/category/[category]/page/[page].js b/pages/category/[category]/page/[page].js
index fbe1e7e2..39ce44df 100644
--- a/pages/category/[category]/page/[page].js
+++ b/pages/category/[category]/page/[page].js
@@ -30,10 +30,11 @@ export async function getStaticProps({ params: { category, page } }) {
.filter(post => post && post.category && post.category.includes(category))
// 处理文章页数
props.postCount = props.posts.length
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)
// 处理分页
props.posts = props.posts.slice(
- siteConfig('POSTS_PER_PAGE') * (page - 1),
- siteConfig('POSTS_PER_PAGE') * page
+ POSTS_PER_PAGE * (page - 1),
+ POSTS_PER_PAGE * page
)
delete props.allPages
@@ -53,7 +54,9 @@ export async function getStaticProps({ params: { category, page } }) {
export async function getStaticPaths() {
const from = 'category-paths'
- const { categoryOptions, allPages } = await getGlobalData({ from })
+ const { categoryOptions, allPages, NOTION_CONFIG } = await getGlobalData({
+ from
+ })
const paths = []
categoryOptions?.forEach(category => {
@@ -65,7 +68,9 @@ export async function getStaticPaths() {
)
// 处理文章页数
const postCount = categoryPosts.length
- const totalPages = Math.ceil(postCount / siteConfig('POSTS_PER_PAGE'))
+ const totalPages = Math.ceil(
+ postCount / siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ )
if (totalPages > 1) {
for (let i = 1; i <= totalPages; i++) {
paths.push({ params: { category: category.name, page: '' + i } })
diff --git a/pages/index.js b/pages/index.js
index eb0a2bd4..f5bade7f 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -28,7 +28,11 @@ export async function getStaticProps(req) {
const { locale } = req
const from = 'index'
const props = await getGlobalData({ from, locale })
-
+ const POST_PREVIEW_LINES = siteConfig(
+ 'POST_PREVIEW_LINES',
+ 12,
+ props?.NOTION_CONFIG
+ )
props.posts = props.allPages?.filter(
page => page.type === 'Post' && page.status === 'Published'
)
@@ -37,29 +41,28 @@ export async function getStaticProps(req) {
if (siteConfig('POST_LIST_STYLE') === 'scroll') {
// 滚动列表默认给前端返回所有数据
} else if (siteConfig('POST_LIST_STYLE') === 'page') {
- props.posts = props.posts?.slice(0, siteConfig('POSTS_PER_PAGE'))
+ props.posts = props.posts?.slice(
+ 0,
+ siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)
+ )
}
// 预览文章内容
- if (siteConfig('POST_LIST_PREVIEW')) {
+ if (siteConfig('POST_LIST_PREVIEW', false, props?.NOTION_CONFIG)) {
for (const i in props.posts) {
const post = props.posts[i]
if (post.password && post.password !== '') {
continue
}
- post.blockMap = await getPostBlocks(
- post.id,
- 'slug',
- siteConfig('POST_PREVIEW_LINES')
- )
+ post.blockMap = await getPostBlocks(post.id, 'slug', POST_PREVIEW_LINES)
}
}
// 生成robotTxt
- generateRobotsTxt(props?.NOTION_CONFIG)
+ generateRobotsTxt(props)
// 生成Feed订阅
if (JSON.parse(BLOG.ENABLE_RSS)) {
- generateRss(props?.NOTION_CONFIG, props?.latestPosts || [])
+ generateRss(props)
}
// 生成全文索引 - 仅在 yarn build 时执行 && process.env.npm_lifecycle_event === 'build'
diff --git a/pages/page/[page].js b/pages/page/[page].js
index 7d0334ed..236c93ef 100644
--- a/pages/page/[page].js
+++ b/pages/page/[page].js
@@ -21,8 +21,10 @@ const Page = props => {
export async function getStaticPaths({ locale }) {
const from = 'page-paths'
- const { postCount } = await getGlobalData({ from, locale })
- const totalPages = Math.ceil(postCount / siteConfig('POSTS_PER_PAGE'))
+ const { postCount, NOTION_CONFIG } = await getGlobalData({ from, locale })
+ const totalPages = Math.ceil(
+ postCount / siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ )
return {
// remove first page, we 're not gonna handle that.
paths: Array.from({ length: totalPages - 1 }, (_, i) => ({
@@ -36,28 +38,31 @@ export async function getStaticProps({ params: { page } }) {
const from = `page-${page}`
const props = await getGlobalData({ from })
const { allPages } = props
+ const POST_PREVIEW_LINES = siteConfig(
+ 'POST_PREVIEW_LINES',
+ 12,
+ props?.NOTION_CONFIG
+ )
+
const allPosts = allPages?.filter(
page => page.type === 'Post' && page.status === 'Published'
)
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)
// 处理分页
props.posts = allPosts.slice(
- siteConfig('POSTS_PER_PAGE') * (page - 1),
- siteConfig('POSTS_PER_PAGE') * page
+ POSTS_PER_PAGE * (page - 1),
+ POSTS_PER_PAGE * page
)
props.page = page
// 处理预览
- if (siteConfig('POST_LIST_PREVIEW')) {
+ if (siteConfig('POST_LIST_PREVIEW', false, props?.NOTION_CONFIG)) {
for (const i in props.posts) {
const post = props.posts[i]
if (post.password && post.password !== '') {
continue
}
- post.blockMap = await getPostBlocks(
- post.id,
- 'slug',
- siteConfig('POST_PREVIEW_LINES')
- )
+ post.blockMap = await getPostBlocks(post.id, 'slug', POST_PREVIEW_LINES)
}
}
diff --git a/pages/search/[keyword]/index.js b/pages/search/[keyword]/index.js
index 106c3c32..6d753578 100644
--- a/pages/search/[keyword]/index.js
+++ b/pages/search/[keyword]/index.js
@@ -31,11 +31,18 @@ export async function getStaticProps({ params: { keyword }, locale }) {
)
props.posts = await filterByMemCache(allPosts, keyword)
props.postCount = props.posts.length
+ const POST_LIST_STYLE = siteConfig(
+ 'POST_LIST_STYLE',
+ 'Page',
+ props?.NOTION_CONFIG
+ )
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)
+
// 处理分页
- if (siteConfig('POST_LIST_STYLE') === 'scroll') {
- // 滚动列表 给前端返回所有数据
- } else if (siteConfig('POST_LIST_STYLE') === 'page') {
- props.posts = props.posts?.slice(0, siteConfig('POSTS_PER_PAGE'))
+ if (POST_LIST_STYLE === 'scroll') {
+ // 滚动列表默认给前端返回所有数据
+ } else if (POST_LIST_STYLE) {
+ props.posts = props.posts?.slice(0, POSTS_PER_PAGE)
}
props.keyword = keyword
return {
diff --git a/pages/search/[keyword]/page/[page].js b/pages/search/[keyword]/page/[page].js
index 4b88a6a2..6e497b7c 100644
--- a/pages/search/[keyword]/page/[page].js
+++ b/pages/search/[keyword]/page/[page].js
@@ -34,10 +34,11 @@ export async function getStaticProps({ params: { keyword, page }, locale }) {
)
props.posts = await filterByMemCache(allPosts, keyword)
props.postCount = props.posts.length
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)
// 处理分页
props.posts = props.posts.slice(
- siteConfig('POSTS_PER_PAGE') * (page - 1),
- siteConfig('POSTS_PER_PAGE') * page
+ POSTS_PER_PAGE * (page - 1),
+ POSTS_PER_PAGE * page
)
props.keyword = keyword
props.page = page
diff --git a/pages/tag/[tag]/index.js b/pages/tag/[tag]/index.js
index 0643281f..2860f91c 100644
--- a/pages/tag/[tag]/index.js
+++ b/pages/tag/[tag]/index.js
@@ -35,7 +35,10 @@ export async function getStaticProps({ params: { tag }, locale }) {
if (siteConfig('POST_LIST_STYLE') === 'scroll') {
// 滚动列表 给前端返回所有数据
} else if (siteConfig('POST_LIST_STYLE') === 'page') {
- props.posts = props.posts?.slice(0, siteConfig('POSTS_PER_PAGE'))
+ props.posts = props.posts?.slice(
+ 0,
+ siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)
+ )
}
props.tag = tag
diff --git a/pages/tag/[tag]/page/[page].js b/pages/tag/[tag]/page/[page].js
index 6f891675..f8e70c3c 100644
--- a/pages/tag/[tag]/page/[page].js
+++ b/pages/tag/[tag]/page/[page].js
@@ -22,10 +22,11 @@ export async function getStaticProps({ params: { tag, page }, locale }) {
.filter(post => post && post?.tags && post?.tags.includes(tag))
// 处理文章数
props.postCount = props.posts.length
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)
// 处理分页
props.posts = props.posts.slice(
- siteConfig('POSTS_PER_PAGE') * (page - 1),
- siteConfig('POSTS_PER_PAGE') * page
+ POSTS_PER_PAGE * (page - 1),
+ POSTS_PER_PAGE * page
)
props.tag = tag
@@ -43,7 +44,7 @@ export async function getStaticProps({ params: { tag, page }, locale }) {
export async function getStaticPaths() {
const from = 'tag-page-static-path'
- const { tagOptions, allPages } = await getGlobalData({ from })
+ const { tagOptions, allPages, NOTION_CONFIG } = await getGlobalData({ from })
const paths = []
tagOptions?.forEach(tag => {
// 过滤状态类型
@@ -52,7 +53,9 @@ export async function getStaticPaths() {
.filter(post => post && post?.tags && post?.tags.includes(tag.name))
// 处理文章页数
const postCount = tagPosts.length
- const totalPages = Math.ceil(postCount / siteConfig('POSTS_PER_PAGE'))
+ const totalPages = Math.ceil(
+ postCount / siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ )
if (totalPages > 1) {
for (let i = 1; i <= totalPages; i++) {
paths.push({ params: { tag: tag.name, page: '' + i } })
diff --git a/themes/commerce/components/BlogPostListPage.js b/themes/commerce/components/BlogPostListPage.js
index 17ca53bb..d762e083 100644
--- a/themes/commerce/components/BlogPostListPage.js
+++ b/themes/commerce/components/BlogPostListPage.js
@@ -1,7 +1,8 @@
-import ProductCard from './ProductCard'
-import PaginationNumber from './PaginationNumber'
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
import BlogPostListEmpty from './BlogPostListEmpty'
+import PaginationNumber from './PaginationNumber'
+import ProductCard from './ProductCard'
/**
* 文章列表分页表格
@@ -12,20 +13,29 @@ import BlogPostListEmpty from './BlogPostListEmpty'
* @constructor
*/
const BlogPostListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
- const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
- const showPagination = postCount >= parseInt(siteConfig('POSTS_PER_PAGE'))
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ const totalPage = Math.ceil(postCount / POSTS_PER_PAGE)
+ const showPagination = postCount >= POSTS_PER_PAGE
if (!posts || posts.length === 0 || page > totalPage) {
return
} else {
return (
-
+
{/* 文章列表 */}
-
+
{posts?.map(post => (
-
+
))}
- {showPagination &&
}
+ {showPagination && (
+
+ )}
)
}
diff --git a/themes/commerce/components/BlogPostListScroll.js b/themes/commerce/components/BlogPostListScroll.js
index 91beb929..004e2b5e 100644
--- a/themes/commerce/components/BlogPostListScroll.js
+++ b/themes/commerce/components/BlogPostListScroll.js
@@ -1,10 +1,10 @@
import { siteConfig } from '@/lib/config'
-import ProductCard from './ProductCard'
-import BlogPostListEmpty from './BlogPostListEmpty'
import { useGlobal } from '@/lib/global'
-import CONFIG from '../config'
import { getListByPage } from '@/lib/utils'
import { useEffect, useRef, useState } from 'react'
+import CONFIG from '../config'
+import BlogPostListEmpty from './BlogPostListEmpty'
+import ProductCard from './ProductCard'
/**
* 博客列表滚动分页
@@ -13,15 +13,22 @@ import { useEffect, useRef, useState } from 'react'
* @returns {JSX.Element}
* @constructor
*/
-const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG.POST_LIST_SUMMARY, siteInfo }) => {
- const postsPerPage = parseInt(siteConfig('POSTS_PER_PAGE'))
+const BlogPostListScroll = ({
+ posts = [],
+ currentSearch,
+ showSummary = CONFIG.POST_LIST_SUMMARY,
+ siteInfo
+}) => {
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+
const [page, updatePage] = useState(1)
- const postsToShow = getListByPage(posts, page, postsPerPage)
+ const postsToShow = getListByPage(posts, page, POSTS_PER_PAGE)
let hasMore = false
if (posts) {
const totalCount = posts.length
- hasMore = page * postsPerPage < totalCount
+ hasMore = page * POSTS_PER_PAGE < totalCount
}
const handleGetMore = () => {
@@ -33,7 +40,11 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG.PO
const scrollTrigger = () => {
requestAnimationFrame(() => {
const scrollS = window.scrollY + window.outerHeight
- const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
+ const clientHeight = targetRef
+ ? targetRef.current
+ ? targetRef.current.clientHeight
+ : 0
+ : 0
if (scrollS > clientHeight + 100) {
handleGetMore()
}
@@ -54,21 +65,32 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG.PO
if (!postsToShow || postsToShow.length === 0) {
return
} else {
- return
+ return (
+
+ {/* 文章列表 */}
+
+ {postsToShow.map(post => (
+
+ ))}
+
- {/* 文章列表 */}
-
- {postsToShow.map(post => (
-
- ))}
+
+
{
+ handleGetMore()
+ }}
+ className='w-full my-4 py-4 text-center cursor-pointer rounded-xl dark:text-gray-200'>
+ {' '}
+ {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE}`}{' '}
+
+
-
-
-
{ handleGetMore() }}
- className='w-full my-4 py-4 text-center cursor-pointer rounded-xl dark:text-gray-200'
- > {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE}`}
-
-
+ )
}
}
diff --git a/themes/example/components/BlogListPage.js b/themes/example/components/BlogListPage.js
index d1068ffd..f9ae29a4 100644
--- a/themes/example/components/BlogListPage.js
+++ b/themes/example/components/BlogListPage.js
@@ -11,10 +11,10 @@ import BlogItem from './BlogItem'
*/
export const BlogListPage = props => {
const { page = 1, posts, postCount } = props
- const { locale } = useGlobal()
+ const { locale, NOTION_CONFIG } = useGlobal()
const router = useRouter()
const totalPage = Math.ceil(
- postCount / parseInt(siteConfig('POSTS_PER_PAGE'))
+ postCount / siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
)
const currentPage = +page
diff --git a/themes/example/components/BlogListScroll.js b/themes/example/components/BlogListScroll.js
index ea883975..3ddc340a 100644
--- a/themes/example/components/BlogListScroll.js
+++ b/themes/example/components/BlogListScroll.js
@@ -11,21 +11,18 @@ import BlogItem from './BlogItem'
*/
export const BlogListScroll = props => {
const { posts } = props
- const { locale } = useGlobal()
-
+ const { locale, NOTION_CONFIG } = useGlobal()
const [page, updatePage] = useState(1)
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
let hasMore = false
const postsToShow = posts
- ? Object.assign(posts).slice(
- 0,
- parseInt(siteConfig('POSTS_PER_PAGE')) * page
- )
+ ? Object.assign(posts).slice(0, POSTS_PER_PAGE * page)
: []
if (posts) {
const totalCount = posts.length
- hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
+ hasMore = page * POSTS_PER_PAGE < totalCount
}
const handleGetMore = () => {
if (!hasMore) return
diff --git a/themes/fukasawa/components/BlogListPage.js b/themes/fukasawa/components/BlogListPage.js
index 0cd2dc94..e15c58fa 100644
--- a/themes/fukasawa/components/BlogListPage.js
+++ b/themes/fukasawa/components/BlogListPage.js
@@ -1,11 +1,12 @@
+import { AdSlot } from '@/components/GoogleAdsense'
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
import { deepClone, isBrowser } from '@/lib/utils'
+import { debounce } from 'lodash'
+import { useEffect, useState } from 'react'
import BlogCard from './BlogCard'
import BlogPostListEmpty from './BlogListEmpty'
import PaginationSimple from './PaginationSimple'
-import { useEffect, useState } from 'react'
-import { debounce } from 'lodash'
-import { AdSlot } from '@/components/GoogleAdsense'
/**
* 文章列表分页表格
* @param page 当前页
@@ -15,7 +16,10 @@ import { AdSlot } from '@/components/GoogleAdsense'
* @constructor
*/
const BlogListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
- const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
+ const { NOTION_CONFIG } = useGlobal()
+ const totalPage = Math.ceil(
+ postCount / parseInt(siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG))
+ )
const showNext = page < totalPage
const [columns, setColumns] = useState(calculateColumns())
@@ -53,18 +57,25 @@ const BlogListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
return (
{/* 文章列表 */}
-
+
{filterPosts?.map((post, index) => (
-
-
+
+
))}
{siteConfig('ADSENSE_GOOGLE_ID') && (
)}
-
diff --git a/themes/fukasawa/components/BlogListScroll.js b/themes/fukasawa/components/BlogListScroll.js
index b3fdef35..22b21751 100644
--- a/themes/fukasawa/components/BlogListScroll.js
+++ b/themes/fukasawa/components/BlogListScroll.js
@@ -1,8 +1,8 @@
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
import { useEffect, useRef, useState } from 'react'
import BlogCard from './BlogCard'
import BlogPostListEmpty from './BlogListEmpty'
-import { useGlobal } from '@/lib/global'
/**
* 文章列表分页表格
@@ -14,19 +14,19 @@ import { useGlobal } from '@/lib/global'
*/
const BlogListScroll = props => {
const { posts = [], siteInfo } = props
- const { locale } = useGlobal()
+ const { locale, NOTION_CONFIG } = useGlobal()
const targetRef = useRef(null)
-
const [page, updatePage] = useState(1)
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
let hasMore = false
const postsToShow = posts
- ? Object.assign(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page)
+ ? Object.assign(posts).slice(0, POSTS_PER_PAGE * page)
: []
if (posts) {
const totalCount = posts.length
- hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
+ hasMore = page * POSTS_PER_PAGE < totalCount
}
const handleGetMore = () => {
if (!hasMore) return
@@ -37,7 +37,11 @@ const BlogListScroll = props => {
const scrollTrigger = () => {
requestAnimationFrame(() => {
const scrollS = window.scrollY + window.outerHeight
- const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
+ const clientHeight = targetRef
+ ? targetRef.current
+ ? targetRef.current.clientHeight
+ : 0
+ : 0
if (scrollS > clientHeight + 100) {
handleGetMore()
}
@@ -55,20 +59,29 @@ const BlogListScroll = props => {
return
} else {
return (
-
- {/* 文章列表 */}
- {postsToShow?.map(post => (
-
-
-
- ))}
+
+ {/* 文章列表 */}
+ {postsToShow?.map(post => (
+
+
+
+ ))}
-
- {' '}
- {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
-
-
+
+ {' '}
+ {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
+
+
)
}
}
diff --git a/themes/game/components/BlogListPage.js b/themes/game/components/BlogListPage.js
index 8d821bd1..139eb783 100644
--- a/themes/game/components/BlogListPage.js
+++ b/themes/game/components/BlogListPage.js
@@ -1,4 +1,4 @@
-import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
import { GameListIndexCombine } from './GameListIndexCombine'
import PaginationSimple from './PaginationSimple'
/**
@@ -8,9 +8,8 @@ import PaginationSimple from './PaginationSimple'
*/
export const BlogListPage = props => {
const { page = 1, postCount } = props
- const totalPage = Math.ceil(
- postCount / parseInt(siteConfig('POSTS_PER_PAGE'))
- )
+ const { NOTION_CONFIG } = useGlobal()
+ const totalPage = Math.ceil(postCount / NOTION_CONFIG)
const showNext = page < totalPage
return (
diff --git a/themes/game/components/BlogListScroll.js b/themes/game/components/BlogListScroll.js
index cc42438d..6fa04049 100644
--- a/themes/game/components/BlogListScroll.js
+++ b/themes/game/components/BlogListScroll.js
@@ -7,19 +7,19 @@ import { GameListIndexCombine } from './GameListIndexCombine'
export const BlogListScroll = props => {
const { posts } = props
- const { locale } = useGlobal()
-
+ const { locale, NOTION_CONFIG } = useGlobal()
const [page, updatePage] = useState(1)
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
let hasMore = false
const postsToShow =
posts && Array.isArray(posts)
- ? deepClone(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page)
+ ? deepClone(posts).slice(0, POSTS_PER_PAGE * page)
: []
if (posts) {
const totalCount = posts.length
- hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
+ hasMore = page * POSTS_PER_PAGE < totalCount
}
const handleGetMore = () => {
if (!hasMore) return
diff --git a/themes/game/components/BlogPost.js b/themes/game/components/BlogPost.js
index 0131dc62..51354bd8 100644
--- a/themes/game/components/BlogPost.js
+++ b/themes/game/components/BlogPost.js
@@ -1,10 +1,13 @@
import NotionIcon from '@/components/NotionIcon'
import NotionPage from '@/components/NotionPage'
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
import Link from 'next/link'
const BlogPost = ({ post }) => {
- const showPreview = siteConfig('POST_LIST_PREVIEW') && post.blockMap
+ const { NOTION_CONFIG } = useGlobal()
+ const showPreview =
+ siteConfig('POST_LIST_PREVIEW', false, NOTION_CONFIG) && post?.blockMap
return (
diff --git a/themes/heo/components/BlogPostListPage.js b/themes/heo/components/BlogPostListPage.js
index dcb6afa3..4239e233 100644
--- a/themes/heo/components/BlogPostListPage.js
+++ b/themes/heo/components/BlogPostListPage.js
@@ -1,7 +1,8 @@
-import BlogPostCard from './BlogPostCard'
-import PaginationNumber from './PaginationNumber'
-import BlogPostListEmpty from './BlogPostListEmpty'
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import BlogPostCard from './BlogPostCard'
+import BlogPostListEmpty from './BlogPostListEmpty'
+import PaginationNumber from './PaginationNumber'
/**
* 文章列表分页表格
@@ -12,22 +13,31 @@ import { siteConfig } from '@/lib/config'
* @constructor
*/
const BlogPostListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
- const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
- const showPagination = postCount >= parseInt(siteConfig('POSTS_PER_PAGE'))
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ const totalPage = Math.ceil(postCount / POSTS_PER_PAGE)
+ const showPagination = postCount >= POSTS_PER_PAGE
if (!posts || posts.length === 0 || page > totalPage) {
return
} else {
return (
-
- {/* 文章列表 */}
-
- {posts?.map(post => (
-
- ))}
-
+
+ {/* 文章列表 */}
+
+ {posts?.map(post => (
+
+ ))}
+
- {showPagination &&
}
-
+ {showPagination && (
+
+ )}
+
)
}
}
diff --git a/themes/heo/components/BlogPostListScroll.js b/themes/heo/components/BlogPostListScroll.js
index 95063b16..9fa7e736 100644
--- a/themes/heo/components/BlogPostListScroll.js
+++ b/themes/heo/components/BlogPostListScroll.js
@@ -1,10 +1,10 @@
-import BlogPostCard from './BlogPostCard'
-import BlogPostListEmpty from './BlogPostListEmpty'
+import { siteConfig } from '@/lib/config'
import { useGlobal } from '@/lib/global'
+import { getListByPage } from '@/lib/utils'
import { useEffect, useRef, useState } from 'react'
import CONFIG from '../config'
-import { getListByPage } from '@/lib/utils'
-import { siteConfig } from '@/lib/config'
+import BlogPostCard from './BlogPostCard'
+import BlogPostListEmpty from './BlogPostListEmpty'
/**
* 博客列表滚动分页
@@ -13,15 +13,21 @@ import { siteConfig } from '@/lib/config'
* @returns {JSX.Element}
* @constructor
*/
-const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfig('HEO_POST_LIST_SUMMARY', null, CONFIG), siteInfo }) => {
- const postsPerPage = parseInt(siteConfig('POSTS_PER_PAGE'))
+const BlogPostListScroll = ({
+ posts = [],
+ currentSearch,
+ showSummary = siteConfig('HEO_POST_LIST_SUMMARY', null, CONFIG),
+ siteInfo
+}) => {
+ const { NOTION_CONFIG } = useGlobal()
const [page, updatePage] = useState(1)
- const postsToShow = getListByPage(posts, page, postsPerPage)
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ const postsToShow = getListByPage(posts, page, POSTS_PER_PAGE)
let hasMore = false
if (posts) {
const totalCount = posts.length
- hasMore = page * postsPerPage < totalCount
+ hasMore = page * POSTS_PER_PAGE < totalCount
}
const handleGetMore = () => {
@@ -33,7 +39,11 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfi
const scrollTrigger = () => {
requestAnimationFrame(() => {
const scrollS = window.scrollY + window.outerHeight
- const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
+ const clientHeight = targetRef
+ ? targetRef.current
+ ? targetRef.current.clientHeight
+ : 0
+ : 0
if (scrollS > clientHeight + 100) {
handleGetMore()
}
@@ -54,22 +64,33 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfi
if (!postsToShow || postsToShow.length === 0) {
return
} else {
- return
+ return (
+
+ {/* 文章列表 */}
+
+ {postsToShow.map(post => (
+
+ ))}
+
- {/* 文章列表 */}
-
- {postsToShow.map(post => (
-
- ))}
+ {/* 更多按钮 */}
+
+
{
+ handleGetMore()
+ }}
+ className='w-full my-4 py-4 text-center cursor-pointer rounded-xl dark:text-gray-200'>
+ {' '}
+ {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE}`}{' '}
+
+
-
- {/* 更多按钮 */}
-
-
{ handleGetMore() }}
- className='w-full my-4 py-4 text-center cursor-pointer rounded-xl dark:text-gray-200'
- > {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE}`}
-
-
+ )
}
}
diff --git a/themes/hexo/components/BlogPostListPage.js b/themes/hexo/components/BlogPostListPage.js
index d5c3d84c..c96b9cdd 100644
--- a/themes/hexo/components/BlogPostListPage.js
+++ b/themes/hexo/components/BlogPostListPage.js
@@ -1,7 +1,8 @@
-import BlogPostCard from './BlogPostCard'
-import PaginationNumber from './PaginationNumber'
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import BlogPostCard from './BlogPostCard'
import BlogPostListEmpty from './BlogPostListEmpty'
+import PaginationNumber from './PaginationNumber'
/**
* 文章列表分页表格
@@ -12,20 +13,29 @@ import BlogPostListEmpty from './BlogPostListEmpty'
* @constructor
*/
const BlogPostListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
- const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
- const showPagination = postCount >= parseInt(siteConfig('POSTS_PER_PAGE'))
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ const totalPage = Math.ceil(postCount / POSTS_PER_PAGE)
+ const showPagination = postCount >= POSTS_PER_PAGE
if (!posts || posts.length === 0 || page > totalPage) {
return
} else {
return (
-
+
{/* 文章列表 */}
-
+
{posts?.map(post => (
-
+
))}
- {showPagination &&
}
+ {showPagination && (
+
+ )}
)
}
diff --git a/themes/hexo/components/BlogPostListScroll.js b/themes/hexo/components/BlogPostListScroll.js
index c92c0b55..b3f19036 100644
--- a/themes/hexo/components/BlogPostListScroll.js
+++ b/themes/hexo/components/BlogPostListScroll.js
@@ -1,10 +1,10 @@
import { siteConfig } from '@/lib/config'
-import BlogPostCard from './BlogPostCard'
-import BlogPostListEmpty from './BlogPostListEmpty'
import { useGlobal } from '@/lib/global'
+import { getListByPage } from '@/lib/utils'
import { useEffect, useRef, useState } from 'react'
import CONFIG from '../config'
-import { getListByPage } from '@/lib/utils'
+import BlogPostCard from './BlogPostCard'
+import BlogPostListEmpty from './BlogPostListEmpty'
/**
* 博客列表滚动分页
@@ -13,15 +13,21 @@ import { getListByPage } from '@/lib/utils'
* @returns {JSX.Element}
* @constructor
*/
-const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfig('HEXO_POST_LIST_SUMMARY', null, CONFIG), siteInfo }) => {
- const postsPerPage = parseInt(siteConfig('POSTS_PER_PAGE'))
+const BlogPostListScroll = ({
+ posts = [],
+ currentSearch,
+ showSummary = siteConfig('HEXO_POST_LIST_SUMMARY', null, CONFIG),
+ siteInfo
+}) => {
+ const { NOTION_CONFIG } = useGlobal()
const [page, updatePage] = useState(1)
- const postsToShow = getListByPage(posts, page, postsPerPage)
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ const postsToShow = getListByPage(posts, page, POSTS_PER_PAGE)
let hasMore = false
if (posts) {
const totalCount = posts.length
- hasMore = page * postsPerPage < totalCount
+ hasMore = page * POSTS_PER_PAGE < totalCount
}
const handleGetMore = () => {
@@ -33,7 +39,11 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfi
const scrollTrigger = () => {
requestAnimationFrame(() => {
const scrollS = window.scrollY + window.outerHeight
- const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
+ const clientHeight = targetRef
+ ? targetRef.current
+ ? targetRef.current.clientHeight
+ : 0
+ : 0
if (scrollS > clientHeight + 100) {
handleGetMore()
}
@@ -54,21 +64,32 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfi
if (!postsToShow || postsToShow.length === 0) {
return
} else {
- return
+ return (
+
+ {/* 文章列表 */}
+
+ {postsToShow.map(post => (
+
+ ))}
+
- {/* 文章列表 */}
-
- {postsToShow.map(post => (
-
- ))}
+
+
{
+ handleGetMore()
+ }}
+ className='w-full my-4 py-4 text-center cursor-pointer rounded-xl dark:text-gray-200'>
+ {' '}
+ {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE}`}{' '}
+
+
-
-
-
{ handleGetMore() }}
- className='w-full my-4 py-4 text-center cursor-pointer rounded-xl dark:text-gray-200'
- > {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE}`}
-
-
+ )
}
}
diff --git a/themes/matery/components/BlogPostListPage.js b/themes/matery/components/BlogPostListPage.js
index 05478669..8558d5e7 100644
--- a/themes/matery/components/BlogPostListPage.js
+++ b/themes/matery/components/BlogPostListPage.js
@@ -1,4 +1,5 @@
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
import BlogPostCard from './BlogPostCard'
import BlogPostListEmpty from './BlogPostListEmpty'
import PaginationSimple from './PaginationSimple'
@@ -12,10 +13,10 @@ import PaginationSimple from './PaginationSimple'
* @constructor
*/
const BlogPostListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
- const totalPage = Math.ceil(
- postCount / parseInt(siteConfig('POSTS_PER_PAGE'))
- )
- const showPagination = postCount >= parseInt(siteConfig('POSTS_PER_PAGE'))
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ const totalPage = Math.ceil(postCount / POSTS_PER_PAGE)
+ const showPagination = postCount >= POSTS_PER_PAGE
if (!posts || posts.length === 0 || page > totalPage) {
return
} else {
diff --git a/themes/matery/components/BlogPostListScroll.js b/themes/matery/components/BlogPostListScroll.js
index d7ce5ae4..8a91bf07 100644
--- a/themes/matery/components/BlogPostListScroll.js
+++ b/themes/matery/components/BlogPostListScroll.js
@@ -1,11 +1,11 @@
import { siteConfig } from '@/lib/config'
-import BlogPostCard from './BlogPostCard'
-import BlogPostListEmpty from './BlogPostListEmpty'
import { useGlobal } from '@/lib/global'
-import { useCallback, useEffect, useRef, useState } from 'react'
-import CONFIG from '../config'
import { getListByPage } from '@/lib/utils'
import throttle from 'lodash.throttle'
+import { useCallback, useEffect, useRef, useState } from 'react'
+import CONFIG from '../config'
+import BlogPostCard from './BlogPostCard'
+import BlogPostListEmpty from './BlogPostListEmpty'
/**
* 博客列表滚动分页
@@ -14,10 +14,16 @@ import throttle from 'lodash.throttle'
* @returns {JSX.Element}
* @constructor
*/
-const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfig('MATERY_POST_LIST_SUMMARY', null, CONFIG), siteInfo }) => {
- const postsPerPage = parseInt(siteConfig('POSTS_PER_PAGE'))
+const BlogPostListScroll = ({
+ posts = [],
+ currentSearch,
+ showSummary = siteConfig('MATERY_POST_LIST_SUMMARY', null, CONFIG),
+ siteInfo
+}) => {
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
const [page, updatePage] = useState(1)
- const postsToShow = getListByPage(posts, page, postsPerPage)
+ const postsToShow = getListByPage(posts, page, POSTS_PER_PAGE)
// 监听滚动
useEffect(() => {
window.addEventListener('scroll', scrollTrigger)
@@ -31,7 +37,7 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfi
let hasMore = false
if (posts) {
const totalCount = posts.length
- hasMore = page * postsPerPage < totalCount
+ hasMore = page * POSTS_PER_PAGE < totalCount
}
const handleGetMore = () => {
@@ -40,36 +46,52 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfi
}
const throttleMs = 200
- const scrollTrigger = useCallback(throttle(() => {
- requestAnimationFrame(() => {
- const scrollS = window.scrollY + window.outerHeight
- const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
- if (scrollS > clientHeight + 100) {
- handleGetMore()
- }
- })
- }, throttleMs))
+ const scrollTrigger = useCallback(
+ throttle(() => {
+ requestAnimationFrame(() => {
+ const scrollS = window.scrollY + window.outerHeight
+ const clientHeight = targetRef
+ ? targetRef.current
+ ? targetRef.current.clientHeight
+ : 0
+ : 0
+ if (scrollS > clientHeight + 100) {
+ handleGetMore()
+ }
+ })
+ }, throttleMs)
+ )
if (!postsToShow || postsToShow.length === 0) {
return
} else {
- return
-
- {/* 文章列表 */}
-
- {postsToShow.map(post => (
+ return (
+
+ {/* 文章列表 */}
+
+ {postsToShow.map(post => (
-
+
- ))}
-
+ ))}
+
-
-
{ handleGetMore() }}
- className='w-full my-4 py-4 text-center cursor-pointer rounded-xl dark:text-gray-200'
- > {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE}`}
+
+
{
+ handleGetMore()
+ }}
+ className='w-full my-4 py-4 text-center cursor-pointer rounded-xl dark:text-gray-200'>
+ {' '}
+ {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE}`}{' '}
+
+
-
+ )
}
}
diff --git a/themes/medium/components/BlogPostListPage.js b/themes/medium/components/BlogPostListPage.js
index 9b47bfb7..c8171c4b 100644
--- a/themes/medium/components/BlogPostListPage.js
+++ b/themes/medium/components/BlogPostListPage.js
@@ -1,5 +1,6 @@
-import BlogPostCard from './BlogPostCard'
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import BlogPostCard from './BlogPostCard'
import BlogPostListEmpty from './BlogPostListEmpty'
import PaginationSimple from './PaginationSimple'
@@ -12,22 +13,24 @@ import PaginationSimple from './PaginationSimple'
* @constructor
*/
const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
- const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ const totalPage = Math.ceil(postCount / POSTS_PER_PAGE)
if (!posts || posts.length === 0) {
return
}
return (
-
-
+
+
{/* 文章列表 */}
{posts?.map(post => (
))}
-
-
+
+
)
}
diff --git a/themes/medium/components/BlogPostListScroll.js b/themes/medium/components/BlogPostListScroll.js
index 5f554a0c..cf06a093 100644
--- a/themes/medium/components/BlogPostListScroll.js
+++ b/themes/medium/components/BlogPostListScroll.js
@@ -1,10 +1,10 @@
import { siteConfig } from '@/lib/config'
-import BlogPostCard from './BlogPostCard'
-import BlogPostListEmpty from './BlogPostListEmpty'
import { useGlobal } from '@/lib/global'
import throttle from 'lodash.throttle'
-import { useCallback, useEffect, useRef, useState } from 'react'
import { useRouter } from 'next/router'
+import { useCallback, useEffect, useRef, useState } from 'react'
+import BlogPostCard from './BlogPostCard'
+import BlogPostListEmpty from './BlogPostListEmpty'
/**
* 博客列表滚动分页
@@ -14,7 +14,8 @@ import { useRouter } from 'next/router'
* @constructor
*/
const BlogPostListScroll = ({ posts = [], currentSearch }) => {
- const postsPerPage = parseInt(siteConfig('POSTS_PER_PAGE'))
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
const [page, updatePage] = useState(1)
const router = useRouter()
let filteredPosts = Object.assign(posts)
@@ -26,12 +27,12 @@ const BlogPostListScroll = ({ posts = [], currentSearch }) => {
return searchContent.toLowerCase().includes(searchKey.toLowerCase())
})
}
- const postsToShow = getPostByPage(page, filteredPosts, postsPerPage)
+ const postsToShow = getPostByPage(page, filteredPosts, POSTS_PER_PAGE)
let hasMore = false
if (filteredPosts) {
const totalCount = filteredPosts.length
- hasMore = page * postsPerPage < totalCount
+ hasMore = page * POSTS_PER_PAGE < totalCount
}
const handleGetMore = () => {
@@ -40,13 +41,19 @@ const BlogPostListScroll = ({ posts = [], currentSearch }) => {
}
// 监听滚动自动分页加载
- const scrollTrigger = useCallback(throttle(() => {
- const scrollS = window.scrollY + window.outerHeight
- const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
- if (scrollS > clientHeight + 100) {
- handleGetMore()
- }
- }, 500))
+ const scrollTrigger = useCallback(
+ throttle(() => {
+ const scrollS = window.scrollY + window.outerHeight
+ const clientHeight = targetRef
+ ? targetRef.current
+ ? targetRef.current.clientHeight
+ : 0
+ : 0
+ if (scrollS > clientHeight + 100) {
+ handleGetMore()
+ }
+ }, 500)
+ )
// 监听滚动
useEffect(() => {
@@ -62,23 +69,27 @@ const BlogPostListScroll = ({ posts = [], currentSearch }) => {
if (!postsToShow || postsToShow.length === 0) {
return
} else {
- return
+ return (
+
+ {/* 文章列表 */}
+
+ {postsToShow?.map(post => (
+
+ ))}
+
- {/* 文章列表 */}
-
- {postsToShow?.map(post => (
-
- ))}
+
+
{
+ handleGetMore()
+ }}
+ className='w-full my-4 py-4 text-center cursor-pointer dark:text-gray-200'>
+ {' '}
+ {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
+
+
-
-
-
{
- handleGetMore()
- }}
- className='w-full my-4 py-4 text-center cursor-pointer dark:text-gray-200'
- > {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}
-
-
+ )
}
}
@@ -86,14 +97,11 @@ const BlogPostListScroll = ({ posts = [], currentSearch }) => {
* 获取从第1页到指定页码的文章
* @param page 第几页
* @param totalPosts 所有文章
- * @param postsPerPage 每页文章数量
+ * @param POSTS_PER_PAGE 每页文章数量
* @returns {*}
*/
-const getPostByPage = function (page, totalPosts, postsPerPage) {
- return totalPosts.slice(
- 0,
- postsPerPage * page
- )
+const getPostByPage = function (page, totalPosts, POSTS_PER_PAGE) {
+ return totalPosts.slice(0, POSTS_PER_PAGE * page)
}
export default BlogPostListScroll
diff --git a/themes/movie/components/BlogListPage.js b/themes/movie/components/BlogListPage.js
index 648f2ee2..9ba62844 100644
--- a/themes/movie/components/BlogListPage.js
+++ b/themes/movie/components/BlogListPage.js
@@ -1,11 +1,14 @@
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
import CONFIG from '../config'
import BlogPostCard from './BlogPostCard'
import PaginationNumber from './PaginationNumber'
export const BlogListPage = props => {
const { page = 1, posts, postCount } = props
- const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ const totalPage = Math.ceil(postCount / POSTS_PER_PAGE)
const showPageCover = siteConfig('MOVIE_POST_LIST_COVER', null, CONFIG)
diff --git a/themes/movie/components/BlogListScroll.js b/themes/movie/components/BlogListScroll.js
index 597ba7dc..aa1538c7 100644
--- a/themes/movie/components/BlogListScroll.js
+++ b/themes/movie/components/BlogListScroll.js
@@ -12,11 +12,18 @@ export const BlogListScroll = props => {
const [page, updatePage] = useState(1)
let hasMore = false
- const postsToShow = posts ? Object.assign(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page) : []
+ const postsToShow = posts
+ ? Object.assign(posts).slice(
+ 0,
+ parseInt(siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)) * page
+ )
+ : []
if (posts) {
const totalCount = posts.length
- hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
+ hasMore =
+ page * parseInt(siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)) <
+ totalCount
}
const handleGetMore = () => {
if (!hasMore) return
@@ -29,7 +36,11 @@ export const BlogListScroll = props => {
const scrollTrigger = useCallback(
throttle(() => {
const scrollS = window.scrollY + window.outerHeight
- const clientHeight = targetRef ? (targetRef.current ? targetRef.current.clientHeight : 0) : 0
+ const clientHeight = targetRef
+ ? targetRef.current
+ ? targetRef.current.clientHeight
+ : 0
+ : 0
if (scrollS > clientHeight + 100) {
handleGetMore()
}
@@ -46,12 +57,17 @@ export const BlogListScroll = props => {
})
return (
-
+
{postsToShow?.map(post => (
))}
-
+
{' '}
{hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
diff --git a/themes/nav/components/BlogPostListPage.js b/themes/nav/components/BlogPostListPage.js
index 50936015..4594f3b8 100755
--- a/themes/nav/components/BlogPostListPage.js
+++ b/themes/nav/components/BlogPostListPage.js
@@ -1,3 +1,4 @@
+import { siteConfig } from '@/lib/config'
import BlogPostCard from './BlogPostCard'
import NavPostListEmpty from './NavPostListEmpty'
import PaginationSimple from './PaginationSimple'
@@ -11,22 +12,24 @@ import PaginationSimple from './PaginationSimple'
* @constructor
*/
const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
- const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
+ const totalPage = Math.ceil(
+ postCount / parseInt(siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG))
+ )
if (!posts || posts.length === 0) {
return
}
return (
-
-
+
+
{/* 文章列表 */}
{posts?.map(post => (
))}
-
-
+
+
)
}
diff --git a/themes/nav/config.js b/themes/nav/config.js
index 910a59ac..7e8a6d72 100755
--- a/themes/nav/config.js
+++ b/themes/nav/config.js
@@ -1,8 +1,7 @@
const CONFIG = {
-
NAV_INDEX_PAGE: 'about', // 文档首页显示的文章,请确此路径包含在您的notion数据库中
- NAV_AUTO_SORT: process.env.NEXT_PUBLIC_GITBOOK_AUTO_SORT || true, // 是否自动按分类名 归组排序文章;自动归组可能会打乱您Notion中的文章顺序
+ NAV_AUTO_SORT: process.env.NEXT_PUBLIC_NAV_AUTO_SORT || true, // 是否自动按分类名 归组排序文章;自动归组可能会打乱您Notion中的文章顺序
NAV_SHOW_TITLE_TEXT: false, // 标题栏显示文本
NAV_USE_CUSTOM_MENU: true, // 使用自定义菜单(可支持子菜单,支持自定义分类图标),若为true则显示所有的category分类
@@ -14,7 +13,8 @@ const CONFIG = {
NAV_MENU_SEARCH: true, // 显示搜索
// Widget
- NAV_WIDGET_REVOLVER_MAPS: process.env.NEXT_PUBLIC_WIDGET_REVOLVER_MAPS || 'false', // 地图插件
+ NAV_WIDGET_REVOLVER_MAPS:
+ process.env.NEXT_PUBLIC_WIDGET_REVOLVER_MAPS || 'false', // 地图插件
NAV_WIDGET_TO_TOP: true // 跳回顶部
}
export default CONFIG
diff --git a/themes/next/components/BlogPostListPage.js b/themes/next/components/BlogPostListPage.js
index 5da3f160..c74fbbb2 100644
--- a/themes/next/components/BlogPostListPage.js
+++ b/themes/next/components/BlogPostListPage.js
@@ -1,7 +1,8 @@
-import BlogPostCard from './BlogPostCard'
-import PaginationNumber from './PaginationNumber'
-import BlogPostListEmpty from './BlogPostListEmpty'
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import BlogPostCard from './BlogPostCard'
+import BlogPostListEmpty from './BlogPostListEmpty'
+import PaginationNumber from './PaginationNumber'
/**
* 文章列表分页表格
@@ -12,7 +13,9 @@ import { siteConfig } from '@/lib/config'
* @constructor
*/
const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
- const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ const totalPage = Math.ceil(postCount / POSTS_PER_PAGE)
if (!posts || posts.length === 0) {
return
@@ -20,7 +23,9 @@ const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
return (
{/* 文章列表 */}
-
+
{posts?.map((post, index) => (
))}
diff --git a/themes/next/components/BlogPostListScroll.js b/themes/next/components/BlogPostListScroll.js
index 64f42d0e..1003d2b0 100644
--- a/themes/next/components/BlogPostListScroll.js
+++ b/themes/next/components/BlogPostListScroll.js
@@ -1,10 +1,10 @@
-import BlogPostCard from './BlogPostCard'
-import BlogPostListEmpty from './BlogPostListEmpty'
+import { siteConfig } from '@/lib/config'
import { useGlobal } from '@/lib/global'
import throttle from 'lodash.throttle'
import { useCallback, useEffect, useRef, useState } from 'react'
import CONFIG from '../config'
-import { siteConfig } from '@/lib/config'
+import BlogPostCard from './BlogPostCard'
+import BlogPostListEmpty from './BlogPostListEmpty'
/**
* 博客列表滚动分页
@@ -13,15 +13,20 @@ import { siteConfig } from '@/lib/config'
* @returns {JSX.Element}
* @constructor
*/
-const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfig('NEXT_POST_LIST_SUMMARY', null, CONFIG) }) => {
- const postsPerPage = parseInt(siteConfig('POSTS_PER_PAGE'))
+const BlogPostListScroll = ({
+ posts = [],
+ currentSearch,
+ showSummary = siteConfig('NEXT_POST_LIST_SUMMARY', null, CONFIG)
+}) => {
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
const [page, updatePage] = useState(1)
- const postsToShow = getPostByPage(page, posts, postsPerPage)
+ const postsToShow = getPostByPage(page, posts, POSTS_PER_PAGE)
let hasMore = false
if (posts) {
const totalCount = posts.length
- hasMore = page * postsPerPage < totalCount
+ hasMore = page * POSTS_PER_PAGE < totalCount
}
const handleGetMore = () => {
@@ -30,13 +35,19 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfi
}
// 监听滚动自动分页加载
- const scrollTrigger = useCallback(throttle(() => {
- const scrollS = window.scrollY + window.outerHeight
- const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
- if (scrollS > clientHeight + 100) {
- handleGetMore()
- }
- }, 500))
+ const scrollTrigger = useCallback(
+ throttle(() => {
+ const scrollS = window.scrollY + window.outerHeight
+ const clientHeight = targetRef
+ ? targetRef.current
+ ? targetRef.current.clientHeight
+ : 0
+ : 0
+ if (scrollS > clientHeight + 100) {
+ handleGetMore()
+ }
+ }, 500)
+ )
// 监听滚动
useEffect(() => {
@@ -52,23 +63,29 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfi
if (!postsToShow || postsToShow.length === 0) {
return
} else {
- return
+ return (
+
+ {/* 文章列表 */}
+
+ {postsToShow.map(post => (
+
+ ))}
+
- {/* 文章列表 */}
-
- {postsToShow.map(post => (
-
- ))}
+
+
{
+ handleGetMore()
+ }}
+ className='w-full my-4 py-4 text-center cursor-pointer glassmorphism shadow hover:shadow-xl duration-200 dark:text-gray-200'>
+ {' '}
+ {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
+
+
-
-
-
{
- handleGetMore()
- }}
- className='w-full my-4 py-4 text-center cursor-pointer glassmorphism shadow hover:shadow-xl duration-200 dark:text-gray-200'
- > {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}
-
-
+ )
}
}
@@ -76,13 +93,10 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = siteConfi
* 获取从第1页到指定页码的文章
* @param page 第几页
* @param totalPosts 所有文章
- * @param postsPerPage 每页文章数量
+ * @param POSTS_PER_PAGE 每页文章数量
* @returns {*}
*/
-const getPostByPage = function (page, totalPosts, postsPerPage) {
- return totalPosts.slice(
- 0,
- postsPerPage * page
- )
+const getPostByPage = function (page, totalPosts, POSTS_PER_PAGE) {
+ return totalPosts.slice(0, POSTS_PER_PAGE * page)
}
export default BlogPostListScroll
diff --git a/themes/nobelium/components/BlogListPage.js b/themes/nobelium/components/BlogListPage.js
index 46db49fa..0c313ba4 100644
--- a/themes/nobelium/components/BlogListPage.js
+++ b/themes/nobelium/components/BlogListPage.js
@@ -1,50 +1,58 @@
-
import { siteConfig } from '@/lib/config'
import { useGlobal } from '@/lib/global'
-import { useRouter } from 'next/router'
import Link from 'next/link'
+import { useRouter } from 'next/router'
import BlogPost from './BlogPost'
export const BlogListPage = props => {
const { page = 1, posts, postCount } = props
const { locale } = useGlobal()
const router = useRouter()
- const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ const totalPage = Math.ceil(postCount / POSTS_PER_PAGE)
const currentPage = +page
const showPrev = currentPage > 1
const showNext = currentPage < totalPage && posts?.length > 0
- const pagePrefix = router.asPath.split('?')[0].replace(/\/page\/[1-9]\d*/, '').replace(/\/$/, '')
+ const pagePrefix = router.asPath
+ .split('?')[0]
+ .replace(/\/page\/[1-9]\d*/, '')
+ .replace(/\/$/, '')
return (
-
+
+
+ {posts?.map(post => (
+
+ ))}
+
-
- {posts?.map(post => (
-
- ))}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
)
}
diff --git a/themes/nobelium/components/BlogListScroll.js b/themes/nobelium/components/BlogListScroll.js
index 42a1f440..73bdaba6 100644
--- a/themes/nobelium/components/BlogListScroll.js
+++ b/themes/nobelium/components/BlogListScroll.js
@@ -1,8 +1,8 @@
-import { useGlobal } from '@/lib/global'
-import Link from 'next/link'
-import throttle from 'lodash.throttle'
-import { deepClone } from '@/lib/utils'
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import { deepClone } from '@/lib/utils'
+import throttle from 'lodash.throttle'
+import Link from 'next/link'
import { useCallback, useEffect, useRef, useState } from 'react'
export const BlogListScroll = props => {
@@ -12,13 +12,20 @@ export const BlogListScroll = props => {
const [page, updatePage] = useState(1)
let hasMore = false
- const postsToShow = posts && Array.isArray(posts)
- ? deepClone(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page)
- : []
+ const postsToShow =
+ posts && Array.isArray(posts)
+ ? deepClone(posts).slice(
+ 0,
+ parseInt(siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)) *
+ page
+ )
+ : []
if (posts) {
const totalCount = posts.length
- hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
+ hasMore =
+ page * parseInt(siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)) <
+ totalCount
}
const handleGetMore = () => {
if (!hasMore) return
@@ -28,13 +35,19 @@ export const BlogListScroll = props => {
const targetRef = useRef(null)
// 监听滚动自动分页加载
- const scrollTrigger = useCallback(throttle(() => {
- const scrollS = window.scrollY + window.outerHeight
- const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
- if (scrollS > clientHeight + 100) {
- handleGetMore()
- }
- }, 500))
+ const scrollTrigger = useCallback(
+ throttle(() => {
+ const scrollS = window.scrollY + window.outerHeight
+ const clientHeight = targetRef
+ ? targetRef.current
+ ? targetRef.current.clientHeight
+ : 0
+ : 0
+ if (scrollS > clientHeight + 100) {
+ handleGetMore()
+ }
+ }, 500)
+ )
useEffect(() => {
window.addEventListener('scroll', scrollTrigger)
@@ -45,39 +58,41 @@ export const BlogListScroll = props => {
})
return (
-
- {postsToShow.map(p => (
-
-
-
- {p.title}
-
-
-
-
-
-
- {p.summary}
-
-
- ))}
-
-
- {' '}
- {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
-
+
+ {postsToShow.map(p => (
+
+
+
+ {p.title}
+
+
+
+
+ {p.summary}
+
+ ))}
+
+
+ {' '}
+ {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
+
+
)
}
diff --git a/themes/nobelium/components/BlogPost.js b/themes/nobelium/components/BlogPost.js
index 0131dc62..51354bd8 100644
--- a/themes/nobelium/components/BlogPost.js
+++ b/themes/nobelium/components/BlogPost.js
@@ -1,10 +1,13 @@
import NotionIcon from '@/components/NotionIcon'
import NotionPage from '@/components/NotionPage'
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
import Link from 'next/link'
const BlogPost = ({ post }) => {
- const showPreview = siteConfig('POST_LIST_PREVIEW') && post.blockMap
+ const { NOTION_CONFIG } = useGlobal()
+ const showPreview =
+ siteConfig('POST_LIST_PREVIEW', false, NOTION_CONFIG) && post?.blockMap
return (
diff --git a/themes/plog/components/BlogListPage.js b/themes/plog/components/BlogListPage.js
index 488fd188..68790295 100644
--- a/themes/plog/components/BlogListPage.js
+++ b/themes/plog/components/BlogListPage.js
@@ -1,34 +1,41 @@
-
-import { useGlobal } from '@/lib/global'
-import { useRouter } from 'next/router'
-import Link from 'next/link'
-import BlogPost from './BlogPost'
-import { useEffect, useRef } from 'react'
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import Link from 'next/link'
+import { useRouter } from 'next/router'
+import { useEffect, useRef } from 'react'
+import BlogPost from './BlogPost'
export const BlogListPage = props => {
const { page = 1, posts, postCount } = props
const { locale } = useGlobal()
const router = useRouter()
- const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
+ const { NOTION_CONFIG } = useGlobal()
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
+ const totalPage = Math.ceil(postCount / POSTS_PER_PAGE)
const currentPage = +page
const showPrev = currentPage > 1
const showNext = page < totalPage
- const pagePrefix = router.asPath.split('?')[0].replace(/\/page\/[1-9]\d*/, '').replace(/\/$/, '')
+ const pagePrefix = router.asPath
+ .split('?')[0]
+ .replace(/\/page\/[1-9]\d*/, '')
+ .replace(/\/$/, '')
const blogPostRefs = useRef([])
useEffect(() => {
- const observer = new IntersectionObserver(entries => {
- entries.forEach(entry => {
- if (entry.isIntersecting) {
- entry.target.classList.toggle('visible')
- }
- })
- }, {
- threshold: 0.1 // 调整阈值以达到最佳效果
- })
+ const observer = new IntersectionObserver(
+ entries => {
+ entries.forEach(entry => {
+ if (entry.isIntersecting) {
+ entry.target.classList.toggle('visible')
+ }
+ })
+ },
+ {
+ threshold: 0.1 // 调整阈值以达到最佳效果
+ }
+ )
blogPostRefs.current.forEach(ref => {
observer.observe(ref)
@@ -39,34 +46,47 @@ export const BlogListPage = props => {
}
}, [])
return (
-
+
+
+ {posts?.map((post, index) => (
+ blogPostRefs.current.push(el)}
+ />
+ ))}
+
-
- {posts?.map((post, index) => (
- blogPostRefs.current.push(el)}/>
- ))}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
)
}
diff --git a/themes/plog/components/BlogListScroll.js b/themes/plog/components/BlogListScroll.js
index 8e71d14a..6410338d 100644
--- a/themes/plog/components/BlogListScroll.js
+++ b/themes/plog/components/BlogListScroll.js
@@ -1,8 +1,8 @@
+import { siteConfig } from '@/lib/config'
import { useGlobal } from '@/lib/global'
+import throttle from 'lodash.throttle'
import Link from 'next/link'
import { useCallback, useEffect, useRef, useState } from 'react'
-import throttle from 'lodash.throttle'
-import { siteConfig } from '@/lib/config'
export const BlogListScroll = props => {
const { posts } = props
@@ -12,12 +12,17 @@ export const BlogListScroll = props => {
let hasMore = false
const postsToShow = posts
- ? Object.assign(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page)
+ ? Object.assign(posts).slice(
+ 0,
+ parseInt(siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)) * page
+ )
: []
if (posts) {
const totalCount = posts.length
- hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
+ hasMore =
+ page * parseInt(siteConfig('POSTS_PER_PAGE', 12, props?.NOTION_CONFIG)) <
+ totalCount
}
const handleGetMore = () => {
if (!hasMore) return
@@ -27,13 +32,19 @@ export const BlogListScroll = props => {
const targetRef = useRef(null)
// 监听滚动自动分页加载
- const scrollTrigger = useCallback(throttle(() => {
- const scrollS = window.scrollY + window.outerHeight
- const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
- if (scrollS > clientHeight + 100) {
- handleGetMore()
- }
- }, 500))
+ const scrollTrigger = useCallback(
+ throttle(() => {
+ const scrollS = window.scrollY + window.outerHeight
+ const clientHeight = targetRef
+ ? targetRef.current
+ ? targetRef.current.clientHeight
+ : 0
+ : 0
+ if (scrollS > clientHeight + 100) {
+ handleGetMore()
+ }
+ }, 500)
+ )
useEffect(() => {
window.addEventListener('scroll', scrollTrigger)
@@ -44,39 +55,41 @@ export const BlogListScroll = props => {
})
return (
-
- {postsToShow.map(p => (
-
-
-
- {p.title}
-
-
-
-
-
-
- {p.summary}
-
-
- ))}
-
-
- {' '}
- {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
-
+
+ {postsToShow.map(p => (
+
+
+
+ {p.title}
+
+
+
+
+ {p.summary}
+
+ ))}
+
+
+ {' '}
+ {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
+
+
)
}
diff --git a/themes/simple/components/BlogItem.js b/themes/simple/components/BlogItem.js
index fe24c21a..b5b897d8 100644
--- a/themes/simple/components/BlogItem.js
+++ b/themes/simple/components/BlogItem.js
@@ -3,14 +3,17 @@ import NotionIcon from '@/components/NotionIcon'
import NotionPage from '@/components/NotionPage'
import TwikooCommentCount from '@/components/TwikooCommentCount'
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
import { formatDateFmt } from '@/lib/utils/formatDate'
import Link from 'next/link'
import CONFIG from '../config'
export const BlogItem = props => {
const { post } = props
+ const { NOTION_CONFIG } = useGlobal()
const showPageCover = siteConfig('SIMPLE_POST_COVER_ENABLE', false, CONFIG)
- const showPreview = siteConfig('POST_LIST_PREVIEW') && post.blockMap
+ const showPreview =
+ siteConfig('POST_LIST_PREVIEW', false, NOTION_CONFIG) && post.blockMap
return (
1
const showNext = page < totalPage
- const pagePrefix = router.asPath.split('?')[0].replace(/\/page\/[1-9]\d*/, '').replace(/\/$/, '')
+ const pagePrefix = router.asPath
+ .split('?')[0]
+ .replace(/\/page\/[1-9]\d*/, '')
+ .replace(/\/$/, '')
return (
-
+
+
+ {posts?.map((p, index) => (
+
+ {SIMPLE_POST_AD_ENABLE && (index + 1) % 3 === 0 && (
+
+ )}
+ {SIMPLE_POST_AD_ENABLE && index + 1 === 4 &&
}
+
+
+ ))}
+
-
- {posts?.map((p, index) => (
- {SIMPLE_POST_AD_ENABLE && (index + 1) % 3 === 0 &&
}
- {SIMPLE_POST_AD_ENABLE && (index + 1) === 4 &&
}
-
-
))}
-
-
-
-
-
- NEWER POSTS
-
-
- OLDER POSTS
-
-
-
+
+
+ NEWER POSTS
+
+
+ OLDER POSTS
+
+
+
)
}
diff --git a/themes/simple/components/BlogListScroll.js b/themes/simple/components/BlogListScroll.js
index d68745f3..a1af6c77 100644
--- a/themes/simple/components/BlogListScroll.js
+++ b/themes/simple/components/BlogListScroll.js
@@ -1,28 +1,27 @@
-import { useGlobal } from '@/lib/global'
-import { useCallback, useEffect, useRef, useState } from 'react'
-import throttle from 'lodash.throttle'
-import { BlogItem } from './BlogItem'
import { siteConfig } from '@/lib/config'
+import { useGlobal } from '@/lib/global'
+import throttle from 'lodash.throttle'
+import { useCallback, useEffect, useRef, useState } from 'react'
+import { BlogItem } from './BlogItem'
/**
* 滚动博客列表
* @param {*} props
* @returns
*/
-export default function BlogListScroll (props) {
+export default function BlogListScroll(props) {
const { posts } = props
- const { locale } = useGlobal()
-
+ const { locale, NOTION_CONFIG } = useGlobal()
const [page, updatePage] = useState(1)
-
+ const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', 12, NOTION_CONFIG)
let hasMore = false
const postsToShow = posts
- ? Object.assign(posts).slice(0, parseInt(siteConfig('POSTS_PER_PAGE')) * page)
+ ? Object.assign(posts).slice(0, POSTS_PER_PAGE * page)
: []
if (posts) {
const totalCount = posts.length
- hasMore = page * parseInt(siteConfig('POSTS_PER_PAGE')) < totalCount
+ hasMore = page * POSTS_PER_PAGE < totalCount
}
const handleGetMore = () => {
if (!hasMore) return
@@ -32,13 +31,19 @@ export default function BlogListScroll (props) {
const targetRef = useRef(null)
// 监听滚动自动分页加载
- const scrollTrigger = useCallback(throttle(() => {
- const scrollS = window.scrollY + window.outerHeight
- const clientHeight = targetRef ? (targetRef.current ? (targetRef.current.clientHeight) : 0) : 0
- if (scrollS > clientHeight + 100) {
- handleGetMore()
- }
- }, 500))
+ const scrollTrigger = useCallback(
+ throttle(() => {
+ const scrollS = window.scrollY + window.outerHeight
+ const clientHeight = targetRef
+ ? targetRef.current
+ ? targetRef.current.clientHeight
+ : 0
+ : 0
+ if (scrollS > clientHeight + 100) {
+ handleGetMore()
+ }
+ }, 500)
+ )
useEffect(() => {
window.addEventListener('scroll', scrollTrigger)
@@ -49,17 +54,17 @@ export default function BlogListScroll (props) {
})
return (
-
- {postsToShow.map(p => (
-
- ))}
+
+ {postsToShow.map(p => (
+
+ ))}
-
- {' '}
- {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
-
-
-
+
+ {' '}
+ {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
+
+
)
}