Add save and delete shortcuts (#8108)

* add save and delete shortcuts

* Remove delete shortcuts

Co-authored-by: rijkvanzanten <rijkvanzanten@me.com>

app/src/modules/settings/routes/data-model/fields/fields.vue

@@ -106,6 +106,7 @@ import FieldsManagement from './components/fields-management.vue';
 import useItem from '@/composables/use-item';
 import { useRouter, onBeforeRouteUpdate, onBeforeRouteLeave, NavigationGuard } from 'vue-router';
 import { useCollectionsStore, useFieldsStore } from '@/stores';
+import useShortcut from '@/composables/use-shortcut';
 import unsavedChanges from '@/composables/unsaved-changes';
 
 export default defineComponent({
@@ -143,6 +144,10 @@ export default defineComponent({
 
 		const hasEdits = computed<boolean>(() => Object.keys(edits.value).length > 0);
 
+		useShortcut('meta+s', () => {
+			if (hasEdits.value) saveAndStay();
+		});
+
 		const confirmDelete = ref(false);
 
 		const isSavable = computed(() => {
@@ -197,6 +202,12 @@ export default defineComponent({
 			router.push(`/settings/data-model`);
 		}
 
+		async function saveAndStay() {
+			await save();
+			await collectionsStore.hydrate();
+			await fieldsStore.hydrate();
+		}
+
 		async function saveAndQuit() {
 			await save();
 			await collectionsStore.hydrate();

app/src/modules/settings/routes/presets/item.vue

@@ -142,6 +142,7 @@ import { getLayouts } from '@/layouts';
 import { useRouter, onBeforeRouteUpdate, onBeforeRouteLeave, NavigationGuard } from 'vue-router';
 import { unexpectedError } from '@/utils/unexpected-error';
 import { useLayout } from '@/composables/use-layout';
+import useShortcut from '@/composables/use-shortcut';
 import unsavedChanges from '@/composables/unsaved-changes';
 
 type FormattedPreset = {
@@ -198,6 +199,10 @@ export default defineComponent({
 
 		const { layoutWrapper } = useLayout(layout);
 
+		useShortcut('meta+s', () => {
+			if (hasEdits.value) save();
+		});
+
 		const isSavable = computed(() => {
 			if (hasEdits.value === true) return true;
 			return hasEdits.value;

app/src/modules/settings/routes/project/project.vue

@@ -48,6 +48,7 @@ import { useCollection } from '@directus/shared/composables';
 import { useSettingsStore, useServerStore } from '@/stores';
 import ProjectInfoSidebarDetail from './components/project-info-sidebar-detail.vue';
 import { clone } from 'lodash';
+import useShortcut from '@/composables/use-shortcut';
 import unsavedChanges from '@/composables/unsaved-changes';
 import { useRouter, onBeforeRouteUpdate, onBeforeRouteLeave, NavigationGuard } from 'vue-router';
 
@@ -71,6 +72,10 @@ export default defineComponent({
 
 		const saving = ref(false);
 
+		useShortcut('meta+s', () => {
+			if (!noEdits.value) save();
+		});
+
 		const isSavable = computed(() => {
 			if (noEdits.value === true) return false;
 			return noEdits.value;

app/src/modules/settings/routes/roles/item/item.vue

@@ -112,6 +112,7 @@ import { useUserStore } from '@/stores/';
 import RoleInfoSidebarDetail from './components/role-info-sidebar-detail.vue';
 import PermissionsOverview from './components/permissions-overview.vue';
 import UsersInvite from '@/views/private/components/users-invite';
+import useShortcut from '@/composables/use-shortcut';
 import unsavedChanges from '@/composables/unsaved-changes';
 
 export default defineComponent({
@@ -163,6 +164,10 @@ export default defineComponent({
 			return !!values.app_access;
 		});
 
+		useShortcut('meta+s', () => {
+			if (hasEdits.value) saveAndStay();
+		});
+
 		const isSavable = computed(() => {
 			if (hasEdits.value === true) return true;
 			return hasEdits.value;
@@ -212,6 +217,11 @@ export default defineComponent({
 		 * in case we're changing the current user's role
 		 */
 
+		async function saveAndStay() {
+			await save();
+			await userStore.hydrate();
+		}
+
 		async function saveAndQuit() {
 			await save();
 			await userStore.hydrate();

app/src/modules/settings/routes/webhooks/item.vue

@@ -89,6 +89,7 @@ import { useRouter, onBeforeRouteUpdate, onBeforeRouteLeave, NavigationGuard } f
 import RevisionsDrawerDetail from '@/views/private/components/revisions-drawer-detail';
 import useItem from '@/composables/use-item';
 import SaveOptions from '@/views/private/components/save-options';
+import useShortcut from '@/composables/use-shortcut';
 import unsavedChanges from '@/composables/unsaved-changes';
 
 export default defineComponent({
@@ -131,6 +132,14 @@ export default defineComponent({
 			return item.value?.name;
 		});
 
+		useShortcut('meta+s', () => {
+			if (hasEdits.value) saveAndStay();
+		});
+
+		useShortcut('meta+shift+s', () => {
+			if (hasEdits.value) saveAndAddNew();
+		});
+
 		const isSavable = computed(() => {
 			if (hasEdits.value === true) return true;
 			return hasEdits.value;