fix searching

packages/next/pages/post/[...path].tsx

@@ -1,7 +1,7 @@
 import '~/assets/remark42'
 
 import { THEME } from '~/assets/global'
-import { formatDate } from '~/assets/util'
+import TitleDescription from '~/components/TitleDesciption'
 import { IPost, dbPost, initDatabase } from '~/server/db'
 import styles from '~/styles/PostPage.module.css'
 import { GetStaticPaths, GetStaticProps } from 'next'
@@ -18,11 +18,21 @@ const PostPage = (post: IPost) => {
         window.remark42Instance.destroy()
       }
 
-      window.remark42Instance = window.REMARK42.createInstance({
-        node: remark42Ref.current,
-        host: THEME.comment.remark42.host,
-        site_id: THEME.comment.remark42.siteId
-      })
+      const initRemark42 = () => {
+        window.remark42Instance = window.REMARK42.createInstance({
+          node: remark42Ref.current,
+          host: THEME.comment.remark42.host,
+          site_id: THEME.comment.remark42.siteId
+        })
+      }
+
+      if (window.REMARK42) {
+        initRemark42()
+      } else {
+        window.addEventListener('REMARK42::ready', () => {
+          initRemark42()
+        })
+      }
     }
   }, [remark42Ref.current])
 
@@ -53,26 +63,7 @@ const PostPage = (post: IPost) => {
       <section>
         <h2>{post.title}</h2>
 
-        <small>
-          <span>
-            by{' '}
-            {THEME.author.url ? (
-              <a
-                href={THEME.author.url}
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                {THEME.author.name}
-              </a>
-            ) : (
-              <span>{THEME.author.name}</span>
-            )}
-          </span>
-
-          {post.date ? (
-            <span style={{ float: 'right' }}>{formatDate(post.date)}</span>
-          ) : null}
-        </small>
+        <TitleDescription date={post.date} />
       </section>
 
       <section dangerouslySetInnerHTML={{ __html: post.contentHtml }} />
@@ -105,11 +96,9 @@ export const getStaticPaths: GetStaticPaths = async () => {
   await initDatabase()
 
   return {
-    paths: dbPost
-      .find()
-      .map(({ path }) => ({
-        params: { path: path.split(/\//g).map(encodeURIComponent) }
-      })),
+    paths: dbPost.find().map(({ path }) => ({
+      params: { path: path.split(/\//g).map(encodeURIComponent) }
+    })),
     fallback: false
   }
 }