diff --git a/src/components/Feature/Detail/FeatureHeader.vue b/src/components/Feature/Detail/FeatureHeader.vue
index d0850cb749761cd9462f53e69a904c8a43046ea4..3be179128521789fcf6a2cb83e3d8d5c3b23b522 100644
--- a/src/components/Feature/Detail/FeatureHeader.vue
+++ b/src/components/Feature/Detail/FeatureHeader.vue
@@ -45,7 +45,7 @@
             v-if="((permissions && permissions.can_update_feature) || isFeatureCreator) && isOnline"
             id="currentFeature-delete"
             class="ui button button-hover-red"
-            @click="isCanceling = true"
+            @click="$emit('delete')"
           >
             <i
               class="inverted grey trash alternate icon"
diff --git a/src/views/Feature/FeatureDetail.vue b/src/views/Feature/FeatureDetail.vue
index f6e76a9e232606c23e033a21574bb9e7f92875fc..f7eac45c0ae6aca9838a903ece894a9252a42285 100644
--- a/src/views/Feature/FeatureDetail.vue
+++ b/src/views/Feature/FeatureDetail.vue
@@ -9,7 +9,9 @@
     >
       <div class="row">
         <div class="sixteen wide column">
-          <FeatureHeader />
+          <FeatureHeader
+            @delete="isCanceling = true"
+          />
         </div>
       </div>
       <div class="row">
@@ -52,7 +54,7 @@
       </div>
       <div
         v-if="isCanceling"
-        class="ui dimmer modals page transition visible active"
+        class="ui dimmer modals transition visible active"
         style="display: flex !important"
       >
         <div
@@ -234,9 +236,9 @@ export default {
     deleteFeature() {
       this.$store
         .dispatch('feature/DELETE_FEATURE', { feature_id: this.currentFeature.feature_id })
-        .then((response) => {
+        .then(async (response) => {
           if (response.status === 204) {
-            this.GET_PROJECT_FEATURES({
+            await this.GET_PROJECT_FEATURES({
               project_slug: this.$route.params.slug
             });
             this.goBackToProject();