feat: update (#1975)

rooch-network · Jun 23, 2024 · e050336 · e050336
1 parent f24d3c6
commit e050336
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 46 deletions.
diff --git a/docs/website/components/blog/postHeader.tsx b/docs/website/components/blog/postHeader.tsx
@@ -27,18 +27,18 @@ export default function PostHeader() {
   const [page, setPage] = useState<CustomPage | null>(null)
   const [ogImage, setOgImage] = useState('https://rooch.network/logo/rooch-banner.png')
 
-  useEffect(() => {
-    async function fetchPage() {
-      const pages = (await getPagesUnderRoute('/blog')) as unknown as any[]
-      const customPages = pages.filter(isCustomPage) as CustomPage[]
-      const currentPage = customPages.find((page) => page.route === pathname)
-      if (currentPage) {
-        setPage(currentPage)
-        if (currentPage.frontMatter.image) {
-          setOgImage(`https://rooch.network${currentPage.frontMatter.image}`)
-        }
+  const fetchPage = () => {
+    const pages = getPagesUnderRoute('/blog') as unknown as any[]
+    const customPages = pages.filter(isCustomPage) as CustomPage[]
+    const currentPage = customPages.find((page) => page.route === pathname)
+    if (currentPage) {
+      setPage(currentPage)
+      if (currentPage.frontMatter.image) {
+        setOgImage(`https://rooch.network${currentPage.frontMatter.image}`)
       }
     }
+  }
+  useEffect(() => {
     fetchPage()
   }, [pathname])
 

diff --git a/docs/website/theme.config.tsx b/docs/website/theme.config.tsx
@@ -1,3 +1,4 @@
+import { useEffect, useState } from 'react'
 import { DocsThemeConfig } from 'nextra-theme-docs'
 import { Footer } from './components/layout/footer'
 import Image from 'next/image'
@@ -54,52 +55,53 @@ const theme: DocsThemeConfig = {
   ),
   useNextSeoProps() {
     const { asPath } = useRouter()
-    if (asPath !== '/') {
-      if (asPath.includes('/docs/')) {
-        return {
-          titleTemplate: '%s – Rooch Network Documentation',
-        }
-      }
-      return {
-        titleTemplate: '%s – Rooch Network',
-      }
-    } else {
-      return {
-        titleTemplate: '%s',
-      }
+    return {
+      titleTemplate: asPath.includes('/docs/')
+        ? '%s – Rooch Network Documentation'
+        : '%s – Rooch Network',
     }
   },
   head: function useHead() {
     const { title, frontMatter } = useConfig()
     const { asPath } = useRouter()
     const router = useRouter()
     const currentLang = router.locale
-    let pageTitle = title || 'Rooch Network'
-    let pageDescription = frontMatter.description || ''
-    let ogImage = 'https://rooch.network/logo/rooch-banner.png'
 
-    if (asPath.includes('/blog/')) {
-      const contents = getPagesUnderRoute('/blog') as Content[]
-      const currentPage = contents.find(
-        (content): content is Page => isPage(content) && content.route === asPath,
-      )
-      if (currentPage) {
-        if (currentPage.frontMatter.title) {
-          pageTitle = currentPage.frontMatter.title + ' – Rooch Network'
-        }
-        if (currentPage.frontMatter.description) {
-          pageDescription = currentPage.frontMatter.description
-        }
-        if (currentPage.frontMatter.image) {
-          ogImage = `https://rooch.network${currentPage.frontMatter.image}`
+    const defaultDescription =
+      currentLang === 'en-US'
+        ? 'Unlocking infinite utility for the Bitcoin Economy'
+        : '开启比特币经济的无限可能'
+
+    const [pageTitle, setPageTitle] = useState(title || 'Rooch Network')
+    const [pageDescription, setPageDescription] = useState(frontMatter.description || '')
+    const [ogImage, setOgImage] = useState('https://rooch.network/logo/rooch-banner.png')
+
+    useEffect(() => {
+      if (asPath.includes('/blog/')) {
+        const contents = getPagesUnderRoute('/blog') as Content[]
+        const currentPage = contents.find(
+          (content): content is Page => isPage(content) && content.route === asPath,
+        )
+        if (currentPage) {
+          setPageTitle(
+            currentPage.frontMatter.title
+              ? `${currentPage.frontMatter.title} – Rooch Network`
+              : 'Rooch Network',
+          )
+          setPageDescription(currentPage.frontMatter.description || '')
+          setOgImage(
+            currentPage.frontMatter.image
+              ? `https://rooch.network${currentPage.frontMatter.image}`
+              : 'https://rooch.network/logo/rooch-banner.png',
+          )
+          return
         }
+      } else {
+        setPageTitle(title || 'Rooch Network')
+        setPageDescription(frontMatter.description || defaultDescription)
+        setOgImage('https://rooch.network/logo/rooch-banner.png')
       }
-    } else {
-      pageDescription =
-        currentLang === 'en-US'
-          ? 'Unlocking infinite utility for the Bitcoin Economy'
-          : '开启比特币经济的无限可能'
-    }
+    }, [asPath, title, frontMatter, defaultDescription])
 
     return (
       <>