diff --git a/.env.local b/.env.local index 35e50011..55d9f586 100644 --- a/.env.local +++ b/.env.local @@ -1,2 +1,2 @@ # 环境变量 @see https://www.nextjs.cn/docs/basic-features/environment-variables -NEXT_PUBLIC_VERSION=3.13.5 \ No newline at end of file +NEXT_PUBLIC_VERSION=3.13.6 \ No newline at end of file diff --git a/blog.config.js b/blog.config.js index c51d97a2..94680611 100644 --- a/blog.config.js +++ b/blog.config.js @@ -185,7 +185,9 @@ const BLOG = { // ----> 评论互动 可同时开启多个支持 WALINE VALINE GISCUS CUSDIS UTTERRANCES GITALK // twikoo - COMMENT_TWIKOO_ENV_ID: process.env.NEXT_PUBLIC_COMMENT_ENV_ID || '', // TWIKOO地址 腾讯云环境填 envId；Vercel 环境域名地址（https://xxx.vercel.app) + COMMENT_TWIKOO_ENV_ID: process.env.NEXT_PUBLIC_COMMENT_ENV_ID || '', // TWIKOO后端地址 腾讯云环境填envId；Vercel环境填域名，教程：https://tangly1024.com/article/notionnext-twikoo + COMMENT_TWIKOO_COUNT_ENABLE: process.env.NEXT_PUBLIC_COMMENT_TWIKOO_COUNT_ENABLE || false, // 博客列表是否显示评论数 + COMMENT_TWIKOO_CDN_URL: process.env.NEXT_PUBLIC_COMMENT_TWIKOO_CDN_URL || 'https://cdn.staticfile.org/twikoo/1.6.16/twikoo.all.min.js', // twikoo客户端cdn // utterance COMMENT_UTTERRANCES_REPO: diff --git a/components/PrismMac.js b/components/PrismMac.js index 60cc0983..b2f9ce90 100644 --- a/components/PrismMac.js +++ b/components/PrismMac.js @@ -23,8 +23,10 @@ const PrismMac = () => { loadExternalResource('/css/prism-mac-style.css', 'css') } loadExternalResource(BLOG.PRISM_THEME_PATH, 'css') - loadExternalResource(BLOG.PRISM_JS_AUTO_LOADER, 'js').then((e) => { - Prism.plugins.autoloader.languages_path = BLOG.PRISM_JS_PATH + loadExternalResource(BLOG.PRISM_JS_AUTO_LOADER, 'js').then((url) => { + if (window?.Prism?.plugins?.autoloader) { + window.Prism.plugins.autoloader.languages_path = BLOG.PRISM_JS_PATH + } renderPrismMac() }) } diff --git a/components/Twikoo.js b/components/Twikoo.js index bc6baa06..0c489bd5 100644 --- a/components/Twikoo.js +++ b/components/Twikoo.js @@ -1,6 +1,7 @@ import BLOG from '@/blog.config' -import React from 'react' -import twikoo from 'twikoo' +import { loadExternalResource } from '@/lib/utils' +import { useEffect } from 'react' +// import twikoo from 'twikoo' /** * Giscus评论 @see https://giscus.app/zh-CN @@ -10,17 +11,48 @@ import twikoo from 'twikoo' */ const Twikoo = ({ isDarkMode }) => { - React.useEffect(() => { - twikoo({ - envId: BLOG.COMMENT_TWIKOO_ENV_ID, // 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app） - el: '#twikoo', // 容器元素 - lang: BLOG.LANG // 用于手动设定评论区语言，支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/client/utils/i18n/index.js - // region: 'ap-guangzhou', // 环境地域，默认为 ap-shanghai，腾讯云环境填 ap-shanghai 或 ap-guangzhou；Vercel 环境不填 - // path: location.pathname, // 用于区分不同文章的自定义 js 路径，如果您的文章路径不是 location.pathname，需传此参数 - }) - }) + const loadTwikoo = async () => { + try { + const url = await loadExternalResource(BLOG.COMMENT_TWIKOO_CDN_URL, 'js') + console.log('twikoo 加载成功', url) + const twikoo = window.twikoo + twikoo.init({ + envId: BLOG.COMMENT_TWIKOO_ENV_ID, // 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app） + el: '#twikoo', // 容器元素 + lang: BLOG.LANG // 用于手动设定评论区语言，支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/client/utils/i18n/index.js + // region: 'ap-guangzhou', // 环境地域，默认为 ap-shanghai，腾讯云环境填 ap-shanghai 或 ap-guangzhou；Vercel 环境不填 + // path: location.pathname, // 用于区分不同文章的自定义 js 路径，如果您的文章路径不是 location.pathname，需传此参数 + }) + + twikoo.getCommentsCount({ + envId: BLOG.COMMENT_TWIKOO_ENV_ID, // 环境 ID + // region: 'ap-guangzhou', // 环境地域，默认为 ap-shanghai，如果您的环境地域不是上海，需传此参数 + urls: [ // 不包含协议、域名、参数的文章路径列表，必传参数 + '/article/notion-next', + '/article/notion-next-guide' + ], + includeReply: false // 评论数是否包括回复，默认：false + }).then(function (res) { + console.log(res) + // 返回示例: [ + // { url: '/2020/10/post-1.html', count: 10 }, + // { url: '/2020/11/post-2.html', count: 0 }, + // { url: '/2020/12/post-3.html', count: 20 } + // ] + }).catch(function (err) { + // 发生错误 + console.error(err) + }) + } catch (error) { + console.error('twikoo 加载失败', error) + } + } + + useEffect(() => { + loadTwikoo() + }, []) return ( -
+
) } diff --git a/components/TwikooCommentCount.js b/components/TwikooCommentCount.js new file mode 100644 index 00000000..eb5cd605 --- /dev/null +++ b/components/TwikooCommentCount.js @@ -0,0 +1,22 @@ +import BLOG from '@/blog.config' +// import twikoo from 'twikoo' + +/** + * 获取博客的评论数，用与在列表中展示 + * @returns {JSX.Element} + * @constructor + */ + +const TwikooCommentCount = ({ post, className }) => { + if (!JSON.parse(BLOG.COMMENT_TWIKOO_COUNT_ENABLE)) { + return null + } + return +} + +export default TwikooCommentCount diff --git a/components/TwikooCommentCounter.js b/components/TwikooCommentCounter.js new file mode 100644 index 00000000..448b51b8 --- /dev/null +++ b/components/TwikooCommentCounter.js @@ -0,0 +1,79 @@ +import BLOG from '@/blog.config' +import { useGlobal } from '@/lib/global' +import { loadExternalResource } from '@/lib/utils' +import { useRouter } from 'next/router' +import { useEffect } from 'react' + +/** + * 获取博客的评论数，用与在列表中展示 + * @returns {JSX.Element} + * @constructor + */ + +const TwikooCommentCounter = (props) => { + let commentsData = [] + const { theme } = useGlobal() + + const fetchTwikooData = async (posts) => { + posts.forEach(post => { + post.slug = post.slug.startsWith('/') ? post.slug : `/${post.slug}` + }) + try { + await loadExternalResource(BLOG.COMMENT_TWIKOO_CDN_URL, 'js') + const twikoo = window.twikoo + twikoo.getCommentsCount({ + envId: BLOG.COMMENT_TWIKOO_ENV_ID, // 环境 ID + // region: 'ap-guangzhou', // 环境地域，默认为 ap-shanghai，如果您的环境地域不是上海，需传此参数 + urls: posts.map(post => post.slug), // 不包含协议、域名、参数的文章路径列表，必传参数 + includeReply: true // 评论数是否包括回复，默认：false + }).then(function (res) { + console.log('查询', res) + commentsData = res + updateCommentCount() + }).catch(function (err) { + // 发生错误 + console.error(err) + }) + } catch (error) { + console.error('twikoo 加载失败', error) + } + } + + const updateCommentCount = () => { + if (commentsData.length === 0) { + return + } + props.posts.forEach(post => { + const matchingRes = commentsData.find(r => r.url === post.slug) + if (matchingRes) { + // 修改评论数量div + const textElements = document.querySelectorAll(`.comment-count-text-${post.id}`) + textElements.forEach(element => { + element.innerHTML = matchingRes.count + }) + // 取消隐藏 + const wrapperElements = document.querySelectorAll(`.comment-count-wrapper-${post.id}`) + wrapperElements.forEach(element => { + element.classList.remove('hidden') + }) + } + }) + } + const router = useRouter() + + useEffect(() => { + console.log('路由触发评论计数') + if (props?.posts && props?.posts?.length > 0) { + fetchTwikooData(props.posts) + } + }, [router.events]) + + // 监控主题变化时的的评论数 + useEffect(() => { + console.log('主题触发评论计数', commentsData) + updateCommentCount() + }, [theme]) + return null +} + +export default TwikooCommentCounter diff --git a/components/TwikooRecentComments.js b/components/TwikooRecentComments.js new file mode 100644 index 00000000..306b17a2 --- /dev/null +++ b/components/TwikooRecentComments.js @@ -0,0 +1,12 @@ + +/** + * 显示最近评论 TODO + * @returns {JSX.Element} + * @constructor + */ + +const TwikooRecentComments = (props) => { + return null +} + +export default TwikooRecentComments diff --git a/package.json b/package.json index 3e855451..82f8696d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "notion-next", - "version": "3.13.5", + "version": "3.13.6", "homepage": "https://github.com/tangly1024/NotionNext.git", "license": "MIT", "repository": { @@ -55,7 +55,6 @@ "react-share": "^4.4.1", "react-tweet-embed": "~2.0.0", "smoothscroll-polyfill": "^0.4.4", - "twikoo": "^1.6.16", "typed.js": "^2.0.12", "use-ackee": "^3.0.0", "valine": "^1.4.18" diff --git a/pages/_app.js b/pages/_app.js index f8e2a8b9..e4895f82 100644 --- a/pages/_app.js +++ b/pages/_app.js @@ -26,6 +26,7 @@ import smoothscroll from 'smoothscroll-polyfill' import AOS from 'aos' import 'aos/dist/aos.css' // You can also use for styles import { isMobile } from '@/lib/utils' +import TwikooCommentCounter from '@/components/TwikooCommentCounter' const Ackee = dynamic(() => import('@/components/Ackee'), { ssr: false }) const Gtag = dynamic(() => import('@/components/Gtag'), { ssr: false }) @@ -53,6 +54,7 @@ const MyApp = ({ Component, pageProps }) => { {JSON.parse(BLOG.MUSIC_PLAYER) && } {JSON.parse(BLOG.NEST) && } {JSON.parse(BLOG.FLUTTERINGRIBBON) && } + {JSON.parse(BLOG.COMMENT_TWIKOO_COUNT_ENABLE) && } {JSON.parse(BLOG.RIBBON) && } diff --git a/pages/index.js b/pages/index.js index 542500fb..7fac472b 100644 --- a/pages/index.js +++ b/pages/index.js @@ -5,12 +5,22 @@ import * as ThemeMap from '@/themes' import { useGlobal } from '@/lib/global' import { generateRss } from '@/lib/rss' import { generateRobotsTxt } from '@/lib/robots.txt' + +/** + * 首页布局 + * @param {*} props + * @returns + */ const Index = props => { const { theme } = useGlobal() const ThemeComponents = ThemeMap[theme] return } +/** + * SSG 获取数据 + * @returns + */ export async function getStaticProps() { const from = 'index' const props = await getGlobalNotionData({ from }) diff --git a/themes/example/components/BlogListPage.js b/themes/example/components/BlogListPage.js index c36ebca1..d51bcc5f 100644 --- a/themes/example/components/BlogListPage.js +++ b/themes/example/components/BlogListPage.js @@ -4,6 +4,7 @@ import { useGlobal } from '@/lib/global' import { useRouter } from 'next/router' import Link from 'next/link' import CONFIG_EXAMPLE from '../config_example' +import BlogPostCard from './BlogPostCard' export const BlogListPage = props => { const { page = 1, posts, postCount } = props @@ -22,46 +23,8 @@ export const BlogListPage = props => {
- {posts?.map(p => ( -
-
-

- - {p.title} - -

- -
- by {BLOG.AUTHOR} on {p.date?.start_date || p.createdTime} - | - {p.category} - {/* | */} - {/* 2 Comments */} -
- -

- {p.summary} -

- {/* 搜索结果 */} - {p.results && ( -

- {p.results.map(r => ( - {r} - ))} -

- )} -
- {/* 图片封面 */} - {showPageCover && ( -
- -
- -
- )} -
+ {posts?.map(post => ( + ))}
diff --git a/themes/example/components/BlogListScroll.js b/themes/example/components/BlogListScroll.js index 0949f4da..e1d0c2ae 100644 --- a/themes/example/components/BlogListScroll.js +++ b/themes/example/components/BlogListScroll.js @@ -1,8 +1,8 @@ import BLOG from '@/blog.config' import { useGlobal } from '@/lib/global' -import Link from 'next/link' -import React from 'react' +import React, { useEffect } from 'react' import throttle from 'lodash.throttle' +import BlogPostCard from './BlogPostCard' import CONFIG_EXAMPLE from '../config_example' export const BlogListScroll = props => { @@ -35,8 +35,9 @@ export const BlogListScroll = props => { handleGetMore() } }, 500)) + const showPageCover = CONFIG_EXAMPLE.POST_LIST_COVER - React.useEffect(() => { + useEffect(() => { window.addEventListener('scroll', scrollTrigger) return () => { @@ -44,60 +45,22 @@ export const BlogListScroll = props => { } }) - const showPageCover = CONFIG_EXAMPLE.POST_LIST_COVER - return ( -
- {postsToShow.map(p => ( -
-
-

- - {p.title} - -

-
- by {BLOG.AUTHOR} on {p.date?.start_date || p.createdTime} - | - {p.category} - {/* | */} - {/* 2 Comments */} -
+
-

- {p.summary} -

- {/* 搜索结果 */} - {p.results && ( -

- {p.results.map(r => ( - {r} - ))} -

- )} -
- {/* 图片封面 */} - {showPageCover && ( -
- -
- -
- )} -
- ))} + {postsToShow?.map(post => ( + + ))} -
- {' '} - {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '} -
+
+ {' '} + {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}{' '} +
-
+
) } diff --git a/themes/example/components/BlogPostCard.js b/themes/example/components/BlogPostCard.js new file mode 100644 index 00000000..b773e29f --- /dev/null +++ b/themes/example/components/BlogPostCard.js @@ -0,0 +1,51 @@ +import BLOG from '@/blog.config' +import CONFIG_EXAMPLE from '../config_example' +import Link from 'next/link' +import TwikooCommentCount from '@/components/TwikooCommentCount' + +const BlogPostCard = ({ post }) => { + const showPageCover = CONFIG_EXAMPLE.POST_LIST_COVER + + return
+
+

+ + {post.title} + +

+ +
+ by {BLOG.AUTHOR} on {post.date?.start_date || post.createdTime} + + | + {post.category} + {/* | */} + {/* 2 Comments */} +
+ +

+ {post.summary} +

+ {/* 搜索结果 */} + {post.results && ( +

+ {post.results.map(r => ( + {r} + ))} +

+ )} +
+ {/* 图片封面 */} + {showPageCover && ( +
+ +
+ +
+ )} +
+} + +export default BlogPostCard diff --git a/themes/hexo/components/BlogPostCardInfo.js b/themes/hexo/components/BlogPostCardInfo.js index 7336b64a..31288658 100644 --- a/themes/hexo/components/BlogPostCardInfo.js +++ b/themes/hexo/components/BlogPostCardInfo.js @@ -2,6 +2,7 @@ import BLOG from '@/blog.config' import NotionPage from '@/components/NotionPage' import Link from 'next/link' import TagItemMini from './TagItemMini' +import TwikooCommentCount from '@/components/TwikooCommentCount' /** * 博客列表的文字内容 @@ -26,17 +27,19 @@ export const BlogPostCardInfo = ({ post, showPreview, showPageCover, showSummary {/* 日期 */}
+ className="font-light cursor-pointer text-sm leading-4 mr-3 hover:text-indigo-700 dark:hover:text-indigo-400"> {post.date?.start_date || post.lastEditedTime} + +
{/* 摘要 */} diff --git a/themes/hexo/components/HexoRecentComments.js b/themes/hexo/components/HexoRecentComments.js index 9c2042e6..2ebf00c8 100644 --- a/themes/hexo/components/HexoRecentComments.js +++ b/themes/hexo/components/HexoRecentComments.js @@ -25,21 +25,23 @@ const HexoRecentComments = (props) => { }, []) return ( - -
- - {locale.COMMON.RECENT_COMMENTS} -
+ +
+ + {locale.COMMON.RECENT_COMMENTS} +
- {onLoading &&
Loading...
} - {!onLoading && comments && comments.length === 0 &&
No Comments
} - {!onLoading && comments && comments.length > 0 && comments.map((comment) =>
-
-
--{comment.nick}
-
)} + {onLoading &&
Loading...
} + {!onLoading && comments && comments.length === 0 &&
No Comments
} + {!onLoading && comments && comments.length > 0 && comments.map((comment) =>
+
+
+ --{comment.nick} +
+
)} - - ); + + ) } export default HexoRecentComments diff --git a/themes/matery/components/BlogPostCard.js b/themes/matery/components/BlogPostCard.js index 194afe9f..fd5c5163 100644 --- a/themes/matery/components/BlogPostCard.js +++ b/themes/matery/components/BlogPostCard.js @@ -3,6 +3,7 @@ import Link from 'next/link' import React from 'react' import TagItemMini from './TagItemMini' import CONFIG_MATERY from '../config_matery' +import TwikooCommentCount from '@/components/TwikooCommentCount' // import Image from 'next/image' const BlogPostCard = ({ index, post, showSummary, siteInfo }) => { @@ -14,84 +15,87 @@ const BlogPostCard = ({ index, post, showSummary, siteInfo }) => { const showPageCover = CONFIG_MATERY.POST_LIST_COVER && post?.page_cover const delay = (index % 3) * 300 return ( -
+
- {/* 固定高度 ，空白用图片拉升填充 */} -
+ {/* 固定高度 ，空白用图片拉升填充 */} +
- {/* 头部图片 填充卡片 */} - {showPageCover && ( - -
- {/* eslint-disable-next-line @next/next/no-img-element */} - {post.title} - {post.title} -
- - )} + {/* 头部图片 填充卡片 */} + {showPageCover && ( + +
+ {/* eslint-disable-next-line @next/next/no-img-element */} + {post.title} + {post.title} +
+ + )} - {/* 文字描述 */} -
- {/* 描述 */} -
+ {/* 文字描述 */} +
+ {/* 描述 */} +
- {(!showPreview || showSummary) && post.summary && ( -

- {post.summary} -

- )} + {(!showPreview || showSummary) && post.summary && ( +

+ {post.summary} +

+ )} -
- +
+
+ - - {post.date?.start_date || post.lastEditedTime} + + {post.date?.start_date || post.lastEditedTime} - - + + +
+ - - {post.category} + + {post.category} - -
-
+ +
+
- {post?.tagItems && post?.tagItems.length > 0 && (<> -
-
-
-
- {' '} - {post.tagItems.map(tag => ( - - ))} -
-
-
- )} -
-
+ {post?.tagItems && post?.tagItems.length > 0 && (<> +
+
+
+
+ {' '} + {post.tagItems.map(tag => ( + + ))} +
+
+
+ )} +
+
-
+
) } diff --git a/themes/medium/components/BlogPostCard.js b/themes/medium/components/BlogPostCard.js index 6a031b51..051bd5a3 100644 --- a/themes/medium/components/BlogPostCard.js +++ b/themes/medium/components/BlogPostCard.js @@ -6,6 +6,7 @@ import React from 'react' import CONFIG_MEDIUM from '../config_medium' import CategoryItem from './CategoryItem' import TagItemMini from './TagItemMini' +import TwikooCommentCount from '@/components/TwikooCommentCount' const BlogPostCard = ({ post, showSummary }) => { const showPreview = CONFIG_MEDIUM.POST_LIST_PREVIEW && post.blockMap @@ -43,13 +44,9 @@ const BlogPostCard = ({ post, showSummary }) => { } >
{post.date?.start_date}
- {CONFIG_MEDIUM.POST_LIST_CATEGORY && ( - - )} - {CONFIG_MEDIUM.POST_LIST_TAG && - post?.tagItems?.map(tag => ( - - ))} + {CONFIG_MEDIUM.POST_LIST_CATEGORY && } + {CONFIG_MEDIUM.POST_LIST_TAG && post?.tagItems?.map(tag => )} +
diff --git a/themes/next/LayoutBase.js b/themes/next/LayoutBase.js index 37e7c21f..0f0f535d 100644 --- a/themes/next/LayoutBase.js +++ b/themes/next/LayoutBase.js @@ -8,8 +8,7 @@ import SideAreaLeft from './components/SideAreaLeft' import SideAreaRight from './components/SideAreaRight' import TopNav from './components/TopNav' import { useGlobal } from '@/lib/global' -import PropTypes from 'prop-types' -import React from 'react' +import { useEffect, useRef, useState } from 'react' import CONFIG_NEXT from './config_next' import Live2D from '@/components/Live2D' import BLOG from '@/blog.config' @@ -22,12 +21,13 @@ import BLOG from '@/blog.config' const LayoutBase = (props) => { const { children, headerSlot, meta, sideBarSlot, floatSlot, rightAreaSlot, siteInfo } = props const { onLoading } = useGlobal() - const targetRef = React.useRef(null) - const floatButtonGroup = React.useRef(null) + const targetRef = useRef(null) + const floatButtonGroup = useRef(null) const leftAreaSlot = - const [show, switchShow] = React.useState(false) - const [percent, changePercent] = React.useState(0) // 页面阅读百分比 + const [showRightFloat, switchShow] = useState(false) + const [percent, changePercent] = useState(0) // 页面阅读百分比 + const scrollListener = () => { const targetRef = document.getElementById('wrapper') const clientHeight = targetRef?.clientHeight @@ -37,13 +37,13 @@ const LayoutBase = (props) => { if (per > 100) per = 100 const shouldShow = scrollY > 100 && per > 0 - if (shouldShow !== show) { + if (shouldShow !== showRightFloat) { switchShow(shouldShow) } changePercent(per) } - React.useEffect(() => { + useEffect(() => { // facebook messenger 插件需要调整右下角悬浮按钮的高度 const fb = document.getElementsByClassName('fb-customerchat') if (fb.length === 0) { @@ -54,7 +54,7 @@ const LayoutBase = (props) => { document.addEventListener('scroll', scrollListener) return () => document.removeEventListener('scroll', scrollListener) - }, [show]) + }, [showRightFloat]) return (
@@ -78,7 +78,7 @@ const LayoutBase = (props) => { {/* 右下角悬浮 */}
-
+
@@ -91,8 +91,4 @@ const LayoutBase = (props) => { ) } -LayoutBase.propTypes = { - children: PropTypes.node -} - export default LayoutBase diff --git a/themes/next/components/BlogPostCard.js b/themes/next/components/BlogPostCard.js index c10545a3..97fe08ad 100644 --- a/themes/next/components/BlogPostCard.js +++ b/themes/next/components/BlogPostCard.js @@ -8,6 +8,7 @@ import TagItemMini from './TagItemMini' import CONFIG_NEXT from '../config_next' import NotionPage from '@/components/NotionPage' import NotionIcon from '@/components/NotionIcon' +import TwikooCommentCount from '@/components/TwikooCommentCount' const BlogPostCard = ({ post, showSummary }) => { const { locale } = useGlobal() @@ -31,7 +32,7 @@ const BlogPostCard = ({ post, showSummary }) => {
{post.category && ( @@ -39,7 +40,7 @@ const BlogPostCard = ({ post, showSummary }) => { + className="hover:text-blue-500 dark:hover:text-blue-400 cursor-pointer font-light text-sm hover:underline transform"> {post.category} @@ -48,22 +49,18 @@ const BlogPostCard = ({ post, showSummary }) => { | )} - - - {post.date?.start_date} - - + + {post.date?.start_date} +
-
-
- {' '} + +
{post.tagItems?.map(tag => ( ))} -
diff --git a/themes/simple/components/BlogItem.js b/themes/simple/components/BlogItem.js index 4aa40845..c99092b7 100644 --- a/themes/simple/components/BlogItem.js +++ b/themes/simple/components/BlogItem.js @@ -1,6 +1,7 @@ import BLOG from '@/blog.config' import Link from 'next/link' import CONFIG_SIMPLE from '../config_simple' +import TwikooCommentCount from '@/components/TwikooCommentCount' export const BlogItem = props => { const { post } = props @@ -18,6 +19,7 @@ export const BlogItem = props => {
{BLOG.AUTHOR} - {post.date?.start_date || post.createdTime} + - {post.category && - {post.category}} {post.tags && post.tags?.length > 0 && post.tags.map(t => / {t})}