feat: add reading time calculation to news detail page
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
import htmlParse from 'html-react-parser'
|
||||
import { useReadingTime } from 'react-hook-reading-time'
|
||||
import { useRouteLoaderData } from 'react-router'
|
||||
|
||||
import type { TTagResponse } from '~/apis/common/get-tags'
|
||||
@@ -19,6 +20,8 @@ export const NewsDetailPage = () => {
|
||||
const { title, content, featured_image, slug, author, live_at, tags } =
|
||||
newsDetailData || {}
|
||||
|
||||
const { text } = useReadingTime(content || '')
|
||||
|
||||
return (
|
||||
<div className="sm-max:mx-5 relative">
|
||||
<Card>
|
||||
@@ -45,7 +48,7 @@ export const NewsDetailPage = () => {
|
||||
<p className="flex gap-1 text-sm">
|
||||
<span>{live_at && `${formatDate(live_at)}`}</span>
|
||||
<span>·</span>
|
||||
<span>5 min read</span>
|
||||
<span>{text}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user