Fixed menu modals and details

src/modals/Modals.vue

@@ -27,6 +27,8 @@ import { publicationStore } from './../store/store.js'
 		<EditThemeModal />
 		<AddPageModal />
 		<EditPageModal />
+		<EditMenuModal />
+		<DeleteMenuModal />
 	</div>
 </template>
 
@@ -55,7 +57,8 @@ import AddThemeModal from './theme/AddThemeModal.vue'
 import EditThemeModal from './theme/EditThemeModal.vue'
 import AddPageModal from './page/AddPageModal.vue'
 import EditPageModal from './page/EditPageModal.vue'
-
+import EditMenuModal from './menu/EditMenuModal.vue'
+import DeleteMenuModal from './menu/DeleteMenuModal.vue'
 /**
  * Component that contains all modals used in the application
  */
@@ -84,6 +87,8 @@ export default {
 		EditThemeModal,
 		AddPageModal,
 		EditPageModal,
+		EditMenuModal,
+		DeleteMenuModal,
 	},
 }
 </script>

src/modals/menu/DeleteMenu.vue → src/modals/menu/DeleteMenuModal.vue

@@ -3,23 +3,23 @@ import { menuStore, navigationStore } from '../../store/store.js'
 </script>
 
 <template>
-	<NcDialog v-if="navigationStore.dialog === 'deleteMenu'"
+	<NcDialog v-if="navigationStore.modal === 'deleteMenu'"
 		name="Delete Menu"
 		size="normal"
 		:can-close="false">
 		<p v-if="success === null">
-			Do you want to permanently delete <b>{{ menuStore.menuItem?.id }}</b>? This action cannot be undone.
+			Weet je zeker dat je het menu <b>{{ menuStore.menuItem?.name }}</b> wilt verwijderen? Dit kan niet ongedaan worden gemaakt.
 		</p>
 
 		<NcNoteCard v-if="success" type="success">
-			<p>Menu successfully deleted</p>
+			<p>Menu succesvol verwijderd</p>
 		</NcNoteCard>
 		<NcNoteCard v-if="error" type="error">
 			<p>{{ error }}</p>
 		</NcNoteCard>
 
 		<template #actions>
-			<NcButton @click="closeDialog">
+			<NcButton @click="closeModal">
 				<template #icon>
 					<Cancel :size="20" />
 				</template>
@@ -55,7 +55,7 @@ import TrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'
  * Component for deleting menu items
  */
 export default {
-	name: 'DeleteMenu',
+	name: 'DeleteMenuModal',
 	components: {
 		NcDialog,
 		NcButton,
@@ -77,8 +77,8 @@ export default {
 		/**
 		 * Closes the delete dialog and resets state
 		 */
-		closeDialog() {
-			navigationStore.setDialog(false)
+		closeModal() {
+			navigationStore.setModal(false)
 			clearTimeout(this.closeModalTimeout)
 			this.success = null
 			this.loading = false
@@ -90,12 +90,10 @@ export default {
 		async deleteMenu() {
 			this.loading = true
 
-			menuStore.deleteMenu({
-				...menuStore.menuItem,
-			}).then(({ response }) => {
+			menuStore.deleteMenu(menuStore.menuItem.id).then(({ response }) => {
 				this.success = response.ok
 				this.error = false
-				response.ok && (this.closeModalTimeout = setTimeout(this.closeDialog, 2000))
+				response.ok && (this.closeModalTimeout = setTimeout(this.closeModal, 2000))
 			}).catch((error) => {
 				this.success = false
 				this.error = error.message || 'An error occurred while deleting the menu'