hexo主题 新增category、tag分页

pages/category/[category]/index.js

@@ -2,7 +2,13 @@ import { getGlobalNotionData } from '@/lib/notion/getNotionData'
 import React from 'react'
 import { useGlobal } from '@/lib/global'
 import * as ThemeMap from '@/themes'
+import BLOG from '@/blog.config'
 
+/**
+ * 分类页
+ * @param {*} props
+ * @returns
+ */
 export default function Category(props) {
   const { theme } = useGlobal()
   const ThemeComponents = ThemeMap[theme]
@@ -26,12 +32,23 @@ export default function Category(props) {
 export async function getStaticProps({ params: { category } }) {
   const from = 'category-props'
   let props = await getGlobalNotionData({ from })
-  const { allPages } = props
-  const allPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published')
-  const posts = allPosts.filter(
-    post => post && post.category && post.category.includes(category)
-  )
-  props = { ...props, posts, category }
+
+  // 过滤状态
+  props.posts = props.allPages.filter(page => page.type === 'Post' && page.status === 'Published')
+  // 处理过滤
+  props.posts = props.posts.filter(post => post && post.category && post.category.includes(category))
+  // 处理文章页数
+  props.postCount = props.posts.length
+  // 处理分页
+  if (BLOG.POST_LIST_STYLE === 'scroll') {
+    // 滚动列表 给前端返回所有数据
+  } else if (BLOG.POST_LIST_STYLE === 'page') {
+    props.posts = props.posts?.slice(0, BLOG.POSTS_PER_PAGE - 1)
+  }
+
+  delete props.allPages
+
+  props = { ...props, category }
 
   return {
     props,

pages/category/[category]/page/[page].js

@@ -0,0 +1,65 @@
+import { getGlobalNotionData } from '@/lib/notion/getNotionData'
+import React from 'react'
+import { useGlobal } from '@/lib/global'
+import * as ThemeMap from '@/themes'
+import BLOG from '@/blog.config'
+
+/**
+ * 分类页
+ * @param {*} props
+ * @returns
+ */
+export default function Category(props) {
+  const { theme } = useGlobal()
+  const ThemeComponents = ThemeMap[theme]
+  const { siteInfo, posts } = props
+  const { locale } = useGlobal()
+  if (!posts) {
+    return <ThemeComponents.Layout404 {...props} />
+  }
+  const meta = {
+    title: `${props.category} | ${locale.COMMON.CATEGORY} | ${
+      siteInfo?.title || ''
+    }`,
+    description: siteInfo?.description,
+    slug: 'category/' + props.category,
+    image: siteInfo?.pageCover,
+    type: 'website'
+  }
+  return <ThemeComponents.LayoutCategory {...props} meta={meta} />
+}
+
+export async function getStaticProps({ params: { category, page } }) {
+  const from = 'category-page-props'
+  let props = await getGlobalNotionData({ from })
+
+  // 过滤状态
+  props.posts = props.allPages.filter(page => page.type === 'Post' && page.status === 'Published')
+  // 过滤类型
+  props.posts = props.posts.filter(post => post && post.category && post.category.includes(category))
+  // 处理文章页数
+  props.postCount = props.posts.length
+  // 处理分页
+  props.posts = props.posts.slice(BLOG.POSTS_PER_PAGE * (page - 1), BLOG.POSTS_PER_PAGE * page - 1)
+
+  delete props.allPages
+  props.page = page
+
+  props = { ...props, category, page }
+
+  return {
+    props,
+    revalidate: 1
+  }
+}
+
+export async function getStaticPaths() {
+  const from = 'category-paths'
+  const { categories } = await getGlobalNotionData({ from })
+  return {
+    paths: Object.keys(categories).map(category => ({
+      params: { category: categories[category]?.name, page: '1' }
+    })),
+    fallback: true
+  }
+}

pages/category/index.js

@@ -3,6 +3,11 @@ import React from 'react'
 import { useGlobal } from '@/lib/global'
 import * as ThemeMap from '@/themes'
 
+/**
+ * 分类首页
+ * @param {*} props
+ * @returns
+ */
 export default function Category(props) {
   const { theme } = useGlobal()
   const ThemeComponents = ThemeMap[theme]

pages/index.js

@@ -12,8 +12,8 @@ const Index = props => {
 export async function getStaticProps() {
   const from = 'index'
   const props = await getGlobalNotionData({ from })
-  const { allPages, siteInfo } = props
-  const allPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published')
+  const { siteInfo } = props
+  props.posts = props.allPages.filter(page => page.type === 'Post' && page.status === 'Published')
   const meta = {
     title: `${siteInfo?.title} | ${siteInfo?.description}`,
     description: siteInfo?.description,
@@ -21,12 +21,11 @@ export async function getStaticProps() {
     slug: '',
     type: 'website'
   }
-
   // 处理分页
   if (BLOG.POST_LIST_STYLE === 'scroll') {
-    props.posts = Array.from(allPosts)
+    // 滚动列表默认给前端返回所有数据
   } else if (BLOG.POST_LIST_STYLE === 'page') {
-    props.posts = allPosts?.slice(0, BLOG.POSTS_PER_PAGE)
+    props.posts = props.posts?.slice(0, BLOG.POSTS_PER_PAGE)
   }
 
   // 预览文章内容

pages/page/[page].js

@@ -37,11 +37,11 @@ export async function getStaticPaths() {
 export async function getStaticProps({ params: { page } }) {
   const from = `page-${page}`
   const props = await getGlobalNotionData({ from })
-  props.page = page
   const { allPages } = props
   const allPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published')
   // 处理分页
   props.posts = allPosts.slice(BLOG.POSTS_PER_PAGE * (page - 1), BLOG.POSTS_PER_PAGE * page)
+  props.page = page
 
   // 处理预览
   if (BLOG.POST_LIST_PREVIEW === 'true') {

pages/tag/[tag]/index.js

@@ -1,6 +1,7 @@
 import { useGlobal } from '@/lib/global'
 import { getGlobalNotionData } from '@/lib/notion/getNotionData'
 import * as ThemeMap from '@/themes'
+import BLOG from '@/blog.config'
 
 const Tag = props => {
   const { theme } = useGlobal()
@@ -23,16 +24,25 @@ const Tag = props => {
 }
 
 export async function getStaticProps({ params: { tag } }) {
-  const props = await getGlobalNotionData({
-    from: 'tag-props',
-    includePage: false,
-    tagsCount: 0
-  })
-  const { allPages } = props
-  const allPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published')
-  props.posts = allPosts.filter(
-    post => post && post.tags && post.tags.includes(tag)
-  )
+  const from = 'tag-props'
+  const props = await getGlobalNotionData({ from })
+
+  // 过滤状态
+  props.posts = props.allPages.filter(page => page.type === 'Post' && page.status === 'Published')
+
+  // 处理标签
+  props.posts = props.posts.filter(post => post && post.tags && post.tags.includes(tag))
+
+  // 处理文章页数
+  props.postCount = props.posts.length
+
+  // 处理分页
+  if (BLOG.POST_LIST_STYLE === 'scroll') {
+    // 滚动列表 给前端返回所有数据
+  } else if (BLOG.POST_LIST_STYLE === 'page') {
+    props.posts = props.posts?.slice(0, BLOG.POSTS_PER_PAGE - 1)
+  }
+
   props.tag = tag
   return {
     props,

pages/tag/[tag]/page/[page].js

@@ -0,0 +1,63 @@
+import { useGlobal } from '@/lib/global'
+import { getGlobalNotionData } from '@/lib/notion/getNotionData'
+import * as ThemeMap from '@/themes'
+import BLOG from '@/blog.config'
+
+const Tag = props => {
+  const { theme } = useGlobal()
+  const ThemeComponents = ThemeMap[theme]
+  const { locale } = useGlobal()
+  const { tag, siteInfo, posts } = props
+
+  if (!posts) {
+    return <ThemeComponents.Layout404 {...props} />
+  }
+
+  const meta = {
+    title: `${tag} | ${locale.COMMON.TAGS} | ${siteInfo?.title}`,
+    description: siteInfo?.description,
+    image: siteInfo?.pageCover,
+    slug: 'tag/' + tag,
+    type: 'website'
+  }
+  return <ThemeComponents.LayoutTag {...props} meta={meta} />
+}
+
+export async function getStaticProps({ params: { tag, page } }) {
+  const from = 'tag-page-props'
+  const props = await getGlobalNotionData({ from })
+  // 过滤状态
+  props.posts = props.allPages.filter(page => page.type === 'Post' && page.status === 'Published')
+  // 过滤标签
+  props.posts = props.posts.filter(post => post && post.tags && post.tags.includes(tag))
+  // 处理文章页数
+  props.postCount = props.posts.length
+  // 处理分页
+  props.posts = props.posts.slice(BLOG.POSTS_PER_PAGE * (page - 1), BLOG.POSTS_PER_PAGE * page - 1)
+
+  props.tag = tag
+  props.page = page
+
+  return {
+    props,
+    revalidate: 1
+  }
+}
+
+export async function getStaticPaths() {
+  const from = 'tag-static-path'
+  const { tags } = await getGlobalNotionData({ from })
+  const tagNames = []
+  tags.forEach(tag => {
+    tagNames.push(tag.name)
+  })
+
+  return {
+    paths: Object.keys(tagNames).map(index => ({
+      params: { tag: tagNames[index], page: '1' }
+    })),
+    fallback: true
+  }
+}
+
+export default Tag

pages/tag/index.js

@@ -3,6 +3,11 @@ import React from 'react'
 import { useGlobal } from '@/lib/global'
 import * as ThemeMap from '@/themes'
 
+/**
+ * 标签首页
+ * @param {*} props
+ * @returns
+ */
 const TagIndex = props => {
   const { theme } = useGlobal()
   const ThemeComponents = ThemeMap[theme]