This commit is contained in:
tangly1024.com
2023-02-03 15:03:22 +08:00
44 changed files with 129 additions and 126 deletions

View File

@@ -1,2 +1,2 @@
# 环境变量 @see https://www.nextjs.cn/docs/basic-features/environment-variables
NEXT_PUBLIC_VERSION=3.9.1
NEXT_PUBLIC_VERSION=3.9.2

View File

@@ -136,6 +136,7 @@ function createFlutteringRibbon() {
(this._canvas.style.width = '100%'),
(this._canvas.style.height = '100%'),
(this._canvas.style['z-index'] = '0'),
(this._canvas.style['pointer-events'] = 'none'),
this._onResize(),
(this._context = this._canvas.getContext('2d')),
this._context.clearRect(0, 0, this._width, this._height),

View File

@@ -27,11 +27,15 @@ export async function getGlobalNotionData({
// 获取Notion数据
const notionPageData = deepClone(await getNotionPageData({ pageId, from }))
delete notionPageData.block
delete notionPageData.collection
delete notionPageData.collectionQuery
delete notionPageData.schema
delete notionPageData.rawMetadata
delete notionPageData.pageIds
delete notionPageData.viewIds
delete notionPageData.collection
delete notionPageData.collectionQuery
delete notionPageData.collectionId
delete notionPageData.collectionView
console.log(notionPageData)
return notionPageData
}
@@ -192,12 +196,10 @@ async function getPageRecordMapByNotionAPI({ pageId, from }) {
const collectionQuery = pageRecordMap.collection_query
const collectionView = pageRecordMap.collection_view
const schema = collection?.schema
const tagOptions = getTagOptions(schema)
const categoryOptions = getCategoryOptions(schema)
const viewIds = rawMetadata?.view_ids
const collectionData = []
const pageIds = getAllPageIds(collectionQuery, collectionId, collectionView, viewIds)
const siteInfo = getBlogInfo({ collection, block })
if (pageIds?.length === 0) {
console.error('获取到的文章列表为空请检查notion模板', collectionQuery, collection, collectionView, viewIds, pageRecordMap)
}
@@ -207,15 +209,12 @@ async function getPageRecordMapByNotionAPI({ pageId, from }) {
if (!value) {
continue
}
const properties = (await getPageProperties(id, block, schema, null, tagOptions, siteInfo)) || null
const properties = (await getPageProperties(id, block, schema, null, getTagOptions(schema))) || null
if (properties) {
collectionData.push(properties)
}
}
// 获取page作为自定义菜单
const customNav = getCustomNav({ allPages: collectionData.filter(post => post.type === 'Page' && post.status === 'Published') })
// 文章计数
let postCount = 0
const allPages = collectionData.filter(post => {
@@ -238,8 +237,10 @@ async function getPageRecordMapByNotionAPI({ pageId, from }) {
})
}
const categories = getAllCategories({ allPages, categoryOptions, sliceCount: BLOG.PREVIEW_CATEGORY_COUNT })
const tags = getAllTags({ allPages, sliceCount: BLOG.PREVIEW_TAG_COUNT, tagOptions })
const categoryOptions = getAllCategories({ allPages, categoryOptions: getCategoryOptions(schema), sliceCount: BLOG.PREVIEW_CATEGORY_COUNT })
const tagOptions = getAllTags({ allPages, sliceCount: BLOG.PREVIEW_TAG_COUNT, tagOptions: getTagOptions(schema) })
const siteInfo = getBlogInfo({ collection, block })
const customNav = getCustomNav({ allPages: collectionData.filter(post => post.type === 'Page' && post.status === 'Published') })
const latestPosts = getLatestPosts({ allPages, from, latestPostCount: 5 })
return {
@@ -258,8 +259,6 @@ async function getPageRecordMapByNotionAPI({ pageId, from }) {
customNav,
postCount,
pageIds,
categories,
tags,
latestPosts
}
}

View File

@@ -6,7 +6,7 @@ import { defaultMapImageUrl } from 'react-notion-x'
// import { createHash } from 'crypto'
import md5 from 'js-md5'
export default async function getPageProperties(id, block, schema, authToken, tagOptions, siteInfo) {
export default async function getPageProperties(id, block, schema, authToken, tagOptions) {
const rawProperties = Object.entries(block?.[id]?.value?.properties || [])
const excludeProperties = ['date', 'select', 'multi_select', 'person']
const value = block[id]?.value
@@ -89,7 +89,7 @@ export default async function getPageProperties(id, block, schema, authToken, ta
properties.lastEditedTime = formatDate(new Date(value?.last_edited_time).toString(), BLOG.LANG)
properties.fullWidth = value.format?.page_full_width ?? false
properties.pageIcon = getImageUrl(block[id].value?.format?.page_icon, block[id].value) ?? ''
properties.page_cover = getImageUrl(block[id].value?.format?.page_cover, block[id].value) ?? siteInfo?.pageCover
properties.page_cover = getImageUrl(block[id].value?.format?.page_cover, block[id].value) ?? ''
properties.content = value.content ?? []
properties.password = properties.password
? md5(properties.slug + properties.password)

View File

@@ -1,6 +1,6 @@
{
"name": "notion-next",
"version": "3.9.1",
"version": "3.9.2",
"homepage": "https://github.com/tangly1024/NotionNext.git",
"license": "MIT",
"repository": {

View File

@@ -58,10 +58,10 @@ export async function getStaticProps({ params: { category } }) {
export async function getStaticPaths() {
const from = 'category-paths'
const { categories } = await getGlobalNotionData({ from })
const { categoryOptions } = await getGlobalNotionData({ from })
return {
paths: Object.keys(categories).map(category => ({
params: { category: categories[category]?.name }
paths: Object.keys(categoryOptions).map(category => ({
params: { category: categoryOptions[category]?.name }
})),
fallback: true
}

View File

@@ -53,10 +53,10 @@ export async function getStaticProps({ params: { category, page } }) {
export async function getStaticPaths() {
const from = 'category-paths'
const { categories, allPages } = await getGlobalNotionData({ from })
const { categoryOptions, allPages } = await getGlobalNotionData({ from })
const paths = []
categories?.forEach(category => {
categoryOptions?.forEach(category => {
// 过滤状态类型
const categoryPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published').filter(post => post && post.category && post.category.includes(category.name))
// 处理文章页数

View File

@@ -2,7 +2,6 @@ import { getGlobalNotionData } from '@/lib/notion/getNotionData'
import React from 'react'
import { useGlobal } from '@/lib/global'
import * as ThemeMap from '@/themes'
import { getAllCategories } from '@/lib/notion/getAllCategories'
import BLOG from '@/blog.config'
/**
@@ -27,8 +26,6 @@ export default function Category(props) {
export async function getStaticProps() {
const props = await getGlobalNotionData({ from: 'category-index-props' })
props.categories = getAllCategories({ allPages: props.allPages, categoryOptions: props.categoryOptions, sliceCount: 0 })
delete props.categoryOptions
delete props.allPages
return {
props,

View File

@@ -63,8 +63,8 @@ function getTagNames(tags) {
export async function getStaticPaths() {
const from = 'tag-static-path'
const { tags } = await getGlobalNotionData({ from })
const tagNames = getTagNames(tags)
const { tagOptions } = await getGlobalNotionData({ from })
const tagNames = getTagNames(tagOptions)
return {
paths: Object.keys(tagNames).map(index => ({

View File

@@ -44,9 +44,9 @@ export async function getStaticProps({ params: { tag, page } }) {
export async function getStaticPaths() {
const from = 'tag-page-static-path'
const { tags, allPages } = await getGlobalNotionData({ from })
const { tagOptions, allPages } = await getGlobalNotionData({ from })
const paths = []
tags?.forEach(tag => {
tagOptions?.forEach(tag => {
// 过滤状态类型
const tagPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published').filter(post => post && post.tags && post.tags.includes(tag.name))
// 处理文章页数

View File

@@ -2,7 +2,6 @@ import { getGlobalNotionData } from '@/lib/notion/getNotionData'
import React from 'react'
import { useGlobal } from '@/lib/global'
import * as ThemeMap from '@/themes'
import { getAllTags } from '@/lib/notion'
import BLOG from '@/blog.config'
/**
@@ -28,8 +27,6 @@ const TagIndex = props => {
export async function getStaticProps() {
const from = 'tag-index-props'
const props = await getGlobalNotionData({ from })
props.tags = getAllTags({ allPages: props.allPages, sliceCount: 0, tagOptions: props.tagOptions })
delete props.tagOptions
delete props.allPages
return {
props,

View File

@@ -1,13 +1,12 @@
import Link from 'next/link'
import LayoutBase from './LayoutBase'
export const LayoutCategoryIndex = (props) => {
const { categories } = props
export const LayoutCategoryIndex = props => {
const { categoryOptions } = props
return (
<LayoutBase {...props}>
<div id='category-list' className='duration-200 flex flex-wrap'>
{categories && categories.map(category => {
{categoryOptions?.map(category => {
return (
<Link
key={category.name}

View File

@@ -2,12 +2,12 @@ import Link from 'next/link'
import LayoutBase from './LayoutBase'
export const LayoutTagIndex = (props) => {
const { tags } = props
const { tagOptions } = props
return (
<LayoutBase {...props}>
<div>
<div id='tags-list' className='duration-200 flex flex-wrap'>
{tags.map(tag => {
{tagOptions.map(tag => {
return (
<div key={tag.name} className='p-2'>
<Link
@@ -21,9 +21,9 @@ export const LayoutTagIndex = (props) => {
</Link>
</div>
);
)
})}
</div>
</div> </LayoutBase>
);
)
}

View File

@@ -15,6 +15,7 @@ export const BlogListPage = props => {
const showNext = page < totalPage
const pagePrefix = router.asPath.replace(/\/page\/[1-9]\d*/, '').replace(/\/$/, '')
console.log('p', posts)
return (
<div className="w-full md:pr-12 mb-12">
@@ -32,7 +33,7 @@ export const BlogListPage = props => {
<div className="mb-4 text-sm text-gray-700 dark:text-gray-300">
by <a href="#" className="text-gray-700 dark:text-gray-300">{BLOG.AUTHOR}</a> on {p.date?.start_date || p.createdTime}
<span className="font-bold mx-1"> | </span>
<a href="#" className="text-gray-700 dark:text-gray-300">{p.category}</a>
<a href={`/category${p.category}`} className="text-gray-700 dark:text-gray-300 hover:underline">{p.category}</a>
{/* <span className="font-bold mx-1"> | </span> */}
{/* <a href="#" className="text-gray-700">2 Comments</a> */}
</div>
@@ -65,5 +66,5 @@ export const BlogListPage = props => {
</Link>
</div>
</div>
);
)
}

View File

@@ -7,7 +7,7 @@ const ExampleRecentComments = dynamic(() => import('./ExampleRecentComments'))
export const SideBar = (props) => {
const { locale } = useGlobal()
const { latestPosts, categories } = props
const { latestPosts, categoryOptions } = props
return (
<div className="w-full md:w-64 sticky top-8">
@@ -16,16 +16,16 @@ export const SideBar = (props) => {
<div className="p-4">
<ul className="list-reset leading-normal">
{categories?.map(category => {
{categoryOptions?.map(category => {
return (
<Link
key={category.name}
href={`/category/${category.name}`}
passHref
legacyBehavior>
<li> <a href="#" className="text-gray-darkest text-sm">{category.name}({category.count})</a></li>
<li> <a href={`/category/${category.name}`} className="text-gray-darkest text-sm">{category.name}({category.count})</a></li>
</Link>
);
)
})}
</ul>
</div>
@@ -40,9 +40,9 @@ export const SideBar = (props) => {
{latestPosts?.map(p => {
return (
<Link key={p.id} href={`/${p.slug}`} passHref legacyBehavior>
<li> <a href="#" className="text-gray-darkest text-sm">{p.title}</a></li>
<li> <a href={`/${p.slug}`} className="text-gray-darkest text-sm">{p.title}</a></li>
</Link>
);
)
})}
</ul>
</div>
@@ -61,5 +61,5 @@ export const SideBar = (props) => {
</aside>
</div>
);
)
}

View File

@@ -4,7 +4,7 @@ import LayoutBase from './LayoutBase'
export const LayoutCategoryIndex = (props) => {
const { locale } = useGlobal()
const { categories } = props
const { categoryOptions } = props
return (
<LayoutBase {...props}>
<div className='bg-white dark:bg-gray-700 px-10 py-10 shadow'>
@@ -12,7 +12,7 @@ export const LayoutCategoryIndex = (props) => {
<i className='mr-4 fas fa-th' />{locale.COMMON.CATEGORY}:
</div>
<div id='category-list' className='duration-200 flex flex-wrap'>
{categories && categories.map(category => {
{categoryOptions?.map(category => {
return (
<Link
key={category.name}

View File

@@ -4,12 +4,12 @@ import LayoutBase from './LayoutBase'
export const LayoutTagIndex = (props) => {
const { locale } = useGlobal()
const { tags } = props
const { tagOptions } = props
return <LayoutBase {...props} >
<div className='bg-white dark:bg-gray-700 px-10 py-10 shadow'>
<div className='dark:text-gray-200 mb-5'><i className='mr-4 fas fa-tag'/>{locale.COMMON.TAGS}:</div>
<div id='tags-list' className='duration-200 flex flex-wrap'>
{ tags.map(tag => {
{ tagOptions.map(tag => {
return <div key={tag.name} className='p-2'><TagItem key={tag.name} tag={tag} /></div>
}) }
</div>

View File

@@ -9,9 +9,9 @@ import { useRouter } from 'next/router'
import DarkModeButton from '@/components/DarkModeButton'
function AsideLeft (props) {
const { tags, currentTag, categories, currentCategory, post, slot, siteInfo } = props
const { tagOptions, currentTag, categoryOptions, currentCategory, post, slot, siteInfo } = props
const router = useRouter()
return <div className='relative w-72 bg-white dark:bg-hexo-black-gray min-h-screen px-10 py-14 hidden lg:block relative z-10'>
return <div className='relative w-72 bg-white dark:bg-hexo-black-gray min-h-screen px-10 py-14 hidden lg:block z-10'>
<Logo {...props}/>
<section className='flex flex-col text-gray-600'>
@@ -31,12 +31,12 @@ function AsideLeft (props) {
{router.asPath !== '/tag' && <section className='flex flex-col'>
<hr className='w-12 my-8 ' />
<GroupTag tags={tags} currentTag={currentTag}/>
<GroupTag tags={tagOptions} currentTag={currentTag}/>
</section>}
{router.asPath !== '/category' && <section className='flex flex-col'>
<hr className='w-12 my-8 ' />
<GroupCategory categories={categories} currentCategory={currentCategory}/>
<GroupCategory categories={categoryOptions} currentCategory={currentCategory}/>
</section>}
<section className='flex flex-col'>

View File

@@ -4,8 +4,14 @@ import React from 'react'
import CONFIG_FUKA from '../config_fuka'
import Card from './Card'
const BlogCard = ({ post, showSummary }) => {
const BlogCard = ({ post, showSummary, siteInfo }) => {
const showPreview = CONFIG_FUKA.POST_LIST_PREVIEW && post.blockMap
// matery 主题默认强制显示图片
if (post && !post.page_cover) {
post.page_cover = siteInfo?.pageCover
}
const showPageCover = CONFIG_FUKA.POST_LIST_COVER && post?.page_cover
return (
<Card className="w-full lg:max-w-sm p-2 h-full overflow-auto">
<div
@@ -30,14 +36,14 @@ const BlogCard = ({ post, showSummary }) => {
)}
</div>
{CONFIG_FUKA.POST_LIST_COVER && post?.page_cover && (
{showPageCover && (
<Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref legacyBehavior>
<div className="h-40 w-full relative duration-200 cursor-pointer transform overflow-hidden">
{/* eslint-disable-next-line @next/next/no-img-element */}
<img
src={post?.page_cover}
alt={post.title}
className="hover:scale-125 transform duration-500"
className="w-full hover:scale-125 transform duration-500"
></img>
{/* <Image className='hover:scale-105 transform duration-500' src={post?.page_cover} alt={post.title} layout='fill' objectFit='cover' loading='lazy' /> */}
</div>
@@ -45,7 +51,7 @@ const BlogCard = ({ post, showSummary }) => {
)}
</div>
</Card>
);
)
}
export default BlogCard

View File

@@ -12,7 +12,7 @@ import PaginationSimple from './PaginationSimple'
* @returns {JSX.Element}
* @constructor
*/
const BlogListPage = ({ page = 1, posts = [], postCount }) => {
const BlogListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
const showNext = page < totalPage
const [colCount, changeCol] = useState(1)
@@ -44,7 +44,7 @@ const BlogListPage = ({ page = 1, posts = [], postCount }) => {
<div id="container" style={{ columnCount: colCount }}>
{posts?.map(post => (
<div key={post.id} className='justify-center flex' style={{ breakInside: 'avoid' }}>
<BlogCard key={post.id} post={post} />
<BlogCard key={post.id} post={post} siteInfo={siteInfo} />
</div>
))}
</div>

View File

@@ -13,7 +13,7 @@ import throttle from 'lodash.throttle'
* @constructor
*/
const BlogListScroll = props => {
const { posts = [] } = props
const { posts = [], siteInfo } = props
const [colCount, changeCol] = React.useState(1)
const { locale } = useGlobal()
@@ -73,15 +73,13 @@ const BlogListScroll = props => {
<div style={{ columnCount: colCount }}>
{postsToShow?.map(post => (
<div key={post.id} className='justify-center flex' style={{ breakInside: 'avoid' }}>
<BlogCard key={post.id} post={post} />
<BlogCard key={post.id} post={post} siteInfo={siteInfo} />
</div>
))}
</div>
<div
onClick={handleGetMore}
className="w-full my-4 py-4 text-center cursor-pointer "
>
<div className="w-full my-4 py-4 text-center cursor-pointer "
onClick={handleGetMore}>
{' '}
{hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '}
</div>

View File

@@ -4,7 +4,7 @@ import Card from './components/Card'
import LayoutBase from './LayoutBase'
export const LayoutCategoryIndex = props => {
const { categories } = props
const { categoryOptions } = props
const { locale } = useGlobal()
return (
<LayoutBase {...props}>
@@ -14,7 +14,7 @@ export const LayoutCategoryIndex = props => {
{locale.COMMON.CATEGORY}:
</div>
<div id="category-list" className="duration-200 flex flex-wrap mx-8">
{categories.map(category => {
{categoryOptions.map(category => {
return (
<Link
key={category.name}

View File

@@ -6,7 +6,7 @@ import React from 'react'
import Link from 'next/link'
export const LayoutTag = (props) => {
const tag = props.tags.find((t) => {
const tag = props.tagOptions.find((t) => {
return t.name === props.tag
})

View File

@@ -4,7 +4,7 @@ import TagItemMini from './components/TagItemMini'
import LayoutBase from './LayoutBase'
export const LayoutTagIndex = props => {
const { tags } = props
const { tagOptions } = props
const { locale } = useGlobal()
return (
<LayoutBase {...props}>
@@ -14,7 +14,7 @@ export const LayoutTagIndex = props => {
{locale.COMMON.TAGS}:
</div>
<div id="tags-list" className="duration-200 flex flex-wrap ml-8">
{tags.map(tag => {
{tagOptions.map(tag => {
return (
<div key={tag.name} className="p-2">
<TagItemMini key={tag.name} tag={tag} />

View File

@@ -7,7 +7,7 @@ import NotionPage from '@/components/NotionPage'
const BlogPostCard = ({ post, showSummary, index }) => {
const showPreview = CONFIG_HEXO.POST_LIST_PREVIEW && post.blockMap
const showPageCover = CONFIG_HEXO.POST_LIST_COVER
const showPageCover = CONFIG_HEXO.POST_LIST_COVER && post?.page_cover
return (
<div
key={post.id}

View File

@@ -4,11 +4,11 @@ import { useGlobal } from '@/lib/global'
import CONFIG_HEXO from '../config_hexo'
const MenuGroupCard = (props) => {
const { postCount, categories, tags } = props
const { postCount, categoryOptions, tagOptions } = props
const { locale } = useGlobal()
const archiveSlot = <div className='text-center'>{postCount}</div>
const categorySlot = <div className='text-center'>{categories?.length}</div>
const tagSlot = <div className='text-center'>{tags?.length}</div>
const categorySlot = <div className='text-center'>{categoryOptions?.length}</div>
const tagSlot = <div className='text-center'>{tagOptions?.length}</div>
const links = [
{ name: locale.COMMON.ARTICLE, to: '/archive', slot: archiveSlot, show: CONFIG_HEXO.MENU_ARCHIVE },
@@ -34,12 +34,12 @@ const MenuGroupCard = (props) => {
</div>
</Link>
);
)
} else {
return null
}
})}
</nav>
);
)
}
export default MenuGroupCard

View File

@@ -6,7 +6,7 @@ import Link from 'next/link'
import HeaderArticle from './components/HeaderArticle'
export const LayoutCategory = props => {
const { category, categories } = props
const { category, categoryOptions } = props
return (
<LayoutBase {...props} headerSlot={<HeaderArticle {...props} />} >
@@ -15,7 +15,7 @@ export const LayoutCategory = props => {
<div className="drop-shadow-xl -mt-32 rounded-md mx-3 px-5 lg:border lg:rounded-xl lg:px-2 lg:py-4 bg-white dark:bg-hexo-black-gray dark:border-black">
<div className='flex justify-center flex-wrap'>
{categories.map(e => {
{categoryOptions.map(e => {
const selected = e.name === category
return (
<Link key={e.name} href={`/category/${e.name}`} passHref legacyBehavior>

View File

@@ -3,7 +3,7 @@ import HeaderArticle from './components/HeaderArticle'
import LayoutBase from './LayoutBase'
export const LayoutCategoryIndex = props => {
const { categories } = props
const { categoryOptions } = props
return (
<LayoutBase {...props} headerSlot={<HeaderArticle {...props} />} >
@@ -13,7 +13,7 @@ export const LayoutCategoryIndex = props => {
<div className="drop-shadow-xl -mt-32 rounded-md mx-3 px-5 lg:border lg:rounded-xl lg:px-2 lg:py-4 bg-white dark:bg-hexo-black-gray dark:border-black">
<div className='flex justify-center flex-wrap'>
{categories.map(e => {
{categoryOptions.map(e => {
return (
<Link key={e.name} href={`/category/${e.name}`} passHref legacyBehavior>
<div className='duration-300 text-md whitespace-nowrap dark:hover:text-white px-5 cursor-pointer py-2 hover:text-indigo-400' >

View File

@@ -8,7 +8,7 @@ import { useGlobal } from '@/lib/global'
import TagItemMiddle from './components/TagItemMiddle'
export const LayoutTag = (props) => {
const { tags, tag } = props
const { tagOptions, tag } = props
const { locale } = useGlobal()
@@ -23,7 +23,7 @@ export const LayoutTag = (props) => {
</div>
<div id="tags-list" className="duration-200 flex flex-wrap justify-center pb-12">
{tags.map(e => {
{tagOptions.map(e => {
const selected = tag === e.name
return (
<div key={e.id} className="p-2">

View File

@@ -4,7 +4,7 @@ import TagItemMiddle from './components/TagItemMiddle'
import LayoutBase from './LayoutBase'
export const LayoutTagIndex = props => {
const { tags } = props
const { tagOptions } = props
const { locale } = useGlobal()
return (
<LayoutBase {...props} headerSlot={<HeaderArticle {...props} />} >
@@ -17,7 +17,7 @@ export const LayoutTagIndex = props => {
</div>
<div id="tags-list" className="duration-200 flex flex-wrap justify-center pb-12">
{tags.map(tag => {
{tagOptions.map(tag => {
return (
<div key={tag.name} className="p-2">
<TagItemMiddle key={tag.name} tag={tag} />

View File

@@ -4,8 +4,13 @@ import React from 'react'
import TagItemMini from './TagItemMini'
import CONFIG_MATERY from '../config_matery'
const BlogPostCard = ({ post, showSummary }) => {
const BlogPostCard = ({ post, showSummary, siteInfo }) => {
const showPreview = CONFIG_MATERY.POST_LIST_PREVIEW && post.blockMap
// matery 主题默认强制显示图片
if (post && !post.page_cover) {
post.page_cover = siteInfo.pageCover
}
const showPageCover = CONFIG_MATERY.POST_LIST_COVER && !showPreview && post?.page_cover
return (
<div
data-aos="zoom-in"
@@ -19,7 +24,7 @@ const BlogPostCard = ({ post, showSummary }) => {
<div key={post.id} className="flex flex-col h-96 justify-between">
{/* 头部图片 填充卡片 */}
{CONFIG_MATERY.POST_LIST_COVER && !showPreview && post?.page_cover && (
{showPageCover && (
<Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref legacyBehavior>
<div className="flex flex-grow w-full relative duration-200 bg-black rounded-t-md cursor-pointer transform overflow-hidden">
{/* eslint-disable-next-line @next/next/no-img-element */}

View File

@@ -11,7 +11,7 @@ import PaginationSimple from './PaginationSimple'
* @returns {JSX.Element}
* @constructor
*/
const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
const BlogPostListPage = ({ page = 1, posts = [], postCount, siteInfo }) => {
const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE)
const showPagination = postCount >= BLOG.POSTS_PER_PAGE
if (!posts || posts.length === 0 || page > totalPage) {
@@ -23,7 +23,7 @@ const BlogPostListPage = ({ page = 1, posts = [], postCount }) => {
{/* 文章列表 */}
<div className="px-4 pt-4 xl:columns-3 md:columns-2 pb-24" >
{posts.map(post => (
<BlogPostCard key={post.id} post={post} />
<BlogPostCard key={post.id} post={post} siteInfo={siteInfo} />
))}
</div>
{showPagination && <PaginationSimple page={page} totalPage={totalPage} />}

View File

@@ -14,7 +14,7 @@ import { getListByPage } from '@/lib/utils'
* @returns {JSX.Element}
* @constructor
*/
const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG_MATERY.POST_LIST_SUMMARY }) => {
const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG_MATERY.POST_LIST_SUMMARY, siteInfo }) => {
const postsPerPage = BLOG.POSTS_PER_PAGE
const [page, updatePage] = React.useState(1)
const postsToShow = getListByPage(posts, page, postsPerPage)
@@ -58,7 +58,7 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG_MA
{/* 文章列表 */}
<div className='flex flex-wrap space-y-1 lg:space-y-4 px-2'>
{postsToShow.map(post => (
<BlogPostCard key={post.id} post={post} showSummary={showSummary}/>
<BlogPostCard key={post.id} post={post} showSummary={showSummary} siteInfo={siteInfo}/>
))}
</div>

View File

@@ -3,7 +3,7 @@ import Link from 'next/link'
import LayoutBase from './LayoutBase'
export const LayoutCategoryIndex = (props) => {
const { categories } = props
const { categoryOptions } = props
const { locale } = useGlobal()
return (
<LayoutBase {...props}>
@@ -12,7 +12,7 @@ export const LayoutCategoryIndex = (props) => {
<i className='mr-4 fas fa-th' />{locale.COMMON.CATEGORY}:
</div>
<div id='category-list' className='duration-200 flex flex-wrap'>
{categories && categories.map(category => {
{categoryOptions?.map(category => {
return (
<Link
key={category.name}

View File

@@ -3,7 +3,7 @@ import TagItemMini from './components/TagItemMini'
import LayoutBase from './LayoutBase'
export const LayoutTagIndex = props => {
const { tags } = props
const { tagOptions } = props
const { locale } = useGlobal()
return (
<LayoutBase {...props}>
@@ -13,7 +13,7 @@ export const LayoutTagIndex = props => {
{locale.COMMON.TAGS}:
</div>
<div id="tags-list" className="duration-200 flex flex-wrap">
{tags.map(tag => {
{tagOptions.map(tag => {
return (
<div key={tag.name} className="p-2">
<TagItemMini key={tag.name} tag={tag} />

View File

@@ -6,10 +6,10 @@ import BlogPostListPage from './components/BlogPostListPage'
import BLOG from '@/blog.config'
export const LayoutCategory = (props) => {
const { category, categories } = props
const { category, categoryOptions } = props
return <LayoutBase currentCategory={category} {...props}>
<StickyBar>
<CategoryList currentCategory={category} categories={categories} />
<CategoryList currentCategory={category} categoryOptions={categoryOptions} />
</StickyBar>
<div className='md:mt-8'>
{BLOG.POST_LIST_STYLE !== 'page'

View File

@@ -3,7 +3,7 @@ import LayoutBase from './LayoutBase'
import Link from 'next/link'
export const LayoutCategoryIndex = (props) => {
const { allPosts, categories } = props
const { allPosts, categoryOptions } = props
const { locale } = useGlobal()
return (
<LayoutBase totalPosts={allPosts} {...props}>
@@ -12,7 +12,7 @@ export const LayoutCategoryIndex = (props) => {
<i className='mr-4 fas faTh' />{locale.COMMON.CATEGORY}:
</div>
<div id='category-list' className='duration-200 flex flex-wrap'>
{categories.map(category => {
{categoryOptions.map(category => {
return (
<Link
key={category.name}
@@ -24,10 +24,10 @@ export const LayoutCategoryIndex = (props) => {
<i className='mr-4 fas fa-folder' />{category.name}({category.count})
</div>
</Link>
);
)
})}
</div>
</div>
</LayoutBase>
);
)
}

View File

@@ -6,11 +6,11 @@ import BlogPostListPage from './components/BlogPostListPage'
import BLOG from '@/blog.config'
export const LayoutTag = (props) => {
const { tags, tag } = props
const { tagOptions, tag } = props
return <LayoutBase currentTag={tag} {...props}>
<StickyBar>
<TagList tags={tags} currentTag={tag} />
<TagList tagOptions={tagOptions} currentTag={tag} />
</StickyBar>
<div className='md:mt-8'>
{BLOG.POST_LIST_STYLE !== 'page'

View File

@@ -3,13 +3,13 @@ import LayoutBase from './LayoutBase'
import TagItem from './components/TagItem'
export const LayoutTagIndex = (props) => {
const { tags } = props
const { tagOptions } = props
const { locale } = useGlobal()
return <LayoutBase {...props}>
<div className='bg-white dark:bg-hexo-black-gray px-10 py-10 shadow h-full'>
<div className='dark:text-gray-200 mb-5'><i className='fas fa-tags mr-4'/>{locale.COMMON.TAGS}:</div>
<div id='tags-list' className='duration-200 flex flex-wrap'>
{ tags.map(tag => {
{ tagOptions.map(tag => {
return <div key={tag.name} className='p-2'><TagItem key={tag.name} tag={tag} /></div>
}) }
</div>

View File

@@ -2,16 +2,16 @@ import Link from 'next/link'
import React from 'react'
import { useGlobal } from '@/lib/global'
const CategoryList = ({ currentCategory, categories }) => {
if (!categories) {
const CategoryList = ({ currentCategory, categoryOptions }) => {
const { locale } = useGlobal()
if (!categoryOptions) {
return <></>
}
const { locale } = useGlobal()
return (
<ul className='flex py-1 space-x-3'>
<li className='w-16 py-2 dark:text-gray-200 whitespace-nowrap'>{locale.COMMON.CATEGORY}</li>
{categories.map(category => {
{categoryOptions.map(category => {
const selected = category.name === currentCategory
return (
<Link
@@ -32,10 +32,10 @@ const CategoryList = ({ currentCategory, categories }) => {
</a>
</li>
</Link>
);
)
})}
</ul>
);
)
}
export default CategoryList

View File

@@ -7,13 +7,13 @@ import TagItem from './TagItem'
* @returns {JSX.Element}
* @constructor
*/
const TagList = ({ tags, currentTag }) => {
if (!tags) {
const TagList = ({ tagOptions, currentTag }) => {
if (!tagOptions) {
return <></>
}
return <ul className='flex py-1 space-x-3'>
<li className='w-20 py-2 dark:text-gray-200 whitespace-nowrap'>标签:</li>
{tags.map(tag => {
{tagOptions.map(tag => {
const selected = tag.name === currentTag
return <TagItem key={tag.name} tag={tag} selected={selected}/>
})}

View File

@@ -16,7 +16,7 @@ const LayoutBase = props => {
const fullWidth = post?.fullWidth ?? false
return (
<div className='nobelium dark:text-gray-300 w-full bg-white dark:bg-black min-h-screen'>
<div className='nobelium relative dark:text-gray-300 w-full bg-white dark:bg-black min-h-screen'>
<CommonHead meta={meta} />
{/* 顶部导航栏 */}

View File

@@ -2,12 +2,12 @@ import Link from 'next/link'
import LayoutBase from './LayoutBase'
export const LayoutCategoryIndex = (props) => {
const { categories } = props
const { categoryOptions } = props
return (
<LayoutBase {...props}>
<div id='category-list' className='duration-200 flex flex-wrap'>
{categories && categories.map(category => {
{categoryOptions?.map(category => {
return (
<Link
key={category.name}
@@ -19,9 +19,9 @@ export const LayoutCategoryIndex = (props) => {
<i className='mr-4 fas fa-folder' />{category.name}({category.count})
</div>
</Link>
);
)
})}
</div>
</LayoutBase>
);
)
}

View File

@@ -2,12 +2,12 @@ import Link from 'next/link'
import LayoutBase from './LayoutBase'
export const LayoutTagIndex = (props) => {
const { tags } = props
const { tagOptions } = props
return (
<LayoutBase {...props}>
<div>
<div id='tags-list' className='duration-200 flex flex-wrap'>
{tags.map(tag => {
{tagOptions.map(tag => {
return (
<div key={tag.name} className='p-2'>
<Link
@@ -21,9 +21,9 @@ export const LayoutTagIndex = (props) => {
</Link>
</div>
);
)
})}
</div>
</div> </LayoutBase>
);
)
}