feat: DeleteUser for Admin added in the profile dropdown menu, deleted from the Admin user overview

backend/src/middleware/permissionsMiddleware.js

@@ -68,7 +68,11 @@ const isAuthor = rule({
 const isDeletingOwnAccount = rule({
   cache: 'no_cache',
 })(async (parent, args, context, info) => {
+  if (isAdmin === true) {
+    return true
+  } else {
     return context.user.id === args.id
+  }
 })
 
 const noEmailFilter = rule({
@@ -133,7 +137,7 @@ export default shield(
       CreateComment: isAuthenticated,
       UpdateComment: isAuthor,
       DeleteComment: isAuthor,
-      DeleteUser: isDeletingOwnAccount,
+      DeleteUser: or(isDeletingOwnAccount, isAdmin),
       requestPasswordReset: allow,
       resetPassword: allow,
       AddPostEmotions: isAuthenticated,

backend/src/schema/resolvers/users.js

@@ -174,6 +174,7 @@ export default {
     },
     DeleteUser: async (object, params, context, resolveInfo) => {
       const { resource } = params
+      const { id } = params
       const session = context.driver.session()
       try {
         if (resource && resource.length) {
@@ -190,7 +191,7 @@ export default {
                     RETURN author
                   `,
                 {
-                  userId: context.user.id,
+                  userId: id,
                 },
               )
             })
@@ -212,7 +213,7 @@ export default {
               DETACH DELETE socialMedia
               RETURN user
             `,
-            { userId: context.user.id },
+            { userId: id },
           )
           log(deleteUserTransactionResponse)
           return deleteUserTransactionResponse.records.map(record => record.get('user').properties)

webapp/components/ContentMenu/ContentMenu.vue

@@ -154,6 +154,15 @@ export default {
             path: '/settings',
             icon: 'edit',
           })
+          if (this.isAdmin === true) {
+            routes.push({
+              label: this.$t(`settings.deleteUserAccount.name`),
+              callback: () => {
+                this.$emit('delete', this.resource)
+              },
+              icon: 'trash',
+            })
+          }
         } else {
           if (this.resource.isMuted) {
             routes.push({
@@ -189,6 +198,15 @@ export default {
               icon: 'user-times',
             })
           }
+          if (this.isAdmin === true) {
+            routes.push({
+              label: this.$t(`settings.deleteUserAccount.name`),
+              callback: () => {
+                this.$emit('delete', this.resource)
+              },
+              icon: 'trash',
+            })
+          }
         }
       }
 

webapp/components/DeleteData/DeleteData.vue

@@ -4,12 +4,14 @@
       <base-icon name="warning" />
       {{ $t('settings.deleteUserAccount.name') }}
     </h2>
-    <label>
+    <label v-show="!isAdmin">
       {{ $t('settings.deleteUserAccount.pleaseConfirm', { confirm: currentUser.name }) }}
     </label>
-    <ds-input v-model="enableDeletionValue" />
+    <ds-input v-show="!isAdmin" v-model="enableDeletionValue" />
-    <p class="notice">{{ $t('settings.deleteUserAccount.accountDescription') }}</p>
+    <p v-show="enableDeletionValue" class="notice">
-    <label v-if="currentUser.contributionsCount" class="checkbox">
+      {{ $t('settings.deleteUserAccount.accountDescription') }}
+    </p>
+    <label v-if="!isAdmin && currentUser.contributionsCount" class="checkbox">
       <input type="checkbox" v-model="deleteContributions" />
       {{
         $t('settings.deleteUserAccount.contributionsCount', {
@@ -17,7 +19,7 @@
         })
       }}
     </label>
-    <label v-if="currentUser.commentedCount" class="checkbox">
+    <label v-if="!isAdmin && currentUser.commentedCount" class="checkbox">
       <input type="checkbox" v-model="deleteComments" />
       {{
         $t('settings.deleteUserAccount.commentedCount', {
@@ -25,11 +27,18 @@
         })
       }}
     </label>
-    <section v-if="deleteEnabled" class="warning">
+    <h2 v-else>
-      <p>{{ $t('settings.deleteUserAccount.accountWarning') }}</p>
+      {{ $t('settings.deleteUserAccount.infoAdmin') }}
+    </h2>
+    <section class="warning">
+      <p v-if="!isAdmin">{{ $t('settings.deleteUserAccount.accountWarning') }}</p>
+      <p v-else>{{ $t('settings.deleteUserAccount.accountWarningAdmin') }}</p>
     </section>
-    <ds-text v-show="isAdmin ||  currentUser.role === 'admin'" color="danger">ACHTUNG! Du Bist Admin!!</ds-text>
+    <ds-text v-show="isAdmin || currentUser.role === 'admin'" color="danger">
+      {{ $t('settings.deleteUserAccount.accountWarningIsAdmin') }}
+    </ds-text>
     <base-button
+      v-show="!isAdmin"
       icon="trash"
       danger
       filled
@@ -56,23 +65,12 @@ export default {
       isAdmin: this.$store.getters['auth/isAdmin'],
     }
   },
-  mounted() {
-    if (this.isAdmin === true) {
-      this.deleteContributions = true, 
-      this.deleteComments = true
-    }
-    // console.log('isAdmin', isAdmin)
-    // console.log('this.deleteContributions', this.deleteContributions)
-    // console.log(' this.deleteComments', this.deleteComments)
-  },
   computed: {
     ...mapGetters({
       currentUser: 'auth/user',
     }),
     deleteEnabled() {
-      if (this.isAdmin === true) {
       return this.enableDeletionValue === this.currentUser.name
-    }
     },
   },
   methods: {

webapp/components/DeleteUserModal/DeleteUserModal.vue

@@ -4,9 +4,9 @@
     <!-- <p v-html="message" /> -->
     <delete-data />
     <template slot="footer">
-      <base-button class="cancel" @click="cancel">löschen abbrechen</base-button>
+      <base-button class="cancel" @click="cancel">{{ $t('actions.cancel') }}</base-button>
       <base-button danger filled class="confirm" icon="exclamation-circle" @click="confirm">
-        User jetzt Löschen!
+        {{ $t('settings.deleteUserAccount.name') }}
       </base-button>
     </template>
   </ds-modal>
@@ -21,26 +21,21 @@ export default {
     DeleteData,
   },
   props: {
-    name: { type: String, default: 'jetzt löschen' },
+    slug: { type: String, required: true },
-    type: { type: String, required: true },
     id: { type: String, required: true },
+    name: { type: String, required: true },
   },
   data() {
     return {
       isOpen: true,
       success: false,
       loading: false,
+      isAdmin: this.$store.getters['auth/isAdmin'],
     }
   },
   computed: {
     title() {
-      return 'User Löschen'
+      return this.$props.name + ' (' + this.$props.slug + ')'
-      // return this.$t(`release.${this.type}.title`)
-    },
-    message() {
-      const name = this.$filters.truncate(this.name, 30)
-      return name
-      // return this.$t(`release.${this.type}.message`, { name })
     },
   },
   methods: {
@@ -56,50 +51,25 @@ export default {
       try {
         // TODO: Use the "modalData" structure introduced in "ConfirmModal" and refactor this here. Be aware that all the Jest tests have to be refactored as well !!!
         // await this.modalData.buttons.confirm.callback()
-        await this.$apollo.mutate({
+        this.$apollo
-          /* mutation: gql`
+          .mutate({
-            mutation($resourceId: ID!, $disable: Boolean, $closed: Boolean) {
-              review(resourceId: $resourceId, disable: $disable, closed: $closed) {
-                disable
-              }
-            }
-          `, */
             mutation: gql`
-            mutation {
+              mutation($id: ID!, $resource: [Deletable]) {
-              DeleteUser(id: "u3", resource: [Post, Comment]) {
+                DeleteUser(id: $id, resource: $resource) {
                   id
-                name
-                slug
-                about
-                deleted
-                contributions {
-                  id
-                  content
-                  contentExcerpt
-                  deleted
-                  comments {
-                    id
-                    content
-                    contentExcerpt
-                    deleted
-                  }
-                }
-                comments {
-                  id
-                  content
-                  contentExcerpt
-                  deleted
-                }
                 }
               }
             `,
-          variables: { resourceId: this.id, disable: false, closed: false },
+            variables: { id: this.$props.id, resource: ['Post', 'Comment'] },
+          })
+          .then(() => {
+            this.$toast.success(this.$t('settings.deleteUserAccount.success'))
+            this.$router.history.push('/')
+          })
+          .catch(error => {
+            this.$toast.error(error.message)
           })
-        this.$toast.success('user gelöscht')
         this.isOpen = false
-        setTimeout(() => {
-          this.$emit('close')
-        }, 1000)
       } catch (err) {
         this.$toast.error(err.message)
         this.isOpen = false

webapp/components/Modal.vue

@@ -30,11 +30,11 @@
       :modalData="data.modalData"
       @close="close"
     />
-    <delete-modal
+    <delete-user-modal
       v-if="open === 'delete'"
-      :id="data.resource.id"
+      :id="data.id"
-      :type="data.type"
+      :slug="data.slug"
-      :name="name"
+      :name="data.name"
       @close="close"
     />
   </div>
@@ -45,7 +45,7 @@ import ConfirmModal from '~/components/Modal/ConfirmModal'
 import DisableModal from '~/components/Modal/DisableModal'
 import ReleaseModal from '~/components/ReleaseModal/ReleaseModal.vue'
 import ReportModal from '~/components/Modal/ReportModal'
-import DeleteModal from '~/components/DeleteUserModal/DeleteUserModal.vue'
+import DeleteUserModal from '~/components/DeleteUserModal/DeleteUserModal.vue'
 import { mapGetters } from 'vuex'
 
 export default {
@@ -55,7 +55,7 @@ export default {
     ReleaseModal,
     ReportModal,
     ConfirmModal,
-    DeleteModal,
+    DeleteUserModal,
   },
   computed: {
     ...mapGetters({

webapp/locales/de.json

@@ -639,8 +639,11 @@
     "deleteUserAccount": {
       "accountDescription": "Sei dir bewusst, dass deine Beiträge und Kommentare für unsere Community wichtig sind. Wenn du sie trotzdem löschen möchtest, musst du sie unten markieren.",
       "accountWarning": "Dein Konto, deine Beiträge oder Kommentare kannst du nach dem Löschen WEDER VERWALTEN NOCH WIEDERHERSTELLEN!",
+      "accountWarningAdmin": "Das Konto, die Beiträge oder Kommentare können nach dem Löschen WEDER VERWALTEN NOCH WIEDERHERGESTELLT WERDEN!",
+      "accountWarningIsAdmin": "Achtung! Du bist Admin!!",
       "commentedCount": "Meine {count} Kommentare löschen",
       "contributionsCount": "Meine {count} Beiträge löschen",
+      "infoAdmin": "Alle Beiträge und Kommentare des Users werden zusätzlich gelöscht!",
       "name": "Benutzerkonto löschen",     
       "pleaseConfirm": "Zerstörerische Aktion! Gib „{confirm}“ ein, um zu bestätigen.",
       "success": "Konto erfolgreich gelöscht!"

webapp/locales/en.json

@@ -639,8 +639,11 @@
     "deleteUserAccount": {
       "accountDescription": "Be aware that your Posts and Comments are important to our community. If you still choose to delete them, you have to mark them below.",
       "accountWarning": "You CAN'T MANAGE and CAN'T RECOVER your Account, Posts, or Comments after deleting your account!",
+      "accountWarningAdmin": "The account, contributions or comments can NOT BE ADMINISTERED OR RESTORED after deletion!",
+      "accountWarningIsAdmin": "Heads up! You are Admin!!",
       "commentedCount": "Delete my {count} comments",
       "contributionsCount": "Delete my {count} posts",
+      "infoAdmin": "All contributions and comments of the user are additionally deleted!",
       "name": "Delete user account",
       "pleaseConfirm": "Destructive action! Type “{confirm}” to confirm.",
       "success": "Account successfully deleted!"

webapp/pages/admin/users.vue

@@ -48,11 +48,6 @@
         <template slot="createdAt" slot-scope="scope">
           {{ scope.row.createdAt | dateTime }}
         </template>
-        <template slot="delete" slot-scope="scope">
-          <div @click="deleteUser({ id: scope.row.id, slug: scope.row.slug })">
-            <ds-icon name="trash"></ds-icon>
-          </div>
-        </template>
       </ds-table>
       <pagination-buttons :hasNext="hasNext" :hasPrevious="hasPrevious" @next="next" @back="back" />
     </base-card>
@@ -116,10 +111,6 @@ export default {
           label: this.$t('admin.users.table.columns.role'),
           align: 'right',
         },
-        delete: {
-          label: '-',
-          align: 'right',
-        },
       }
     },
   },
@@ -164,17 +155,6 @@ export default {
     },
   },
   methods: {
-    openModal(userdata) {
-      console.log("openModal", userdata)
-      this.$store.commit('modal/SET_OPEN', {
-        name: 'delete',
-        data: {
-          id: 'sss',
-          type: 'dfdd',
-          name: {},
-        },
-      })
-    },
     back() {
       this.offset = Math.max(this.offset - this.pageSize, 0)
     },
@@ -194,10 +174,6 @@ export default {
         }
       }
     },
-    deleteUser(userdata) {
-      console.log("deleteUser", userdata)
-      this.openModal(userdata)
-    },
   },
 }
 </script>

webapp/pages/profile/_id/_slug.vue

@@ -23,6 +23,7 @@
               @unmute="unmuteUser"
               @block="blockUser"
               @unblock="unblockUser"
+              @delete="deleteUser"
             />
           </client-only>
           <ds-space margin="small">
@@ -436,6 +437,16 @@ export default {
         this.$apollo.queries.User.refetch()
       }
     },
+    async deleteUser(userdata) {
+      this.$store.commit('modal/SET_OPEN', {
+        name: 'delete',
+        data: {
+          id: userdata.id,
+          slug: userdata.slug,
+          name: userdata.name,
+        },
+      })
+    },
     pinPost(post) {
       this.$apollo
         .mutate({