refactor: 进一步封装useColorScheme

将解析函数内聚到hooks里面

shared/contexts/ColorSchemeContext.tsx

@@ -1,5 +1,6 @@
 import React, { useContext } from 'react';
 import { useStorage } from 'tailchat-shared';
+import { parseColorScheme } from '../../web/src/utils/color-scheme-helper';
 
 const ColorSchemeContext = React.createContext<{
   /**
@@ -28,5 +29,8 @@ export const ColorSchemeContextProvider: React.FC = React.memo((props) => {
 ColorSchemeContextProvider.displayName = 'ColorSchemeContextProvider';
 
 export function useColorScheme() {
-  return useContext(ColorSchemeContext);
+  const { colorScheme, setColorScheme } = useContext(ColorSchemeContext);
+  const { isDarkMode, extraSchemeName } = parseColorScheme(colorScheme);
+
+  return { colorScheme, setColorScheme, isDarkMode, extraSchemeName };
 }

web/src/App.tsx

@@ -34,8 +34,7 @@ const AppProvider: React.FC = React.memo((props) => {
 AppProvider.displayName = 'AppProvider';
 
 const AppContainer: React.FC = React.memo((props) => {
-  const { colorScheme } = useColorScheme();
-  const { isDarkMode, extraSchemeName } = parseColorScheme(colorScheme);
+  const { isDarkMode, extraSchemeName } = useColorScheme();
 
   return (
     <div