Sync theme changes to encrypted settings

- Update useTheme to save theme to encrypted storage when changed
- Theme now syncs across devices like other settings
- Prompts signer when changing theme while logged in

Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>

src/hooks/useTheme.ts

@@ -1,5 +1,7 @@
 import { type Theme } from "@/contexts/AppContext";
 import { useAppContext } from "@/hooks/useAppContext";
+import { useEncryptedSettings } from "@/hooks/useEncryptedSettings";
+import { useCurrentUser } from "@/hooks/useCurrentUser";
 
 /**
  * Hook to get and set the active theme
@@ -7,14 +9,22 @@ import { useAppContext } from "@/hooks/useAppContext";
  */
 export function useTheme(): { theme: Theme; setTheme: (theme: Theme) => void } {
   const { config, updateConfig } = useAppContext();
+  const { updateSettings } = useEncryptedSettings();
+  const { user } = useCurrentUser();
 
   return {
     theme: config.theme,
-    setTheme: (theme: Theme) => {
+    setTheme: async (theme: Theme) => {
+      // Update local immediately
       updateConfig((currentConfig) => ({
         ...currentConfig,
         theme,
       }));
+      
+      // Sync to encrypted storage if logged in
+      if (user) {
+        await updateSettings.mutateAsync({ theme });
+      }
     }
   }
 }