fixup! Show full width list for mail

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

Author: GretaD

src/components/AppSettingsMenu.vue

@@ -5,26 +5,18 @@
 			:show-navigation="true"
 			:open.sync="showSettings">
 			<NcAppSettingsSection id="mail-list-view" :name="t('mail', 'Full width view')">
-				<NcActionRadio value="full-view"
+				<NcActionRadio value="!getter"
 					:checked="fullView"
-					@change="showFullWidth('full-view') ">
+					@change="toggleFullWidthLayout(true) ">
 					<template #icon>
 						<CompactMode :size="20" />
 					</template>
 					{{ t('mail', 'Show full mode') }}
 				</NcActionRadio>
 				{{ viewType }}
-				<NcActionRadio value="up-bottom"
-					:checked="viewType === 'up-bottom'"
-					@change="showFullWidth('up-bottom') ">
-					<template #icon>
-						<CompactMode :size="20" />
-					</template>
-					{{ t('mail', 'Show Up-Bottom view') }}
-				</NcActionRadio>
-				<NcActionRadio value="default-view"
+				<NcActionRadio value="we need geter true here"
 					:checked="defaultView"
-					@change="showFullWidth('default-view') ">
+					@change="toggleFullWidthLayout('default-view') ">
 					<template #icon>
 						<CompactMode :size="20" />
 					</template>
@@ -239,6 +231,7 @@ import IconLock from 'vue-material-design-icons/Lock.vue'
 import Logger from '../logger.js'
 import SmimeCertificateModal from './smime/SmimeCertificateModal.vue'
 import TrustedSenders from './TrustedSenders.vue'
+import { mapGetters } from 'vuex'
 
 export default {
 	name: 'AppSettingsMenu',
@@ -283,6 +276,9 @@ export default {
 		}
 	},
 	computed: {
+		...mapGetters({
+			layoutMode: 'getLayout',
+		}),
 		searchPriorityBody() {
 			return this.$store.getters.getPreference('search-priority-body', 'false') === 'true'
 		},
@@ -318,8 +314,10 @@ export default {
 		this.sortOrder = this.$store.getters.getPreference('sort-order', 'newest')
 	},
 	methods: {
-		showFullWidth(value) {
-			this.viewType = value
+		toggleFullWidthLayout(value) {
+			this.$store.dispatch('toggleFullWidthLayoutAction', {
+				value,
+			})
 		},
 		async onOpen() {
 			this.showSettings = true

src/store/actions.js

@@ -1499,4 +1499,13 @@ export default {
 			},
 		})
 	},
+	async toggleFullWidthLayoutAction({ commit }, value) {
+		try {
+			commit('toggleFullWidthLayout', {
+				value,
+			})
+		} catch (error) {
+			logger.error('Could not switch layout', { error })
+		}
+	},
 }

src/store/getters.js

@@ -155,4 +155,5 @@ export const getters = {
 	getInbox: (state, getters) => (accountId) => {
 		return getters.findMailboxBySpecialRole(accountId, 'inbox')
 	},
+	getLayout: (state) => state?.fullWidthLayout,
 }

src/store/mutations.js

@@ -506,4 +506,7 @@ export default {
 	addSmimeCertificate(state, { certificate }) {
 		state.smimeCertificates = [...state.smimeCertificates, certificate]
 	},
+	toggleFullWidthLayout(state, { value }) {
+		state.fullWidthLayout = value
+	},
 }