loads in settings. doesnt dynamically update

Author: fatfingers23

app/components/Header/AuthModal.client.vue

@@ -5,6 +5,22 @@ import { authRedirect } from '~/utils/atproto/helpers'
 const handleInput = shallowRef('')
 const route = useRoute()
 const { user, logout } = useAtproto()
+const { settings } = useSettings()
+
+// TODO probably need to work out some kind of hashing so it doesnt get -> post
+// TODO also need to figure out how to sync things like locale and theme
+watch(
+  user,
+  async loggedInUser => {
+    if (!loggedInUser) return
+
+    const remote = await $fetch('/api/auth/settings')
+    if (remote) {
+      Object.assign(settings.value, remote)
+    }
+  },
+  { immediate: true },
+)
 
 // https://atproto.com supports 4 locales as of 2026-02-07
 const { locale } = useI18n()

app/pages/settings.vue

@@ -5,6 +5,7 @@ const { settings } = useSettings()
 const { locale, locales, setLocale: setNuxti18nLocale } = useI18n()
 const colorMode = useColorMode()
 const { currentLocaleStatus, isSourceLocale } = useI18nStatus()
+const { user } = useAtproto()
 
 // Escape to go back (but not when focused on form elements or modal is open)
 onKeyStroke(
@@ -34,7 +35,11 @@ defineOgImageComponent('Default', {
   primaryColor: '#60a5fa',
 })
 
-watch(settings.value, syncSettings)
+watch(settings.value, async () => {
+  if (!user.value) return
+
+  await syncSettings(settings.value)
+})
 
 const setLocale: typeof setNuxti18nLocale = locale => {
   settings.value.selectedLocale = locale

server/api/auth/settings.get.ts

@@ -1,3 +1,10 @@
-//Want to check the cooki login state, can be slightly more laxed?
-//
-export default defineEventHandler(async _ => {})
+import type { AppSettings } from '#shared/schemas/app-settings'
+
+export default defineEventHandler(async event => {
+  // Current thinking is reads can just be a normal event handler and writes use the oauth
+  const serverSession = await useServerSession(event)
+
+  const storage = useStorage('atproto:generic')
+  const storageKey = `settings:${serverSession.data.public.did}`
+  return storage.getItem<AppSettings>(storageKey)
+})