Handle DesignDestroyer errors in parents

Design Destroyer is used both on the Issue page,
and in the "design detail" page, and errors need to be
flashed in each respective place.

Previously, Design Destroyer flashed errors within it.
Now, this has been removed and parent components
are responsible for flashing errors

ee/app/assets/javascripts/design_management/components/design_destroyer.vue

@@ -4,8 +4,6 @@ import createFlash from '~/flash';
 import projectQuery from '../graphql/queries/project.query.graphql';
 import destroyDesignMutation from '../graphql/mutations/destroyDesign.mutation.graphql';
 import { updateStoreAfterDesignsDelete } from '../utils/cache_update';
-import { designDeletionError } from '../utils/error_messages';
-import { createDesignDetailFlash } from '../utils/design_management_utils';
 
 export default {
   components: {
@@ -34,10 +32,6 @@ export default {
     },
   },
   methods: {
-    onError() {
-      const errorMessage = designDeletionError(this.filenames.length === 1);
-      createDesignDetailFlash(errorMessage);
-    },
     updateStoreAfterDelete(
       store,
       {
@@ -66,7 +60,6 @@ export default {
       iid,
     }"
     :update="updateStoreAfterDelete"
-    @error="onError"
     v-on="$listeners"
   >
     <slot v-bind="{ mutate, loading, error }"></slot>

ee/app/assets/javascripts/design_management/pages/design/index.vue

@@ -20,7 +20,11 @@ import {
   createDesignDetailFlash,
 } from '../../utils/design_management_utils';
 import { updateStoreAfterAddImageDiffNote } from '../../utils/cache_update';
-import { ADD_DISCUSSION_COMMENT_ERROR, DESIGN_NOT_FOUND_ERROR } from '../../utils/error_messages';
+import {
+  ADD_DISCUSSION_COMMENT_ERROR,
+  DESIGN_NOT_FOUND_ERROR,
+  designDeletionError,
+} from '../../utils/error_messages';
 import DESIGN_DETAIL_CONTAINER_CLASS from '../../utils/constants';
 
 export default {
@@ -185,6 +189,12 @@ export default {
         query: this.$route.query,
       });
     },
+    onDesignDeleteError() {
+      const errorMessage = designDeletionError({ singular: true });
+      createDesignDetailFlash(errorMessage);
+
+      this.$router.push({ name: 'designs' });
+    },
   },
   beforeRouteUpdate(to, from, next) {
     this.closeCommentForm();
@@ -209,7 +219,7 @@ export default {
           :project-path="projectPath"
           :iid="issueIid"
           @done="$router.push({ name: 'designs' })"
-          @error="$router.push({ name: 'designs' })"
+          @error="onDesignDeleteError"
         >
           <template v-slot="{ mutate, loading, error }">
             <toolbar

ee/app/assets/javascripts/design_management/pages/index.vue

@@ -11,7 +11,7 @@ import uploadDesignMutation from '../graphql/mutations/uploadDesign.mutation.gra
 import permissionsQuery from '../graphql/queries/permissions.query.graphql';
 import projectQuery from '../graphql/queries/project.query.graphql';
 import allDesignsMixin from '../mixins/all_designs';
-import { UPLOAD_DESIGN_ERROR } from '../utils/error_messages';
+import { UPLOAD_DESIGN_ERROR, designDeletionError } from '../utils/error_messages';
 import { updateStoreAfterUploadDesign } from '../utils/cache_update';
 import { designUploadOptimisticResponse } from '../utils/design_management_utils';
 
@@ -178,6 +178,10 @@ export default {
       this.selectedDesigns = [];
       if (this.$route.query.version) this.$router.push({ name: 'designs' });
     },
+    onDesignDeleteError() {
+      const errorMessage = designDeletionError({ singular: this.selectedDesigns.length === 1 });
+      createFlash(errorMessage);
+    },
   },
   beforeRouteUpdate(to, from, next) {
     this.selectedDesigns = [];
@@ -205,6 +209,7 @@ export default {
             :project-path="projectPath"
             :iid="issueIid"
             @done="onDesignDelete"
+            @error="onDesignDeleteError"
           >
             <delete-button
               v-if="isLatestVersion"

ee/app/assets/javascripts/design_management/utils/cache_update.js

@@ -179,7 +179,7 @@ const onError = (data, message) => {
  */
 export const updateStoreAfterDesignsDelete = (store, data, query, designs) => {
   if (data.errors) {
-    onError(data, designDeletionError(designs.length === 1));
+    onError(data, designDeletionError({ singular: designs.length === 1 }));
   } else {
     deleteDesignsFromStore(store, query, designs);
     addNewVersionToStore(store, query, data.version);

ee/app/assets/javascripts/design_management/utils/error_messages.js

 import { __, s__, sprintf } from '~/locale';
 
-export const designDeletionError = (singular = true) => {
+export const designDeletionError = ({ singular = true } = {}) => {
   const design = singular ? __('a design') : __('designs');
   return sprintf(s__('DesignManagement|We could not delete %{design}. Please try again.'), {
     design,