From 733f76d5718c78f2b18e9c25dd848ebd1c7b6c9a Mon Sep 17 00:00:00 2001
From: Kevin Ansfield <kevin@lookingsideways.co.uk>
Date: Thu, 8 Apr 2021 16:06:00 +0100
Subject: [PATCH] Added automatic CSV export when bulk deleting members

refs https://github.com/TryGhost/Team/issues/585

- updated bulk destroy task to first use the current query params to fetch from the appropriate CSV export endpoint and trigger a download
  - fetches via JS and triggers download from a blob URL link instead of an iframe so that we can be sure the download is successful before we hit the bulk delete endpoint
  - works differently to user deletion download because the server is not generating an export file and saving it meaning the client has to be sure we don't delete data before it's exported
- updated copy in the confirmation modal to reflect the download behaviour
---
 .../app/components/modal-delete-members.hbs   |  5 ++-
 ghost/admin/app/controllers/members.js        | 35 +++++++++++++++++--
 ghost/admin/mirage/config/members.js          |  8 +++++
 3 files changed, 45 insertions(+), 3 deletions(-)

diff --git a/ghost/admin/app/components/modal-delete-members.hbs b/ghost/admin/app/components/modal-delete-members.hbs
index 1a772107e0..2020af0220 100644
--- a/ghost/admin/app/components/modal-delete-members.hbs
+++ b/ghost/admin/app/components/modal-delete-members.hbs
@@ -10,6 +10,9 @@
             <strong data-test-text="delete-count">{{gh-pluralize this.model.memberCount "member"}}</strong>.
             This is permanent! All Ghost data will be deleted, this will have no effect on subscriptions in Stripe.
         </p>
+        <p>
+            A backup of your selection will be automatically downloaded to your device before deletion.
+        </p>
     </div>
 {{else}}
     <div class="gh-content-box pa" data-test-state="delete-complete">
@@ -52,7 +55,7 @@
         </button>
 
         <GhTaskButton
-            @buttonText="Delete members"
+            @buttonText="Download backup & delete members"
             @successText="Deleted"
             @task={{this.deleteMembersTask}}
             @class="gh-btn gh-btn-red gh-btn-icon"
diff --git a/ghost/admin/app/controllers/members.js b/ghost/admin/app/controllers/members.js
index c539cd9778..53112f1b20 100644
--- a/ghost/admin/app/controllers/members.js
+++ b/ghost/admin/app/controllers/members.js
@@ -1,4 +1,6 @@
 import Controller from '@ember/controller';
+import config from 'ghost-admin/config/environment';
+import fetch from 'fetch';
 import ghostPaths from 'ghost-admin/utils/ghost-paths';
 import moment from 'moment';
 import {A} from '@ember/array';
@@ -55,6 +57,10 @@ export default class MembersController extends Controller {
     constructor() {
         super(...arguments);
         this._availableLabels = this.store.peekAll('label');
+
+        if (this.isTesting === undefined) {
+            this.isTesting = config.environment === 'test';
+        }
     }
 
     // Computed properties -----------------------------------------------------
@@ -327,10 +333,35 @@ export default class MembersController extends Controller {
     *deleteMembersTask() {
         const query = new URLSearchParams(this.getApiQueryObject());
 
-        let url = `${this.ghostPaths.url.api('members')}?${query}`;
+        // Trigger download before deleting. Uses the CSV export endpoint but
+        // needs to fetch the file and trigger a download directly rather than
+        // via an iframe. The iframe approach can't tell us when a download has
+        // started/finished meaning we could end up deleting the data before exporting it
+        const exportUrl = ghostPaths().url.api('members/upload');
+        const exportParams = new URLSearchParams(this.getApiQueryObject());
+        exportParams.set('limit', 'all');
+
+        yield fetch(exportUrl, {method: 'GET'})
+            .then(res => res.blob())
+            .then((blob) => {
+                const blobUrl = window.URL.createObjectURL(blob);
+                const a = document.createElement('a');
+                a.href = blobUrl;
+                a.download = `members.${moment().format('YYYY-MM-DD')}.csv`;
+                document.body.appendChild(a);
+                if (!this.isTesting) {
+                    a.click();
+                }
+                a.remove();
+                URL.revokeObjectURL(blobUrl);
+            });
+
+        // backup downloaded, continue with deletion
+
+        const deleteUrl = `${this.ghostPaths.url.api('members')}?${query}`;
 
         // response contains details of which members failed to be deleted
-        let response = yield this.ajax.del(url);
+        const response = yield this.ajax.del(deleteUrl);
 
         // reset and reload
         this.store.unloadAll('member');
diff --git a/ghost/admin/mirage/config/members.js b/ghost/admin/mirage/config/members.js
index 8fdf0c5544..abbdb10055 100644
--- a/ghost/admin/mirage/config/members.js
+++ b/ghost/admin/mirage/config/members.js
@@ -146,5 +146,13 @@ export default function mockMembers(server) {
 
     server.del('/members/:id/');
 
+    server.get('/members/upload/', function () {
+        return new Response(200, {
+            'Content-Disposition': 'attachment',
+            filename: `members.${moment().format('YYYY-MM-DD')}.csv`,
+            'Content-Type': 'text/csv'
+        }, '');
+    });
+
     mockMembersStats(server);
 }