diff --git a/resources/js/components/forms/button/LoadingButton.vue b/resources/js/components/forms/button/LoadingButton.vue
index af8d7cf44..ad50eaca6 100644
--- a/resources/js/components/forms/button/LoadingButton.vue
+++ b/resources/js/components/forms/button/LoadingButton.vue
@@ -2,7 +2,7 @@
     <button
         class="btn"
         role="button"
-        :disabled="loading"
+        :disabled="loading || disabled"
     >
         <span
             v-if="loading"
@@ -26,6 +26,10 @@
                 type: Boolean,
                 required: true,
             },
+            disabled: {
+                type: Boolean,
+                default: false,
+            }
         },
     };
 </script>
\ No newline at end of file
diff --git a/resources/js/components/modals/ConfirmModal.vue b/resources/js/components/modals/ConfirmModal.vue
new file mode 100644
index 000000000..dc219c5d3
--- /dev/null
+++ b/resources/js/components/modals/ConfirmModal.vue
@@ -0,0 +1,94 @@
+<template>
+    <vue-final-modal
+        class="modal-container modal"
+        content-class="sp-modal-content sp-modal-content-sm"
+        :name="name"
+    >
+        <div class="sp-modal-content sp-modal-content-sm">
+            <div class="modal-header">
+                <h5
+                    v-if="title"
+                    class="modal-title"
+                >
+                    {{ title }}
+                </h5>
+                <button
+                    type="button"
+                    class="btn-close"
+                    aria-label="Close"
+                    data-bs-dismiss="modal"
+                    @click="close()"
+                />
+            </div>
+            <div class="modal-body nonscrollable">
+                <slot />
+            </div>
+            <div class="modal-footer">
+                <LoadingButton
+                    type="submit"
+                    class="btn btn-outline-success"
+                    form="newEntityTypeForm"
+                    :disabled="disabled"
+                    :loading="loading"
+                    @click="confirm()"
+                >
+                    <i class="fas fa-fw fa-plus" /> {{ t('global.add') }}
+                </LoadingButton>
+                <button
+                    type="button"
+                    class="btn btn-outline-secondary"
+                    data-bs-dismiss="modal"
+                    @click.prevent="close()"
+                >
+                    <i class="fas fa-fw fa-times" /> {{ t('global.cancel') }}
+                </button>
+            </div>
+        </div>
+    </vue-final-modal>
+</template>
+
+<script>
+    import { useI18n } from 'vue-i18n';
+    import LoadingButton from '../forms/button/LoadingButton.vue';
+
+    export default {
+        components: {
+            LoadingButton,
+        },
+        props: {
+            disabled: {
+                type: Boolean,
+                default: false,
+            },
+            loading: {
+                type: Boolean,
+                default: false,
+            },
+            title: {
+                type: String,
+                default: '',
+            },
+        },
+        emits: ['close', 'confirm'],
+        setup(props, context) {
+            const { t } = useI18n();
+
+            // FUNCTIONS
+            const confirm = _ => {
+                context.emit('confirm');
+            };
+            const close = _ => {
+                context.emit('close');
+            };
+
+            // RETURN
+            return {
+                t,
+                // PROPS
+                // LOCAL
+                close,
+                confirm,
+            };
+        },
+    };
+</script>
\ No newline at end of file
diff --git a/resources/js/components/modals/entity/Add.vue b/resources/js/components/modals/entity/Add.vue
index 8001d27c0..7029d3bce 100644
--- a/resources/js/components/modals/entity/Add.vue
+++ b/resources/js/components/modals/entity/Add.vue
@@ -1,103 +1,68 @@
 <template>
-    <vue-final-modal
-        class="modal-container modal"
-        content-class="sp-modal-content sp-modal-content-sm"
+    <ConfirmModal
+        :title="t('main.entity.modals.add.title')"
         name="add-entity-modal"
+        :disabled="state.dataMissing"
+        :loading="loading"
+        @confirm="add()"
+        @close="closeModal"
     >
-        <div class="sp-modal-content sp-modal-content-sm">
-            <div class="modal-header">
-                <h5 class="modal-title">
-                    {{ t('main.entity.modals.add.title') }}
-                    <small v-if="state.hasParent">
-                        {{ parent.name }}
-                    </small>
-                </h5>
-                <button
-                    type="button"
-                    class="btn-close"
-                    aria-label="Close"
-                    data-bs-dismiss="modal"
-                    @click="closeModal()"
-                />
-            </div>
-            <div class="modal-body nonscrollable">
-                <form
-                    id="newEntityForm"
-                    name="newEntityForm"
-                    role="form"
-                    @submit.prevent="add()"
+        <form
+            id="newEntityForm"
+            name="newEntityForm"
+            role="form"
+        >
+            <div class="mb-3">
+                <label
+                    class="col-form-label col-md-3"
+                    for="name"
                 >
-                    <div class="mb-3">
-                        <label
-                            class="col-form-label col-md-3"
-                            for="name"
-                        >
-                            {{ t('global.name') }}:
-                        </label>
-                        <div class="col-md-9">
-                            <input
-                                id="name"
-                                v-model="state.entity.name"
-                                type="text"
-                                class="form-control"
-                                required
-                            >
-                        </div>
-                    </div>
-                    <div class="mb-3">
-                        <label
-                            class="col-form-label col-md-3"
-                            for="type"
-                        >
-                            {{ t('global.type') }}:
-                        </label>
-                        <div class="col-md-9">
-                            <multiselect
-                                id="type"
-                                v-model="state.entity.type"
-                                name="type"
-                                :classes="multiselectResetClasslist"
-                                :object="true"
-                                :label="'thesaurus_url'"
-                                :track-by="'id'"
-                                :value-prop="'id'"
-                                :mode="'single'"
-                                :options="state.entityTypes"
-                                :placeholder="t('global.select.placeholder')"
-                            >
-                                <template #option="{ option }">
-                                    {{ translateConcept(option.thesaurus_url) }}
-                                </template>
-                                <template #singlelabel="{ value }">
-                                    <div class="multiselect-single-label">
-                                        {{ translateConcept(value.thesaurus_url) }}
-                                    </div>
-                                </template>
-                            </multiselect>
-                        </div>
-                    </div>
-                </form>
+                    {{ t('global.name') }}
+                </label>
+                <div class="col-md-9">
+                    <input
+                        id="name"
+                        v-model="state.entity.name"
+                        type="text"
+                        class="form-control"
+                        required
+                    >
+                </div>
             </div>
-            <div class="modal-footer">
-                <button
-                    type="submit"
-                    class="btn btn-outline-success"
-                    form="newEntityForm"
-                    :disabled="state.dataMissing"
-                >
-                    <i class="fas fa-fw fa-plus" /> {{ t('global.add') }}
-                </button>
-                <button
-                    type="button"
-                    class="btn btn-outline-secondary"
-                    data-bs-dismiss="modal"
-                    @click="closeModal()"
+            <div class="mb-3">
+                <label
+                    class="col-form-label col-md-3"
+                    for="type"
                 >
-                    <i class="fas fa-fw fa-times" /> {{ t('global.cancel') }}
-                </button>
+                    {{ t('global.type') }}
+                </label>
+                <div class="col-md-9">
+                    <multiselect
+                        id="type"
+                        v-model="state.entity.type"
+                        name="type"
+                        :classes="multiselectResetClasslist"
+                        :object="true"
+                        :label="'thesaurus_url'"
+                        :track-by="'id'"
+                        :value-prop="'id'"
+                        :mode="'single'"
+                        :options="state.entityTypes"
+                        :placeholder="t('global.select.placeholder')"
+                    >
+                        <template #option="{ option }">
+                            {{ translateConcept(option.thesaurus_url) }}
+                        </template>
+                        <template #singlelabel="{ value }">
+                            <div class="multiselect-single-label">
+                                {{ translateConcept(value.thesaurus_url) }}
+                            </div>
+                        </template>
+                    </multiselect>
+                </div>
             </div>
-        </div>
-    </vue-final-modal>
+        </form>
+    </ConfirmModal>
 </template>
 
 <script>
@@ -114,16 +79,24 @@
         translateConcept,
         multiselectResetClasslist,
     } from '@/helpers/helpers.js';
+    import ConfirmModal from '../ConfirmModal.vue';
 
     export default {
+        components: {
+            ConfirmModal,
+        },
         props: {
             parent: {
                 required: false,
                 type: Object,
                 default: null,
             },
+            loading: {
+                type: Boolean,
+                default: false,
+            },
         },
-        emits: ['closing', 'confirm'],
+        emits: ['close', 'confirm'],
         setup(props, context) {
             const { t } = useI18n();
             const {
@@ -138,7 +111,8 @@
                 context.emit('confirm', state.entity);
             };
             const closeModal = _ => {
-                context.emit('closing', false);
+                console.log('closeModal');
+                context.emit('close', false);
             };
 
             // DATA
@@ -179,7 +153,7 @@
                 closeModal,
                 // STATE
                 state,
-            }
+            };
         },
-    }
+    };
 </script>
\ No newline at end of file
diff --git a/resources/js/components/modals/entitytype/Add.vue b/resources/js/components/modals/entitytype/Add.vue
index f35d9d45f..bb2993eb2 100644
--- a/resources/js/components/modals/entitytype/Add.vue
+++ b/resources/js/components/modals/entitytype/Add.vue
@@ -1,102 +1,67 @@
 <template>
-    <vue-final-modal
-        class="modal-container modal"
-        content-class="sp-modal-content sp-modal-content-sm"
-        name="delete-entity-type-modal"
+    <ConfirmModal
+        :title="t('main.datamodel.entity.modal.new.title')"
+        name="add-entity-type-modal"
     >
-        <div class="sp-modal-content sp-modal-content-sm">
-            <div class="modal-header">
-                <h5 class="modal-title">
-                    {{ t('main.datamodel.entity.modal.new.title') }}
-                </h5>
-                <button
-                    type="button"
-                    class="btn-close"
-                    aria-label="Close"
-                    data-bs-dismiss="modal"
-                    @click="closeModal()"
-                />
-            </div>
-            <div class="modal-body nonscrollable">
-                <form
-                    id="newEntityTypeForm"
-                    name="newEntityTypeForm"
-                    role="form"
-                    @submit.prevent="add()"
+        <form
+            id="newEntityTypeForm"
+            name="newEntityTypeForm"
+            role="form"
+            @submit.prevent="add()"
+        >
+            <div class="mb-3">
+                <label
+                    class="col-form-label col-md-3"
+                    for="name"
                 >
-                    <div class="mb-3">
-                        <label
-                            class="col-form-label col-md-3"
-                            for="name"
-                        >
-                            {{ t('global.label') }}:
-                        </label>
-                        <div class="col-md-9">
-                            <simple-search
-                                :endpoint="searchLabel"
-                                :key-fn="getConceptLabel"
-                                @selected="labelSelected"
-                            />
-                        </div>
-                    </div>
-                    <div class="form-check form-switch mb-3">
-                        <input
-                            id="isRoot"
-                            v-model="state.entityType.is_root"
-                            type="checkbox"
-                            class="form-check-input"
-                        >
-                        <label
-                            class="form-check-label"
-                            for="isRoot"
-                        >
-                            {{ t('main.datamodel.detail.properties.top_level') }}
-                        </label>
-                    </div>
-                    <div class="mb-3">
-                        <label
-                            class="col-form-label col-md-3"
-                            for="name"
-                        >
-                            {{ t('global.geometry_type') }}:
-                        </label>
-                        <div class="col-md-9">
-                            <multiselect
-                                v-model="state.entityType.geometryType"
-                                :classes="multiselectResetClasslist"
-                                :name="'geometry-type-selection'"
-                                :object="true"
-                                :label="'label'"
-                                :track-by="'key'"
-                                :value-prop="'key'"
-                                :mode="'single'"
-                                :options="state.availableGeometryTypes"
-                                :placeholder="t('global.select.placeholder')"
-                            />
-                        </div>
-                    </div>
-                </form>
+                    {{ t('global.label') }}:
+                </label>
+                <div class="col-md-9">
+                    <simple-search
+                        :endpoint="searchLabel"
+                        :key-fn="getConceptLabel"
+                        @selected="labelSelected"
+                    />
+                </div>
             </div>
-            <div class="modal-footer">
-                <button
-                    type="submit"
-                    class="btn btn-outline-success"
-                    form="newEntityTypeForm"
-                    :disabled="state.dataMissing"
+            <div class="form-check form-switch mb-3">
+                <input
+                    id="isRoot"
+                    v-model="state.entityType.is_root"
+                    type="checkbox"
+                    class="form-check-input"
+                >
+                <label
+                    class="form-check-label"
+                    for="isRoot"
                 >
-                    <i class="fas fa-fw fa-plus" /> {{ t('global.add') }}
-                </button>
-                <button
-                    type="button"
-                    class="btn btn-outline-secondary"
-                    data-bs-dismiss="modal"
-                    @click="closeModal()"
+                    {{ t('main.datamodel.detail.properties.top_level') }}
+                </label>
+            </div>
+            <div class="mb-3">
+                <label
+                    class="col-form-label col-md-3"
+                    for="name"
                 >
-                    <i class="fas fa-fw fa-times" /> {{ t('global.cancel') }}
-                </button>
+                    {{ t('global.geometry_type') }}:
+                </label>
+                <div class="col-md-9">
+                    <multiselect
+                        v-model="state.entityType.geometryType"
+                        :classes="multiselectResetClasslist"
+                        :name="'geometry-type-selection'"
+                        :object="true"
+                        :label="'label'"
+                        :track-by="'key'"
+                        :value-prop="'key'"
+                        :mode="'single'"
+                        :options="state.availableGeometryTypes"
+                        :placeholder="t('global.select.placeholder')"
+                    />
+                </div>
             </div>
-        </div>
-    </vue-final-modal>
+        </form>
+    </ConfirmModal>
 </template>
 
 <script>
@@ -116,9 +81,11 @@
         getConceptLabel,
         multiselectResetClasslist,
     } from '@/helpers/helpers.js';
+    import ConfirmModal from '../ConfirmModal.vue';
 
     export default {
-        props: {
+        components: {
+            ConfirmModal
         },
         emits: ['closing', 'confirm'],
         setup(props, context) {
diff --git a/resources/js/helpers/modal.js b/resources/js/helpers/modal.js
index 35db5c12f..d20fb3b5e 100644
--- a/resources/js/helpers/modal.js
+++ b/resources/js/helpers/modal.js
@@ -74,6 +74,7 @@ import EditAttribute from '@/components/modals/attribute/Edit.vue';
 import MultiEditAttribute from '@/components/modals/attribute/MultiEdit.vue';
 import EditSystemAttribute from '@/components/modals/attribute/EditSystem.vue';
 import DeleteAttribute from '@/components/modals/attribute/Delete.vue';
+import { ref } from 'vue';
 
 export function showAbout() {
     const uid = `AboutModal-${getTs()}`;
@@ -345,7 +346,7 @@ export function showResetPassword(id) {
                     addToast(msg, title, {
                         channel: 'success',
                     });
-                })
+                });
             },
             onCancel(e) {
                 modal.destroy();
@@ -370,7 +371,7 @@ export function showConfirmPassword(id) {
                         login_attempts: null,
                     });
                     modal.destroy();
-                })
+                });
             },
             onCancel(e) {
                 modal.destroy();
@@ -398,7 +399,7 @@ export function showDeactivateUser(user, onDeactivated) {
                     }
                     store.dispatch('deactivateUser', data);
                     modal.destroy();
-                })
+                });
             },
             onCancel(e) {
                 modal.destroy();
@@ -581,15 +582,18 @@ export function showLiteratureInfo(id, options) {
 
 export function showAddEntity(parent = null, onAdded) {
     const uid = `AddEntity-${getTs()}`;
+    const loading = ref(false);
     const modal = useModal({
         component: AddEntity,
         attrs: {
             name: uid,
             parent: parent,
-            onClosing(e) {
+            loading,
+            onClose(e) {
                 modal.destroy();
             },
             onConfirm(entity) {
+                loading.value = true;
                 const entityData = {
                     type_id: entity.type.id,
                     parent_id: entity.parent_id,
@@ -601,6 +605,8 @@ export function showAddEntity(parent = null, onAdded) {
                         onAdded(node);
                     }
                     modal.destroy();
+                }).finally(_ => {
+                    loading.value = false;
                 });
             },
         },