mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-04-15 03:01:37 -05:00
Refactored delete all content modal
refs https://github.com/TryGhost/Team/issues/1734 refs https://github.com/TryGhost/Team/issues/559 refs https://github.com/TryGhost/Ghost/issues/14101 - switches to newer modal patterns ready for later Ember upgrades
This commit is contained in:
Kevin Ansfield
parent
556a2a8ee9
commit
5bbdad38a5
9 changed files with 75 additions and 77 deletions
|
|
@ -1004,3 +1004,5 @@ add|ember-template-lint|require-input-label|47|32|47|32|8e299cf5bf0e93e054410239
|
|||
remove|ember-template-lint|no-action|22|85|22|85|8024e7e42cf37a5954ea4db401cbf123931da388|1658102400000|1668474000000|1673658000000|app/templates/tag.hbs
|
||||
remove|ember-template-lint|no-action|41|17|41|17|712a767fa44489687284ef2aa32c1acc5221afce|1658102400000|1668474000000|1673658000000|app/templates/tag.hbs
|
||||
remove|ember-template-lint|no-action|42|15|42|15|d3fea3e454ca345739d46caf51afd85a3eea1041|1658102400000|1668474000000|1673658000000|app/templates/tag.hbs
|
||||
remove|ember-template-lint|no-action|76|82|76|82|81c7e8a314b8c2d62ceb49a48b20664192cdef22|1658102400000|1668474000000|1673658000000|app/templates/settings/labs.hbs
|
||||
remove|ember-template-lint|no-action|237|15|237|15|81c7e8a314b8c2d62ceb49a48b20664192cdef22|1658102400000|1668474000000|1673658000000|app/templates/settings/labs.hbs
|
||||
|
|
|
|||
|
|
@ -1,13 +0,0 @@
|
|||
<header class="modal-header">
|
||||
<h1>Would you really like to delete all content from your blog?</h1>
|
||||
</header>
|
||||
<a class="close" href="" role="button" title="Close" {{action "closeModal"}}>{{svg-jar "close"}}<span class="hidden">Close</span></a>
|
||||
|
||||
<div class="modal-body">
|
||||
<p>This is permanent! No backups, no restores, no magic undo button. We warned you, k?</p>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<button class="gh-btn" type="button" {{action "closeModal"}}><span>Cancel</span></button>
|
||||
<GhTaskButton @buttonText="Delete" @successText="Deleted" @task={{this.deleteAll}} @class="gh-btn gh-btn-red gh-btn-icon" />
|
||||
</div>
|
||||
|
|
@ -1,47 +0,0 @@
|
|||
import ModalComponent from 'ghost-admin/components/modal-base';
|
||||
import {inject as service} from '@ember/service';
|
||||
import {task} from 'ember-concurrency';
|
||||
|
||||
export default ModalComponent.extend({
|
||||
|
||||
ghostPaths: service(),
|
||||
notifications: service(),
|
||||
store: service(),
|
||||
ajax: service(),
|
||||
|
||||
actions: {
|
||||
confirm() {
|
||||
this.deleteAll.perform();
|
||||
}
|
||||
},
|
||||
|
||||
_deleteAll() {
|
||||
let deleteUrl = this.get('ghostPaths.url').api('db');
|
||||
return this.ajax.del(deleteUrl);
|
||||
},
|
||||
|
||||
_unloadData() {
|
||||
this.store.unloadAll('post');
|
||||
this.store.unloadAll('tag');
|
||||
},
|
||||
|
||||
_showSuccess() {
|
||||
this.notifications.showAlert('All content deleted from database.', {type: 'success', key: 'all-content.delete.success'});
|
||||
},
|
||||
|
||||
_showFailure(error) {
|
||||
this.notifications.showAPIError(error, {key: 'all-content.delete'});
|
||||
},
|
||||
|
||||
deleteAll: task(function* () {
|
||||
try {
|
||||
yield this._deleteAll();
|
||||
this._unloadData();
|
||||
this._showSuccess();
|
||||
} catch (error) {
|
||||
this._showFailure(error);
|
||||
} finally {
|
||||
this.send('closeModal');
|
||||
}
|
||||
}).drop()
|
||||
});
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<div class="modal-content" data-test-modal="confirm-delete-all">
|
||||
<header class="modal-header">
|
||||
<h1>Would you really like to delete all content from your blog?</h1>
|
||||
</header>
|
||||
<button type="button" class="close" title="Close" {{on "click" @close}}>{{svg-jar "close"}}<span class="hidden">Close</span></button>
|
||||
|
||||
<div class="modal-body">
|
||||
<p>This is permanent! No backups, no restores, no magic undo button. We warned you, k?</p>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<button class="gh-btn" type="button" {{on "click" @close}}><span>Cancel</span></button>
|
||||
<GhTaskButton @buttonText="Delete" @successText="Deleted" @task={{this.deleteAllTask}} @class="gh-btn gh-btn-red gh-btn-icon" data-test-button="confirm" />
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
import Component from '@glimmer/component';
|
||||
import {inject as service} from '@ember/service';
|
||||
import {task} from 'ember-concurrency';
|
||||
|
||||
export default class DeleteAllContentModal extends Component {
|
||||
@service ajax;
|
||||
@service ghostPaths;
|
||||
@service notifications;
|
||||
@service router;
|
||||
@service store;
|
||||
|
||||
@task({drop: true})
|
||||
*deleteAllTask() {
|
||||
try {
|
||||
const deleteUrl = this.ghostPaths.url.api('db');
|
||||
yield this.ajax.del(deleteUrl);
|
||||
|
||||
this.store.unloadAll('post');
|
||||
this.store.unloadAll('tag');
|
||||
|
||||
this.notifications.showAlert('All content deleted from database.', {type: 'success', key: 'all-content.delete.success'});
|
||||
} catch (error) {
|
||||
this.notifications.showAPIError(error, {key: 'all-content.delete'});
|
||||
} finally {
|
||||
this.args.close();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -2,6 +2,7 @@ import classic from 'ember-classic-decorator';
|
|||
import {inject as service} from '@ember/service';
|
||||
/* eslint-disable ghost/ember/alias-model-in-controller */
|
||||
import Controller from '@ember/controller';
|
||||
import DeleteAllModal from '../../components/settings/labs/delete-all-content-modal';
|
||||
import RSVP from 'rsvp';
|
||||
import config from 'ghost-admin/config/environment';
|
||||
import {
|
||||
|
|
@ -40,6 +41,7 @@ export default class LabsController extends Controller {
|
|||
@service config;
|
||||
@service feature;
|
||||
@service ghostPaths;
|
||||
@service modals;
|
||||
@service notifications;
|
||||
@service session;
|
||||
@service settings;
|
||||
|
|
@ -47,7 +49,6 @@ export default class LabsController extends Controller {
|
|||
|
||||
importErrors = null;
|
||||
importSuccessful = false;
|
||||
showDeleteAllModal = false;
|
||||
showEarlyAccessModal = false;
|
||||
submitting = false;
|
||||
uploadButtonText = 'Import';
|
||||
|
|
@ -142,8 +143,8 @@ export default class LabsController extends Controller {
|
|||
}
|
||||
|
||||
@action
|
||||
toggleDeleteAllModal() {
|
||||
this.toggleProperty('showDeleteAllModal');
|
||||
confirmDeleteAll() {
|
||||
return this.modals.open(DeleteAllModal);
|
||||
}
|
||||
|
||||
@action
|
||||
|
|
|
|||
|
|
@ -73,7 +73,7 @@
|
|||
<h4 class="gh-expandable-title">Delete all content</h4>
|
||||
<p class="gh-expandable-description">Permanently delete all posts and tags from the database, a hard reset</p>
|
||||
</div>
|
||||
<button type="button" class="gh-btn gh-btn-red js-delete" {{action "toggleDeleteAllModal"}}><span>Delete</span></button>
|
||||
<button type="button" class="gh-btn gh-btn-red" {{on "click" this.confirmDeleteAll}} data-test-button="delete-all"><span>Delete</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -256,10 +256,4 @@
|
|||
</div>
|
||||
{{/if}}
|
||||
</section>
|
||||
</section>
|
||||
|
||||
{{#if this.showDeleteAllModal}}
|
||||
<GhFullscreenModal @modal="delete-all"
|
||||
@close={{action "toggleDeleteAllModal"}}
|
||||
@modifier="action wide" />
|
||||
{{/if}}
|
||||
</section>
|
||||
|
|
@ -68,6 +68,13 @@ export default function () {
|
|||
return {};
|
||||
});
|
||||
|
||||
/* Delete all ----------------------------------------------------------- */
|
||||
|
||||
this.del('/db', function (db) {
|
||||
db.posts.all().remove();
|
||||
db.tags.all().remove();
|
||||
}, 204);
|
||||
|
||||
/* External sites ------------------------------------------------------- */
|
||||
|
||||
this.head('http://www.gravatar.com/avatar/:md5', function () {
|
||||
|
|
|
|||
|
|
@ -58,7 +58,7 @@ describe('Acceptance: Settings - Labs', function () {
|
|||
return await authenticateSession();
|
||||
});
|
||||
|
||||
it.skip('it renders, loads modals correctly', async function () {
|
||||
it('it renders', async function () {
|
||||
await visit('/settings/labs');
|
||||
|
||||
// has correct url
|
||||
|
|
@ -68,14 +68,25 @@ describe('Acceptance: Settings - Labs', function () {
|
|||
expect(document.title, 'page title').to.equal('Settings - Labs - Test Blog');
|
||||
|
||||
// highlights nav menu
|
||||
expect(find('[data-test-nav="labs"]'), 'highlights nav menu item')
|
||||
expect(find('[data-test-nav="settings"]'), 'highlights nav menu item')
|
||||
.to.have.class('active');
|
||||
});
|
||||
|
||||
await click('#settings-resetdb .js-delete');
|
||||
expect(findAll('.fullscreen-modal .modal-content').length, 'modal element').to.equal(1);
|
||||
it('can delete all content', async function () {
|
||||
await visit('/settings/labs');
|
||||
await click('[data-test-button="delete-all"]');
|
||||
|
||||
await click('.fullscreen-modal .modal-footer .gh-btn');
|
||||
expect(findAll('.fullscreen-modal').length, 'modal element').to.equal(0);
|
||||
const modal = '[data-test-modal="confirm-delete-all"]';
|
||||
expect(find(modal)).to.exist;
|
||||
|
||||
await click(`${modal} [data-test-button="confirm"]`);
|
||||
|
||||
// API request is correct
|
||||
const [lastRequest] = this.server.pretender.handledRequests.slice(-1);
|
||||
expect(lastRequest.url).to.equal('/ghost/api/admin/db/');
|
||||
expect(lastRequest.method).to.equal('DELETE');
|
||||
|
||||
expect(find(modal)).to.not.exist;
|
||||
});
|
||||
|
||||
it('can upload/download redirects', async function () {
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue