使用cookie管理会话主题，并修复深色主题初始化的BUG

components/DarkModeButton.js

@@ -1,16 +1,17 @@
-import { useTheme } from '@/lib/theme'
-import localStorage from 'localStorage'
+import { loadUserThemeFromCookies, saveTheme, useTheme } from '@/lib/theme'
 
 const DarkModeButton = () => {
-  const { theme, changeTheme } = useTheme()
+  const { changeTheme } = useTheme()
+  const userTheme = loadUserThemeFromCookies()
   // 用户手动设置主题
   const handleChangeDarkMode = () => {
-    const newTheme = (theme === 'light' ? 'dark' : 'light')
-    localStorage.setItem('theme', newTheme)
+    const newTheme = (userTheme === 'light' ? 'dark' : 'light')
+    saveTheme(newTheme)
     changeTheme(newTheme)
   }
   return <div className='z-10 p-1 duration-200 mr-2 h-12 text-xl cursor-pointer dark:text-gray-300 '>
-    <i className={'fa p-2.5 hover:scale-125 transform duration-200 ' + (theme === 'dark' ? 'fa-sun-o' : 'fa-moon-o') } onClick={handleChangeDarkMode} />
+    <i id='darkModeButton' className={'fa p-2.5 hover:scale-125 transform duration-200 ' + (userTheme === 'dark' ? 'fa-sun-o' : 'fa-moon-o')}
+       onClick={handleChangeDarkMode} />
   </div>
 }
 export default DarkModeButton