Add encrypted settings sync on login with stale-while-revalidate

- NostrSync now loads encrypted settings from Nostr on login
- Settings sync to local AppContext (theme, feedSettings, useAppRelays)
- Use 5-minute staleTime for fresh page loads to pick up changes
- Settings refetch automatically after 5 minutes on new page load
- No expensive real-time subscriptions - just periodic refresh

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

src/components/NostrSync.tsx

@@ -2,6 +2,7 @@ import { useEffect } from 'react';
 import { useNostr } from '@nostrify/react';
 import { useCurrentUser } from '@/hooks/useCurrentUser';
 import { useAppContext } from '@/hooks/useAppContext';
+import { useEncryptedSettings } from '@/hooks/useEncryptedSettings';
 
 /**
  * NostrSync - Syncs user's Nostr data
@@ -9,11 +10,13 @@ import { useAppContext } from '@/hooks/useAppContext';
  * This component runs globally to sync various Nostr data when the user logs in.
  * Currently syncs:
  * - NIP-65 relay list (kind 10002)
+ * - Encrypted app settings (kind 30078) - theme, feed settings, relay toggle
  */
 export function NostrSync() {
   const { nostr } = useNostr();
   const { user } = useCurrentUser();
   const { config, updateConfig } = useAppContext();
+  const { settings: encryptedSettings, isLoading: settingsLoading } = useEncryptedSettings();
 
   useEffect(() => {
     if (!user) return;
@@ -58,5 +61,37 @@ export function NostrSync() {
     syncRelaysFromNostr();
   }, [user, config.relayMetadata.updatedAt, nostr, updateConfig]);
 
+  // Sync encrypted settings from Nostr on login
+  useEffect(() => {
+    if (!user || settingsLoading || !encryptedSettings) return;
+
+    console.log('Syncing encrypted settings from Nostr:', encryptedSettings);
+
+    // Update local config with encrypted settings if they exist
+    updateConfig((current) => {
+      const updates: any = { ...current };
+
+      // Sync theme if available
+      if (encryptedSettings.theme && encryptedSettings.theme !== current.theme) {
+        updates.theme = encryptedSettings.theme;
+      }
+
+      // Sync useAppRelays if available
+      if (encryptedSettings.useAppRelays !== undefined && encryptedSettings.useAppRelays !== current.useAppRelays) {
+        updates.useAppRelays = encryptedSettings.useAppRelays;
+      }
+
+      // Sync feedSettings if available
+      if (encryptedSettings.feedSettings) {
+        updates.feedSettings = {
+          ...current.feedSettings,
+          ...encryptedSettings.feedSettings,
+        };
+      }
+
+      return updates;
+    });
+  }, [user, encryptedSettings, settingsLoading, updateConfig]);
+
   return null;
 }

src/hooks/useEncryptedSettings.ts

@@ -54,7 +54,8 @@ export function useEncryptedSettings() {
       return events[0];
     },
     enabled: !!user,
-    staleTime: 30000, // 30 seconds
+    staleTime: 5 * 60 * 1000, // 5 minutes - refetch on page load after this
+    gcTime: 30 * 60 * 1000, // 30 minutes - keep in cache
   });
 
   // Parse settings from encrypted content
@@ -79,7 +80,7 @@ export function useEncryptedSettings() {
       }
     },
     enabled: !!query.data && !!user,
-    staleTime: 30000,
+    staleTime: 5 * 60 * 1000, // 5 minutes
   });
 
   // Update settings