Feature: Add optional UI setting to skip "Delete all" & "Mark all read" confirmation dialogs(#428)

server/ui-src/App.vue

@@ -3,7 +3,6 @@ import CommonMixins from './mixins/CommonMixins'
 import Favicon from './components/Favicon.vue'
 import Notifications from './components/Notifications.vue'
 import EditTags from './components/EditTags.vue'
-import { RouterView } from 'vue-router'
 import { mailbox } from "./stores/mailbox"
 
 export default {
@@ -16,7 +15,6 @@ export default {
 	},
 
 	beforeMount() {
-
 		// load global config
 		this.get(this.resolve('/api/v1/webui'), false, function (response) {
 			mailbox.uiConfig = response.data

server/ui-src/components/NavMailbox.vue

@@ -83,13 +83,23 @@ export default {
 			</button>
 
 			<template v-if="!mailbox.selected.length">
-				<button class="list-group-item list-group-item-action" data-bs-toggle="modal"
+				<button v-if="mailbox.skipConfirmations" class="list-group-item list-group-item-action"
+					:disabled="!mailbox.unread" @click="markAllRead">
+					<i class="bi bi-eye-fill me-1"></i>
+					Mark all read
+				</button>
+				<button v-else class="list-group-item list-group-item-action" data-bs-toggle="modal"
 					data-bs-target="#MarkAllReadModal" :disabled="!mailbox.unread">
 					<i class="bi bi-eye-fill me-1"></i>
 					Mark all read
 				</button>
 
-				<button class="list-group-item list-group-item-action" data-bs-toggle="modal"
+				<button v-if="mailbox.skipConfirmations" class="list-group-item list-group-item-action"
+					:disabled="!mailbox.total" @click="deleteAllMessages">
+					<i class="bi bi-trash-fill me-1 text-danger"></i>
+					Delete all
+				</button>
+				<button v-else class="list-group-item list-group-item-action" data-bs-toggle="modal"
 					data-bs-target="#DeleteAllModal" :disabled="!mailbox.total">
 					<i class="bi bi-trash-fill me-1 text-danger"></i>
 					Delete all

server/ui-src/components/NavSearch.vue

@@ -68,7 +68,12 @@ export default {
 				</span>
 			</RouterLink>
 			<template v-if="!mailbox.selected.length">
-				<button class="list-group-item list-group-item-action" data-bs-toggle="modal"
+				<button v-if="mailbox.skipConfirmations" class="list-group-item list-group-item-action"
+					@click="deleteAllMessages" :disabled="!mailbox.count">
+					<i class="bi bi-trash-fill me-1 text-danger"></i>
+					Delete all
+				</button>
+				<button v-else class="list-group-item list-group-item-action" data-bs-toggle="modal"
 					data-bs-target="#DeleteAllModal" :disabled="!mailbox.count">
 					<i class="bi bi-trash-fill me-1 text-danger"></i>
 					Delete all

server/ui-src/components/Settings.vue

@@ -32,7 +32,16 @@ export default {
 				this.chaosUpdated = true
 			},
 			deep: true
+		},
+
+		'mailbox.skipConfirmations'(v) {
+			if (v) {
+				localStorage.setItem('skip-confirmations', 'true')
+			} else {
+				localStorage.removeItem('skip-confirmations')
+			}
 		}
+
 	},
 
 	mounted() {
@@ -40,6 +49,8 @@ export default {
 		this.$nextTick(function () {
 			Tags.init('select.tz')
 		})
+
+		mailbox.skipConfirmations = localStorage.getItem('skip-confirmations') ? true : false
 	},
 
 	methods: {
@@ -153,6 +164,16 @@ export default {
 									</label>
 								</div>
 							</div>
+							<div class="mb-3">
+								<div class="form-check form-switch">
+									<input class="form-check-input" type="checkbox" role="switch"
+										id="skip-confirmations" v-model="mailbox.skipConfirmations">
+									<label class="form-check-label" for="skip-confirmations">
+										Skip <code>Delete all</code> &amp; <code>Mark all read</code> confirmation
+										dialogs
+									</label>
+								</div>
+							</div>
 						</div>
 
 						<div class="tab-pane fade" id="chaos-tab-pane" role="tabpanel" aria-labelledby="chaos-tab"

server/ui-src/stores/mailbox.js

@@ -14,8 +14,9 @@ export const mailbox = reactive({
 	searching: false,				// current search, false for none
 	refresh: false, 				// to listen from MessagesMixin
 	autoPaginating: true, 			// allows temporary bypass of loadMessages() via auto-pagination
-	notificationsSupported: false,
-	notificationsEnabled: false,
+	notificationsSupported: false,	// browser supports notifications
+	notificationsEnabled: false,	// user has enabled notifications
+	skipConfirmations: false, 		// skip modal confirmations for "Delete all" & "mark all read"
 	appInfo: {},					// application information
 	uiConfig: {},					// configuration for UI
 	lastMessage: false,				// return scrolling