update

store/index.ts

@@ -1,11 +1,19 @@
 import { actionTree, getAccessorType, mutationTree } from 'typed-vuex'
 import { api } from '~/assets/api'
+import { jsonClone } from '~/assets/util'
+
+const TAB_SETTINGS = 'TABS_SETTINGS'
 
 interface ISettings {
   level: number | null
   levelMin: number | null
-  sentenceMin: number | null
-  sentenceMax: number | null
+}
+
+interface ITab {
+  title: string
+  component: string
+  permanent?: boolean
+  query: Record<string, string>
 }
 
 export const state = () => ({
@@ -16,12 +24,7 @@ export const state = () => ({
     sentenceMax: null,
   } as ISettings,
   isApp: false,
-  tabs: [] as {
-    title: string
-    component: string
-    permanent?: boolean
-    query: Record<string, string>
-  }[],
+  tabs: [] as ITab[],
   activeTab: 0,
   identifier: '',
 })
@@ -33,9 +36,26 @@ export const mutations = mutationTree(state, {
   SET_IS_APP(state, isApp: boolean) {
     state.isApp = isApp
   },
+  SET_ALL_TABS(
+    state,
+    o: {
+      tabs: ITab[]
+      activeTab: number
+    } = state
+  ) {
+    localStorage.setItem(
+      TAB_SETTINGS,
+      JSON.stringify({
+        tabs: o.tabs,
+        activeTabs: o.activeTab,
+      })
+    )
+    state.tabs = jsonClone(o.tabs)
+    state.activeTab = jsonClone(o.activeTab)
+  },
   SET_TAB_TITLE(state, { i, title }: { i: number; title: string }) {
     state.tabs[i].title = title
-    state.tabs = JSON.parse(JSON.stringify(state.tabs))
+    this.SET_ALL_TABS(state)
   },
   ADD_TAB(
     state,
@@ -70,6 +90,7 @@ export const mutations = mutationTree(state, {
     }
 
     state.activeTab = state.tabs.length - 1
+    this.SET_ALL_TABS(state)
   },
   DELETE_TAB(state, { i }: { i: number }) {
     state.tabs.splice(i, 1)
@@ -78,16 +99,15 @@ export const mutations = mutationTree(state, {
       state.activeTab = state.tabs.length - 1
     }
 
-    state.tabs = JSON.parse(JSON.stringify(state.tabs))
+    this.SET_ALL_TABS(state)
   },
   SET_TAB_COMPONENT(state, { i, component }: { i: number; component: string }) {
     state.tabs[i].component = component
-
-    state.tabs = JSON.parse(JSON.stringify(state.tabs))
-    state.activeTab = i
+    this.SET_ALL_TABS(state)
   },
   SET_TAB_CURRENT(state, { i }: { i: number }) {
     state.activeTab = i
+    this.SET_ALL_TABS(state)
   },
   SET_IDENTIFIER(state, name: string) {
     state.identifier = name
@@ -97,8 +117,16 @@ export const mutations = mutationTree(state, {
 export const actions = actionTree(
   { state, mutations },
   {
+    async nuxtServerInit({ dispatch, commit }) {
+      await dispatch('updateSetings')
+
+      const settings = localStorage.getItem(TAB_SETTINGS)
+      if (settings) commit('SET_ALL_TABS', JSON.parse(settings))
+    },
     async updateSettings({ commit }) {
-      const r = await api.user_getSettings()
+      const r = await api.user_getSettings({
+        select: ['identifier', 'levelMin', 'level'],
+      })
       commit('SET_IS_APP', !!r)
       commit('SET_IDENTIFIER', r?.identifier || '')
 
@@ -115,8 +143,6 @@ export const actions = actionTree(
       commit('SET_SETTINGS', {
         level: r?.level || null,
         levelMin: r?.levelMin || null,
-        sentenceMin: null,
-        sentenceMax: null,
       })
     },
   }