Show less notifications in data model

app/src/lang/en-US/index.json

@@ -26,6 +26,8 @@
 	"delete_bookmark": "Delete Bookmark",
 	"delete_bookmark_copy": "Are you sure you want to delete the \"{bookmark}\" bookmark? This action cannot be undone.",
 
+	"field_order_updated": "Fields Reordered",
+
 	"logoutReason": {
 		"SIGN_OUT": "Signed out",
 		"SESSION_EXPIRED": "Session expired"
@@ -83,12 +85,12 @@
 	"show_field_on_detail": "Show Field on Detail",
 	"delete_field": "Delete Field",
 	"fields_and_layout": "Fields & Layout",
-	"field_create_success": "Field '{field}' created",
-	"field_update_success": "Field '{field}' updated",
-	"field_delete_success": "Field '{field}' deleted",
-	"field_create_failure": "Could not create '{field}'",
-	"field_update_failure": "Could not update '{field}'",
-	"field_delete_failure": "Could not delete '{field}'",
+	"field_create_success": "Field \"{field}\" created",
+	"field_update_success": "Field \"{field}\" updated",
+	"field_delete_success": "Field \"{field}\" deleted",
+	"field_create_failure": "Could not create \"{field}\"",
+	"field_update_failure": "Could not update \"{field}\"",
+	"field_delete_failure": "Could not delete \"{field}\"",
 	"fields_update_success": "Fields updated",
 	"fields_update_failure": "Could not update fields",
 	"duplicate_where_to": "Where would you like to duplicate this field to?",

app/src/modules/settings/routes/data-model/field-detail/field-detail.vue

@@ -71,6 +71,7 @@ import { useFieldsStore, useRelationsStore } from '@/stores/';
 import { Field } from '@/types';
 import router from '@/router';
 import useCollection from '@/composables/use-collection';
+import notify from '@/utils/notify';
 
 import { initLocalStore, state, clearLocalStore } from './store';
 
@@ -241,6 +242,19 @@ export default defineComponent({
 
 				await fieldsStore.hydrate();
 				await relationsStore.hydrate();
+
+				if (props.field !== '+') {
+					notify({
+						title: i18n.t('field_update_success', { field: props.field }),
+						type: 'success',
+					});
+				} else {
+					notify({
+						title: i18n.t('field_create_success', { field: state.fieldData.field }),
+						type: 'success',
+					});
+				}
+
 				router.push(`/settings/data-model/${props.collection}`);
 				clearLocalStore();
 			} catch (error) {

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

@@ -103,11 +103,15 @@
 			<v-card class="duplicate">
 				<v-card-title>{{ $t('duplicate_where_to') }}</v-card-title>
 				<v-card-text>
-					<span class="type-label">{{ $tc('collection', 0) }}</span>
-					<v-select class="monospace" :items="collections" v-model="duplicateTo" />
+					<div class="duplicate-field">
+						<span class="type-label">{{ $tc('collection', 0) }}</span>
+						<v-select class="monospace" :items="collections" v-model="duplicateTo" />
+					</div>
 
-					<span class="type-label">{{ $tc('field', 0) }}</span>
-					<v-input class="monospace" v-model="duplicateName" />
+					<div class="duplicate-field">
+						<span class="type-label">{{ $tc('field', 0) }}</span>
+						<v-input class="monospace" v-model="duplicateName" />
+					</div>
 				</v-card-text>
 				<v-card-actions>
 					<v-button secondary @click="duplicateActive = false">
@@ -138,6 +142,8 @@ import { Field } from '@/types';
 import { useCollectionsStore, useFieldsStore } from '@/stores/';
 import { getInterfaces } from '@/interfaces';
 import router from '@/router';
+import notify from '@/utils/notify';
+import { i18n } from '@/lang';
 
 export default defineComponent({
 	props: {
@@ -245,6 +251,12 @@ export default defineComponent({
 
 				try {
 					await fieldsStore.createField(duplicateTo.value, newField);
+
+					notify({
+						title: i18n.t('field_create_success', { field: newField.name }),
+						type: 'success',
+					});
+
 					duplicateActive.value = false;
 				} catch (error) {
 					console.log(error);
@@ -304,11 +316,11 @@ export default defineComponent({
 }
 
 .duplicate {
-	.text-label {
+	.type-label {
 		margin-bottom: 4px;
 	}
 
-	.v-select {
+	.duplicate-field + .duplicate-field {
 		margin-bottom: 32px;
 	}
 }

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

@@ -140,7 +140,7 @@ export default defineComponent({
 			addOptions,
 		};
 
-		function setSort(fields: Field[]) {
+		async function setSort(fields: Field[]) {
 			const updates = fields.map((field, index) => ({
 				field: field.field,
 				meta: {
@@ -148,7 +148,7 @@ export default defineComponent({
 				},
 			}));
 
-			fieldsStore.updateFields(collection.value, updates);
+			await fieldsStore.updateFields(collection.value, updates);
 		}
 	},
 });

app/src/stores/fields.ts

@@ -4,7 +4,6 @@ import VueI18n from 'vue-i18n';
 import { notEmpty } from '@/utils/is-empty/';
 import { i18n } from '@/lang';
 import formatTitle from '@directus/format-title';
-import notify from '@/utils/notify';
 import { useRelationsStore } from '@/stores/';
 import { Relation, FieldRaw, Field } from '@/types';
 import { merge } from 'lodash';
@@ -111,24 +110,18 @@ export const useFieldsStore = createStore({
 			try {
 				const response = await api.post(`/fields/${collectionKey}`, newField);
 
+				const field = this.parseField(response.data.data);
+
 				this.state.fields = this.state.fields.map((field) => {
 					if (field.collection === collectionKey && field.field === newField.field) {
-						return this.parseField(response.data.data);
+						return field;
 					}
 
 					return field;
 				});
 
-				notify({
-					title: i18n.t('field_create_success', { field: newField.field }),
-					type: 'success',
-				});
+				return field;
 			} catch (error) {
-				notify({
-					title: i18n.t('field_create_failure', { field: newField.field }),
-					type: 'error',
-				});
-
 				// reset the changes if the api sync failed
 				this.state.fields = stateClone;
 				throw error;
@@ -158,17 +151,7 @@ export const useFieldsStore = createStore({
 
 					return field;
 				});
-
-				notify({
-					title: i18n.t('field_update_success', { field: fieldKey }),
-					type: 'success',
-				});
 			} catch (error) {
-				notify({
-					title: i18n.t('field_update_failure', { field: fieldKey }),
-					type: 'error',
-				});
-
 				// reset the changes if the api sync failed
 				this.state.fields = stateClone;
 				throw error;
@@ -210,18 +193,7 @@ export const useFieldsStore = createStore({
 						return field;
 					});
 				}
-
-				notify({
-					title: i18n.t('fields_update_success'),
-					text: updates.map(({ field }) => field).join(', '),
-					type: 'success',
-				});
 			} catch (error) {
-				notify({
-					title: i18n.t('fields_update_failed'),
-					text: updates.map(({ field }) => field).join(', '),
-					type: 'error',
-				});
 				// reset the changes if the api sync failed
 				this.state.fields = stateClone;
 				throw error;
@@ -237,16 +209,7 @@ export const useFieldsStore = createStore({
 
 			try {
 				await api.delete(`/fields/${collectionKey}/${fieldKey}`);
-
-				notify({
-					title: i18n.t('field_delete_success', { field: fieldKey }),
-					type: 'success',
-				});
 			} catch (error) {
-				notify({
-					title: i18n.t('field_delete_failure', { field: fieldKey }),
-					type: 'error',
-				});
 				this.state.fields = stateClone;
 				throw error;
 			}