feat: show comment time

Author: pacexy

src/App.css

@@ -89,3 +89,8 @@
   font-size: 14px;
   color: var(--text1);
 }
+
+#comment-search-root .comment-item-time {
+  color: var(--text3);
+  margin-top: 4px;
+}

src/App.tsx

@@ -1,7 +1,7 @@
 import { useRef, useState } from 'react'
 import { fetchComments } from './api'
 import { Reply } from './reply'
-import { extractVideoId } from './utils'
+import { extractVideoId, formatDateTime } from './utils'
 
 import './App.css'
 
@@ -81,6 +81,9 @@ const CommentTree: React.FC<CommentProps> = ({ comments, sub = false }) => {
             <span className='comment-item-message'>
               {comment.content.message}
             </span>
+            <div className='comment-item-time'>
+              {formatDateTime(comment.ctime)}
+            </div>
             <CommentTree comments={comment.replies} sub />
           </div>
         </li>

src/utils.ts

@@ -20,3 +20,15 @@ export function extractVideoId(url: string) {
   }
   return match[1]
 }
+
+export function formatDateTime(ts: number) {
+  const date = new Date(ts * 1000)
+  return date.toLocaleString('zh-CN', {
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit',
+    hour: '2-digit',
+    minute: '2-digit',
+    hour12: false,
+  })
+}