Updating FE to use new bulk_destroy endpoint

2 files changed, 15 insertions, 13 deletions

diff --git a/app/assets/javascripts/registry/components/table_registry.vue b/app/assets/javascripts/registry/components/table_registry.vue
index a241db13e5a..cf1ee0e06a6 100644
--- a/app/assets/javascripts/registry/components/table_registry.vue
+++ b/app/assets/javascripts/registry/components/table_registry.vue
@@ -45,6 +45,9 @@ export default {
     };
   },
   computed: {
+    bulkDeletePath() {
+      return this.repo.tagsPath ? this.repo.tagsPath.replace('?format=json', '/bulk_destroy') : '';
+    },
     shouldRenderPagination() {
       return this.repo.pagination.total > this.repo.pagination.perPage;
     },
@@ -78,7 +81,7 @@ export default {
     },
   },
   methods: {
-    ...mapActions(['fetchList', 'deleteItem']),
+    ...mapActions(['fetchList', 'deleteItems']),
     layers(item) {
       return item.layers ? n__('%d layer', '%d layers', item.layers) : '';
     },
@@ -101,18 +104,16 @@ export default {
         itemsToBeDeleted = [singleItemToBeDeleted];
       }
 
-      const deleteActions = itemsToBeDeleted.map(
-        x =>
-          new Promise((resolve, reject) => {
-            this.deleteItem(this.repo.list[x])
-              .then(resolve)
-              .catch(reject);
-          }),
-      );
-
-      Promise.all(deleteActions)
-        .then(() => this.fetchList({ repo: this.repo }))
-        .catch(() => this.showError(errorMessagesTypes.DELETE_REGISTRY));
+      if (this.bulkDeletePath) {
+        this.deleteItems({
+          path: this.bulkDeletePath,
+          items: itemsToBeDeleted.map(x => this.repo.list[x].tag),
+        })
+          .then(() => this.fetchList({ repo: this.repo }))
+          .catch(() => this.showError(errorMessagesTypes.DELETE_REGISTRY));
+      } else {
+        this.showError(errorMessagesTypes.DELETE_REGISTRY);
+      }
     },
     onPageChange(pageNumber) {
       this.fetchList({ repo: this.repo, page: pageNumber }).catch(() =>
diff --git a/app/assets/javascripts/registry/stores/actions.js b/app/assets/javascripts/registry/stores/actions.js
index 0f5e9cc73a0..4c20c003c5a 100644
--- a/app/assets/javascripts/registry/stores/actions.js
+++ b/app/assets/javascripts/registry/stores/actions.js
@@ -36,6 +36,7 @@ export const fetchList = ({ commit }, { repo, page }) => {
 };
 
 export const deleteItem = (_, item) => axios.delete(item.destroyPath);
+export const deleteItems = (_, { path, items }) => axios.delete(path, { params: { ids: items } });
 
 export const setMainEndpoint = ({ commit }, data) => commit(types.SET_MAIN_ENDPOINT, data);
 export const toggleLoading = ({ commit }) => commit(types.TOGGLE_MAIN_LOADING);