Add a confirm modal.

webapp/components/ContentMenu.vue

@@ -70,7 +70,7 @@ export default {
           routes.push({
             name: this.$t(`post.menu.delete`),
             callback: () => {
-              this.openModal('delete')
+              this.openModal('confirm', 'delete')
             },
             icon: 'trash',
           })
@@ -108,7 +108,7 @@ export default {
         routes.push({
           name: this.$t(`comment.menu.delete`),
           callback: () => {
-            this.openModal('delete')
+            this.openModal('confirm', 'delete')
           },
           icon: 'trash',
         })
@@ -137,7 +137,7 @@ export default {
           routes.push({
             name: this.$t(`release.${this.resourceType}.title`),
             callback: () => {
-              this.openModal('release', this.resource.id)
+              this.openModal('release')
             },
             icon: 'eye',
           })
@@ -190,13 +190,13 @@ export default {
       }
       toggleMenu()
     },
-    openModal(dialog) {
+    openModal(dialog, modalDataName = null) {
       this.$store.commit('modal/SET_OPEN', {
         name: dialog,
         data: {
           type: this.resourceType,
           resource: this.resource,
-          modalsData: this.modalsData,
+          modalData: modalDataName ? this.modalsData[modalDataName] : {},
         },
       })
     },

webapp/components/Modal.vue

@@ -23,11 +23,11 @@
       @close="close"
     />
     <confirm-modal
-      v-if="open === 'delete'"
+      v-if="open === 'confirm'"
       :id="data.resource.id"
       :type="data.type"
       :name="name"
-      :modalData="data.modalsData.delete"
+      :modalData="data.modalData"
       @close="close"
     />
   </div>

webapp/locales/de.json

@@ -464,7 +464,41 @@
       "reasonCategory": "Kategorie",
       "reasonDescription": "Beschreibung",
       "createdAt": "Datum",
-      "submitter": "Gemeldet von"
+      "submitter": "Gemeldet von",
+      "decideModal": {
+        "submit": "Abschließende Entscheidung",
+        "cancel": "Abbruch",
+        "User": {
+          "disable": {
+            "title": "Sperre den Benutzer abschließend",
+            "message": "Möchtest du den Benutzer \"<b>{name}</b>\" wirklich <b>gesperrt</b> lassen?"
+          },
+          "enable": {
+            "title": "Entsperre den Benutzer abschließend",
+            "message": "Möchtest du den Benutzer \"<b>{name}</b>\" wirklich <b>entsperrt</b> lassen?"
+          }
+        },
+        "Post": {
+          "disable": {
+            "title": "Sperre den Beitrag abschließend",
+            "message": "Möchtest du den Beitrag \"<b>{name}</b>\" wirklich <b>gesperrt</b> lassen?"
+          },
+          "enable": {
+            "title": "Entsperre den Beitrag abschließend",
+            "message": "Möchtest du den Beitrag \"<b>{name}</b>\" wirklich <b>entsperrt</b> lassen?"
+          }
+        },
+        "Comment": {
+          "disable": {
+            "title": "Sperre den Kommentar abschließend",
+            "message": "Möchtest du den Kommentar \"<b>{name}</b>\" wirklich <b>gesperrt</b> lassen?"
+          },
+          "enable": {
+            "title": "Entsperre den Kommentar abschließend",
+            "message": "Möchtest du den Kommentar \"<b>{name}</b>\" wirklich <b>entsperrt</b> lassen?"
+          }
+        }
+      }
     }
   },
   "disable": {

webapp/locales/en.json

@@ -465,7 +465,41 @@
       "reasonCategory": "Category",
       "reasonDescription": "Description",
       "createdAt": "Date",
-      "submitter": "Reported by"
+      "submitter": "Reported by",
+      "decideModal": {
+        "submit": "Final decision",
+        "cancel": "Cancel",
+        "User": {
+          "disable": {
+            "title": "Finally Disable User",
+            "message": "Do you really want to let the user \"<b>{name}</b>\" stay <b>disabled</b>?"
+          },
+          "enable": {
+            "title": "Finally Enable User",
+            "message": "Do you really want to let the user \"<b>{name}</b>\" stay <b>enabled</b>?"
+          }
+        },
+        "Post": {
+          "disable": {
+            "title": "Finally Disable Post",
+            "message": "Do you really want to let the post \"<b>{name}</b>\" stay <b>disabled</b>?"
+          },
+          "enable": {
+            "title": "Finally Enable Post",
+            "message": "Do you really want to let the post \"<b>{name}</b>\" stay <b>enabled</b>?"
+          }
+        },
+        "Comment": {
+          "disable": {
+            "title": "Finally Disable Comment",
+            "message": "Do you really want to let the comment \"<b>{name}</b>\" stay <b>disabled</b>?"
+          },
+          "enable": {
+            "title": "Finally Enable Comment",
+            "message": "Do you really want to let the comment \"<b>{name}</b>\" stay <b>enabled</b>?"
+          }
+        }
+      }
     }
   },
   "disable": {

webapp/pages/moderation/index.vue

@@ -8,7 +8,7 @@
       cellpadding="0"
     >
       <colgroup><col width="" /></colgroup>
-      <template v-for="(content, index) in reportedContentStructure">
+      <template v-for="content in reportedContentStructure">
         <thead
           :class="[
             content.closed ? 'decision' : 'no-decision',
@@ -97,7 +97,7 @@
                 danger
                 class="confirm"
                 icon="exclamation-circle"
-                @click="confirm(content.resource.id, index)"
+                @click="confirm(content)"
               >
                 {{ $t('moderation.reports.decideButton') }}
               </ds-button>
@@ -234,7 +234,10 @@ export default {
     },
   },
   methods: {
-    async confirm(resourceId, index) {
+    confirm(content) {
+      this.openModal(content)
+    },
+    async confirmCallback(resourceId) {
       this.$apollo
         .mutate({
           mutation: decideMutation(),
@@ -246,6 +249,52 @@ export default {
         })
         .catch(error => this.$toast.error(error.message))
     },
+    openModal(content) {
+      const identStart =
+        'moderation.reports.decideModal.' +
+        content.type +
+        '.' +
+        (content.decisionDisable ? 'disable' : 'enable')
+      this.$store.commit('modal/SET_OPEN', {
+        name: 'confirm',
+        data: {
+          type: content.type,
+          resource: content.resource,
+          modalData: {
+            titleIdent: identStart + '.title',
+            messageIdent: identStart + '.message',
+            messageParams: {
+              name:
+                content.type === 'User'
+                  ? content.user.name
+                  : content.type === 'Post'
+                  ? this.$filters.truncate(content.post.title, 30)
+                  : content.type === 'Comment'
+                  ? this.$filters.truncate(
+                      this.$filters.removeHtml(content.comment.contentExcerpt),
+                      30,
+                    )
+                  : '',
+            },
+            buttons: {
+              confirm: {
+                danger: true,
+                icon: 'exclamation-circle',
+                textIdent: 'moderation.reports.decideModal.submit',
+                callback: () => {
+                  this.confirmCallback(content.resource.id)
+                },
+              },
+              cancel: {
+                icon: 'close',
+                textIdent: 'moderation.reports.decideModal.cancel',
+                callback: () => {},
+              },
+            },
+          },
+        },
+      })
+    },
   },
   apollo: {
     reports: {