work on local-only settings

src/components/settings_modal/helpers/setting.js

@@ -7,6 +7,7 @@ import ProfileSettingIndicator from './profile_setting_indicator.vue'
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useSyncConfigStore } from 'src/stores/sync_config.js'
+import { useLocalConfigStore } from 'src/stores/local_config.js'
 
 export default {
   components: {

src/components/settings_modal/tabs/general_tab.vue

@@ -44,6 +44,7 @@
             :units="['px', 'rem']"
             :reset-default="{ 'px': 14, 'rem': 1 }"
             timed-apply-mode
+            :local="true"
           >
             {{ $t('settings.text_size') }}
           </UnitSetting>

src/lib/style.js

@@ -1,27 +1,39 @@
 import { applyStyleConfig } from 'src/services/style_setter/style_setter.js'
+import { useSyncConfigStore } from 'src/stores/sync_config.js'
 
-const APPEARANCE_SETTINGS_KEYS = new Set(
-  [
-    'sidebarColumnWidth',
-    'contentColumnWidth',
-    'notifsColumnWidth',
-    'themeEditorMinWidth',
-    'textSize',
-    'navbarSize',
-    'panelHeaderSize',
-    'forcedRoundness',
-    'emojiSize',
-    'emojiReactionsScale',
-  ].map((x) => 'simple.' + x),
-)
+const ACTIONS = new Set([
+  'setPreference',
+  'unsetPreference',
+  'set',
+  'unset',
+  'setTemporarily',
+  'unsetTemporarily',
+])
+
+const APPEARANCE_SETTINGS_KEYS = [
+  'sidebarColumnWidth',
+  'contentColumnWidth',
+  'notifsColumnWidth',
+  'themeEditorMinWidth',
+  'textSize',
+  'navbarSize',
+  'panelHeaderSize',
+  'forcedRoundness',
+  'emojiSize',
+  'emojiReactionsScale',
+]
+const MIXED_KEYS = new Set([
+  ...APPEARANCE_SETTINGS_KEYS,
+  ...APPEARANCE_SETTINGS_KEYS.map((x) => 'simple.' + x),
+])
 
 export const piniaStylePlugin = ({ store, options }) => {
-  if (store.$id === 'sync_config') {
+  if (store.$id === 'sync_config' || store.$id === 'local_config') {
     store.$onAction(({ name, args, after }) => {
-      if (name === 'setPreference') {
+      if (ACTIONS.has(name)) {
         const { path } = args[0]
-        if (APPEARANCE_SETTINGS_KEYS.has(path)) {
-          after(() => applyStyleConfig(store.mergedConfig))
+        if (MIXED_KEYS.has(path)) {
+          after(() => applyStyleConfig(useSyncConfigStore().mergedConfig))
         }
       }
     })

src/stores/interface.js

@@ -66,7 +66,7 @@ export const useInterfaceStore = defineStore('interface', {
       this.temporaryChangesConfirm = confirm
       this.temporaryChangesRevert = revert
       const countdownFunc = () => {
-        if (this.temporaryChangesCountdown === 1) {
+        if (this.temporaryChangesCountdown <= 1) {
           this.temporaryChangesRevert()
           this.clearTemporaryChanges()
         } else {

src/stores/local_config.js

@@ -39,18 +39,6 @@ export const useLocalConfigStore = defineStore('local_config', {
       })
     },
   },
-  getters: {
-    mergedConfig: (state) => {
-      const instancePrefs = useInstanceStore().prefsStorage
-      const result = Object.fromEntries(
-        Object.entries(state.prefsStorage).map(([k, v]) => [
-          k,
-          state.tempStorage[k] ?? v ?? instancePrefs[k],
-        ]),
-      )
-      return result
-    },
-  },
   persist: {
     afterLoad(state) {
       return {

src/stores/sync_config.js

@@ -691,10 +691,11 @@ export const useSyncConfigStore = defineStore('sync_config', {
     mergedConfig: (state) => {
       const instancePrefs = useInstanceStore().prefsStorage
       const localPrefs = useLocalConfigStore().prefsStorage
+      const tempPrefs = useLocalConfigStore().tempStorage
       const result = Object.fromEntries(
         Object.entries(state.prefsStorage.simple).map(([k, v]) => [
           k,
-          localPrefs[k] ?? v ?? instancePrefs[k],
+          tempPrefs[k] ?? localPrefs[k] ?? v ?? instancePrefs[k],
         ]),
       )
       return result