Move vuex store to a namespaced vuex store module

Signed-off-by: Jonas <[email protected]>

src/components/Editor.vue

@@ -245,7 +245,9 @@ export default {
 		}
 	},
 	computed: {
-		...mapState(['showAuthorAnnotations']),
+		...mapState({
+			showAuthorAnnotations: (state) => state.text.showAuthorAnnotations,
+		}),
 		isRichWorkspace() {
 			return this.richWorkspace
 		},
@@ -326,9 +328,9 @@ export default {
 		this.close()
 	},
 	methods: {
-		...mapActions({
-			dispatchSetCurrentSession: 'setCurrentSession',
-		}),
+		...mapActions('text', [
+			'setCurrentSession',
+		]),
 
 		updateLastSavedStatus() {
 			if (this.document) {
@@ -478,7 +480,7 @@ export default {
 			this.readOnly = document.readOnly
 			this.lock = this.$syncService.lock
 			localStorage.setItem('nick', this.currentSession.guestName)
-			this.dispatchSetCurrentSession(this.currentSession)
+			this.setCurrentSession(this.currentSession)
 			this.$attachmentResolver = new AttachmentResolver({
 				session: this.currentSession,
 				user: getCurrentUser(),

src/components/Editor/SessionList.vue

@@ -93,7 +93,7 @@ export default {
 	},
 	computed: {
 		...mapState({
-			storeShowAuthorAnnotations: (state) => state.showAuthorAnnotations,
+			storeShowAuthorAnnotations: (state) => state.text.showAuthorAnnotations,
 		}),
 
 		label() {
@@ -104,7 +104,7 @@ export default {
 				return this.storeShowAuthorAnnotations
 			},
 			set(value) {
-				this.dispatchSetShowAuthorAnnotations(value)
+				this.setShowAuthorAnnotations(value)
 			},
 		},
 		participantsPopover() {
@@ -138,9 +138,9 @@ export default {
 	},
 
 	methods: {
-		...mapActions({
-			dispatchSetShowAuthorAnnotations: 'setShowAuthorAnnotations',
-		}),
+		...mapActions('text', [
+			'setShowAuthorAnnotations',
+		]),
 	},
 }
 </script>

src/components/Editor/TableOfContents.vue

@@ -29,7 +29,9 @@ export default {
 		initialRender: true,
 	}),
 	computed: {
-		...mapState(['headings']),
+		...mapState({
+			headings: (state) => state.text.headings,
+		}),
 	},
 	mounted() {
 

src/components/Editor/Wrapper.vue

@@ -87,7 +87,9 @@ export default {
 	}),
 
 	computed: {
-		...mapState(['viewWidth']),
+		...mapState({
+			viewWidth: (state) => state.text.viewWidth,
+		}),
 
 		hasSyncCollission() {
 			return this.syncError && this.syncError.type === ERROR_TYPE.SAVE_COLLISSION

src/nodes/Heading/extractor.js

@@ -1,9 +1,8 @@
-
 import store from '../../store/index.js'
 import { slugify } from './slug.js'
 import { v4 as uuidv4 } from 'uuid'
 
-const setHeadings = (val) => store.dispatch('setHeadings', val)
+const setHeadings = (val) => store.dispatch('text/setHeadings', val)
 
 const extractHeadings = (editor) => {
 	const counter = new Map()

src/store/index.js

@@ -36,8 +36,7 @@ const persistentStorage = getBuilder('text').persist().build()
 
 Vue.use(Vuex)
 
-const store = new Store({
-	plugins: [plugin],
+const textModule = {
 	state: {
 		showAuthorAnnotations: persistentStorage.getItem('showAuthorAnnotations') === 'true',
 		currentSession: persistentStorage.getItem('currentSession'),
@@ -87,6 +86,16 @@ const store = new Store({
 			commit(SET_HEADINGS, value)
 		},
 	},
+}
+
+const store = new Store({
+	plugins: [plugin],
+	modules: {
+		text: {
+			namespaced: true,
+			...textModule,
+		},
+	},
 })
 
 export default store

src/store/plugin.js

@@ -26,7 +26,7 @@ const getClientWidth = () => document.documentElement.clientWidth
 
 const plugin = ({ commit }) => {
 	const onResize = debounce(() => {
-		commit(SET_VIEW_WIDTH, getClientWidth())
+		commit(`text/${SET_VIEW_WIDTH}`, getClientWidth())
 	}, 100)
 
 	window.addEventListener('resize', onResize)