2 files changed, 37 insertions, 0 deletions
diff --git a/src/components/delete_button/delete_button.js b/src/components/delete_button/delete_button.js
new file mode 100644
index 00000000..726509d0
--- /dev/null
+++ b/src/components/delete_button/delete_button.js
@@ -0,0 +1,17 @@
+const DeleteButton = {
+  props: [ 'status' ],
+  methods: {
+    deleteStatus () {
+      const confirmed = confirm('Do you really want to delete this status?')
+      if (confirmed) {
+        this.$store.dispatch('deleteStatus', { id: this.status.id })
+      }
+    }
+  },
+  computed: {
+    currentUser () { return this.$store.state.users.currentUser },
+    canDelete () { return this.currentUser.rights.delete_others_notice || this.status.user.id == this.currentUser.id }
+  }
+}
+
+export default DeleteButton
diff --git a/src/components/delete_button/delete_button.vue b/src/components/delete_button/delete_button.vue
new file mode 100644
index 00000000..304f8a63
--- /dev/null
+++ b/src/components/delete_button/delete_button.vue
@@ -0,0 +1,20 @@
+<template>
+  <div v-if="canDelete">
+    <a href="#" v-on:click.prevent="deleteStatus()">
+      <i class='fa icon-cancel delete-status'></i>
+    </a>
+  </div>
+</template>
+
+<script src="./delete_button.js" ></script>
+
+<style lang='scss'>
+  @import '../../_variables.scss';
+
+  .icon-cancel,.delete-status {
+    cursor: pointer;
+    &:hover {
+      color: $red;
+    }
+  }
+</style>