migrate and fix profileConfig

src/api/user.js

@@ -17,7 +17,8 @@ const CHANGE_EMAIL_URL = '/api/pleroma/change_email'
 const CHANGE_PASSWORD_URL = '/api/pleroma/change_password'
 const MOVE_ACCOUNT_URL = '/api/pleroma/move_account'
 const ALIASES_URL = '/api/pleroma/aliases'
-const NOTIFICATION_SETTINGS_URL = '/api/pleroma/notification_settings'
+const NOTIFICATION_SETTINGS_URL = ({ blockFromStrangers, hideNotificationContents }) =>
+      `/api/pleroma/notification_settings${paramsString({ blockFromStrangers, hideNotificationContents })}`
 export const NOTIFICATION_READ_URL = '/api/v1/pleroma/notifications/read'
 
 const MFA_SETTINGS_URL = '/api/pleroma/accounts/mfa'
@@ -432,10 +433,9 @@ export const exportFriends = ({ id, credentials }) => {
 // #Profile settings
 export const updateNotificationSettings = ({ credentials, settings }) => {
   return promisedRequest({
-    url: NOTIFICATION_SETTINGS_URL,
+    url: NOTIFICATION_SETTINGS_URL(settings),
     credentials,
     method: 'PUT',
-    payload: settings,
   })
 }
 

src/components/follow_requests/follow_requests.js

@@ -1,7 +1,7 @@
-import { useFollowRequestsStore } from 'src/stores/follow_requests.js'
-
 import FollowRequestCard from 'src/components/follow_request_card/follow_request_card.vue'
 
+import { useFollowRequestsStore } from 'src/stores/follow_requests.js'
+
 const FollowRequests = {
   components: {
     FollowRequestCard,

src/components/settings_modal/helpers/setting.js

@@ -9,6 +9,7 @@ import { useInterfaceStore } from 'src/stores/interface.js'
 import { useLocalConfigStore } from 'src/stores/local_config.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useProfileConfigStore } from 'src/stores/profile_config.js'
 
 export default {
   components: {
@@ -236,7 +237,7 @@ export default {
     configSource() {
       switch (this.realSource) {
         case 'profile':
-          return this.$store.state.profileConfig
+          return useProfileConfigStore().config
         case 'admin':
           return useAdminSettingsStore().config
         default:
@@ -253,7 +254,7 @@ export default {
       switch (this.realSource) {
         case 'profile':
           return (k, v) =>
-            this.$store.dispatch('setProfileOption', { name: k, value: v })
+            useProfileConfigStore().setProfileOption({ name: k, value: v })
         case 'admin':
           return (k, v) =>
             useAdminSettingsStore().pushAdminSetting({ path: k, value: v })

src/components/settings_modal/tabs/composing_tab.js

@@ -17,6 +17,7 @@ import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useProfileConfigStore } from 'src/stores/profile_config.js'
 import { useUsersStore } from 'src/stores/users.js'
 
 import { updateProfile } from 'src/api/user.js'
@@ -109,6 +110,9 @@ const ComposingTab = {
     FontControl,
   },
   computed: {
+    defaultScope() {
+      return useProfileConfigStore().config.defaultScope
+    },
     postFormats() {
       return useInstanceCapabilitiesStore().postFormats
     },
@@ -135,7 +139,7 @@ const ComposingTab = {
   },
   methods: {
     changeDefaultScope(value) {
-      this.$store.dispatch('setProfileOption', { name: 'defaultScope', value })
+      useProfileConfigStore().setProfileOption({ name: 'defaultScope', value })
     },
     clearCache(key) {
       clearCache(key)

src/components/settings_modal/tabs/composing_tab.vue

@@ -11,10 +11,10 @@
             <ScopeSelector
               class="scope-selector setting-control"
               :show-all="true"
-              :user-default="$store.state.profileConfig.defaultScope"
-              :initial-scope="$store.state.profileConfig.defaultScope"
-              :on-scope-change="changeDefaultScope"
+              :user-default="defaultScope"
+              :initial-scope="defaultScope"
               :unstyled="false"
+              @change="changeDefaultScope"
             />
           </label>
         </li>

src/modules/index.js

@@ -1,7 +1,5 @@
 import drafts from './drafts.js'
-import profileConfig from './profileConfig.js'
 
 export default {
-  profileConfig,
   drafts,
 }

src/stores/follow_requests.js

@@ -32,6 +32,6 @@ export const useFollowRequestsStore = defineStore('followRequests', {
     },
     remove(id) {
       this.requests.delete(id)
-    }
+    },
   },
 })

src/stores/profile_config.js

@@ -1,34 +1,36 @@
 import { get, set } from 'lodash'
+import { defineStore } from 'pinia'
 
 import { useOAuthStore } from 'src/stores/oauth.js'
 import { useUsersStore } from 'src/stores/users.js'
 
-import { updateNotificationSettings, updateProfile } from 'src/api/user.js'
+import { updateNotificationSettings, updateProfileJSON } from 'src/api/user.js'
 
-const defaultApi = ({ rootState, commit }, { path, value }) => {
+const defaultApi = async ({ path, value }) => {
   const params = {}
   set(params, path, value)
-  return updateProfile({
+
+  return await updateProfileJSON({
     params,
     credentials: useOAuthStore().token,
-  }).then((result) => {
-    useUsersStore().addNewUsers(result)
   })
 }
 
-const notificationsApi = ({ rootState, commit }, { path, value, oldValue }) => {
+const notificationsApi = async ({ path, value, oldValue }) => {
   const settings = {}
   set(settings, path, value)
-  return updateNotificationSettings({
+
+  const result = await updateNotificationSettings({
     settings,
     credentials: useOAuthStore().token,
-  }).then(({ data: result }) => {
-    if (result.status === 'success') {
-      commit('confirmProfileOption', { name, value })
-    } else {
-      commit('confirmProfileOption', { name, value: oldValue })
-    }
   })
+
+  if (result.data.status === 'success') {
+    // a bit of a hack
+    return { ...result, success: true }
+  } else {
+    throw new Error('Failed updating notification settings', result)
+  }
 }
 
 /**
@@ -84,60 +86,65 @@ export const settingsMap = {
   // NotificationSettingsAPIs
   webPushHideContents: {
     get: 'pleroma.notification_settings.hide_notification_contents',
-    set: 'hide_notification_contents',
+    set: 'hideNotificationContents',
     api: notificationsApi,
   },
   blockNotificationsFromStrangers: {
     get: 'pleroma.notification_settings.block_from_strangers',
-    set: 'block_from_strangers',
+    set: 'blockFromStrangers',
     api: notificationsApi,
   },
 }
 
-export const defaultState = Object.fromEntries(
-  Object.keys(settingsMap).map((key) => [key, null]),
-)
+export const defaultState = () => ({
+  config: Object.fromEntries(Object.keys(settingsMap).map((key) => [key, null]))
+})
 
-const profileConfig = {
-  state: { ...defaultState },
-  mutations: {
-    confirmProfileOption(state, { name, value }) {
-      set(state, name, value)
-    },
-    wipeProfileOption(state, { name }) {
-      set(state, name, null)
-    },
-    wipeAllProfileOptions(state) {
-      Object.keys(settingsMap).forEach((key) => {
-        set(state, key, null)
-      })
+export const useProfileConfigStore = defineStore('profileConfig', {
+  state: defaultState,
+  actions: {
+    confirmProfileOption({ name, value }) {
+      set(this.config, name, value)
     },
     // Set the settings based on their path location
-    setCurrentUser(state, user) {
+    async setProfileOption({ name, value }) {
+      const oldValue = get(this, name)
+      const map = settingsMap[name]
+
+      if (!map) throw new Error('Invalid server-side setting')
+      const { set: path = map, api = defaultApi } = map
+      set(this.config, name, null)
+
+      try {
+        const result = await api({ path, value, oldValue })
+        const { success } = result
+        if (success) {
+          set(this.config, name, value)
+          return
+        }
+
+        useUsersStore().addNewUsers(result)
+        this.update(user)
+      } catch (e) {
+        console.warn('Error setting server-side option:', e)
+
+        set(this.config, name, oldValue)
+      }
+    },
+    update(user) {
       Object.entries(settingsMap).forEach((map) => {
         const [name, value] = map
         const { get: path = value } = value
-        set(state, name, get(user._original, path))
+        set(this.config, name, get(user._original, path))
+      })
+    },
+    onLogin(user) {
+      this.update(user)
+    },
+    onLogout() {
+      Object.keys(settingsMap).forEach((key) => {
+        set(this.config, key, null)
       })
     },
   },
-  actions: {
-    setProfileOption({ rootState, state, commit }, { name, value }) {
-      const oldValue = get(state, name)
-      const map = settingsMap[name]
-      if (!map) throw new Error('Invalid server-side setting')
-      const { set: path = map, api = defaultApi } = map
-      commit('wipeProfileOption', { name })
-
-      api({ rootState, commit }, { path, value, oldValue }).catch((e) => {
-        console.warn('Error setting server-side option:', e)
-        commit('confirmProfileOption', { name, value: oldValue })
-      })
-    },
-    logout({ commit }) {
-      commit('wipeAllProfileOptions')
-    },
-  },
-}
-
-export default profileConfig
+})

src/stores/shout.js

@@ -1,6 +1,6 @@
 import { Socket } from 'phoenix'
-
 import { defineStore } from 'pinia'
+
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useUsersStore } from 'src/stores/users.js'
 
@@ -14,7 +14,7 @@ export const useShoutStore = defineStore('shout', {
     socket: null,
   }),
   getters: {
-    token: () => useUsersStore().currentUser?.token
+    token: () => useUsersStore().currentUser?.token,
   },
   actions: {
     initializeSocket() {
@@ -50,6 +50,6 @@ export const useShoutStore = defineStore('shout', {
     disconnectSocket() {
       this.socket?.disconnect()
       this.socket = null
-    }
+    },
   },
 })

src/stores/users.js

@@ -11,13 +11,14 @@ import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useListsStore } from 'src/stores/lists.js'
-import { useShoutStore } from 'src/stores/shout.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useNotificationsStore } from 'src/stores/notifications.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
+import { useShoutStore } from 'src/stores/shout.js'
 import { useStatusesStore } from 'src/stores/statuses.js'
 import { useStreamingStore } from 'src/stores/streaming.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useProfileConfigStore } from 'src/stores/profile_config.js'
 import { useTimelinesStore } from 'src/stores/timelines.js'
 import { useUserHighlightStore } from 'src/stores/user_highlight.js'
 
@@ -142,6 +143,7 @@ export const useUsersStore = defineStore('users', {
 
         if (user.id === this.currentUser?.id) {
           this.currentUser = reactive
+          useProfileConfigStore().update(reactive)
         }
 
         // Initialize some stuff
@@ -648,6 +650,7 @@ export const useUsersStore = defineStore('users', {
                 console.error('Error setting theme', e)
               })
           })
+        useProfileConfigStore().onLogin(user)
 
         useUserHighlightStore().initUserHighlight(user)
 
@@ -780,6 +783,7 @@ export const useUsersStore = defineStore('users', {
 
           Cookies.remove('__Host-pleroma_key', { path: '/' })
           useInterfaceStore().onLogout()
+          useProfileConfigStore().onLogout()
         })
         .catch((e) => {
           useInterfaceStore().pushGlobalNotice({