fix(problems): 增加时钟更新频率

修复导致计时器显示有时会卡一秒的 bug

src/content/pages/problems/useTimer.ts

@@ -1,12 +1,11 @@
-import { useEffect, useRef, useState } from 'react'
+import { useEffect, useMemo, useRef, useState } from 'react'
 import { logger } from '../../../utils'
 
 const log = logger.child({ prefix: 'useTimer' })
 
 type Time = [house: number, minute: number, second: number]
 
 function formatTime(time: number): Time {
-  time = time / 1000
   const house = Math.floor(time / 3600)
   const minute = Math.floor((time / 60) % 60)
   const second = Math.floor(time % 60)
@@ -27,14 +26,17 @@ type UseTimeReturn = {
 const useTimer = (): UseTimeReturn => {
   const start = useRef(new Date())
   const [isDone, setIsDone] = useState(false)
-  const [time, setTime] = useState(formatTime(0))
+  const [value, setValue] = useState(0)
+  const time = useMemo(() => {
+    return formatTime(value)
+  }, [value])
 
   useEffect(() => {
     let timer: ReturnType<typeof setInterval>
     if (!isDone) {
       timer = setInterval(async () => {
-        setTime(formatTime(new Date().valueOf() - start.current.valueOf()))
-      }, 1000)
+        setValue(Math.floor((Date.now() - start.current.valueOf()) / 1000))
+      }, 100)
     }
 
     return () => {
@@ -48,13 +50,12 @@ const useTimer = (): UseTimeReturn => {
     log.debug('重新开始计时')
     setIsDone(false)
     start.current = new Date()
-    setTime(formatTime(0))
+    setValue(0)
   }
 
-  const done = (time: Time) => {
+  const done = () => {
     log.debug('结束计时')
     setIsDone(true)
-    setTime(time)
   }
 
   return { time, isDone, done, restart }