Fixed errors when enter key is pressed in modals
no issue - enter key when a modal is displayed will always trigger the `confirm` action, if it's not provided then the base modal will throw a `You must override the "confirm" action ...` error
This commit is contained in:
Kevin Ansfield
parent
178733a521
commit
909bd60db3
@ -19,6 +19,11 @@ export default ModalComponent.extend({
|
||||
this._signinUrlUpdateTask.perform();
|
||||
},
|
||||
|
||||
actions: {
|
||||
// noop - we don't want the enter key doing anything
|
||||
confirm() {}
|
||||
},
|
||||
|
||||
copySigninUrl: task(function* () {
|
||||
copyTextToClipboard(this.get('signinUrl'));
|
||||
yield timeout(1000);
|
||||
|
||||
@ -1,4 +1,8 @@
|
||||
import ModalComponent from 'ghost-admin/components/modal-base';
|
||||
|
||||
export default ModalComponent.extend({
|
||||
actions: {
|
||||
// noop - we don't want the enter key doing anything
|
||||
confirm() {}
|
||||
}
|
||||
});
|
||||
|
||||
@ -1,14 +1,16 @@
|
||||
<header class="modal-header" data-test-modal="delete-user" {{did-insert this.setup}}>
|
||||
<h1>Add subscription</h1>
|
||||
</header>
|
||||
<a class="close" href="" role="button" title="Close" {{action "closeModal" }}>{{svg-jar
|
||||
"close"}}<span class="hidden">Close</span></a>
|
||||
<a class="close" href="" role="button" title="Close" {{action "closeModal" }}>
|
||||
{{svg-jar "close"}}<span class="hidden">Close</span>
|
||||
</a>
|
||||
|
||||
<form>
|
||||
<div class="modal-body">
|
||||
<p class="gh-member-addcomp-subhed">Select a product for <strong>{{or
|
||||
this.member.name this.member.email}}</strong>'s complimentary
|
||||
subscription.</p>
|
||||
<p class="gh-member-addcomp-subhed">
|
||||
Select a product for <strong>{{or this.member.name this.member.email}}</strong>'s
|
||||
complimentary subscription.
|
||||
</p>
|
||||
{{#if this.activeSubscriptions.length}}
|
||||
<p class="gh-member-addcomp-warning">
|
||||
Adding a complimentary subscription cancels all existing subscriptions of this member.
|
||||
@ -43,8 +45,7 @@
|
||||
<button
|
||||
class="gh-btn"
|
||||
{{action "closeModal" }}
|
||||
{{!-- disable mouseDown so it does not trigger focus-out validations
|
||||
--}}
|
||||
{{!-- disable mouseDown so it does not trigger focus-out validations --}}
|
||||
{{action (optional this.noop) on="mouseDown" }}
|
||||
data-test-button="cancel-webhook">
|
||||
<span>Cancel</span>
|
||||
|
||||
@ -5,29 +5,15 @@ import {task} from 'ember-concurrency-decorators';
|
||||
import {tracked} from '@glimmer/tracking';
|
||||
|
||||
export default class ModalMemberProduct extends ModalComponent {
|
||||
@service
|
||||
store
|
||||
@service store;
|
||||
@service ghostPaths;
|
||||
@service ajax;
|
||||
|
||||
@service
|
||||
ghostPaths
|
||||
|
||||
@service
|
||||
ajax
|
||||
|
||||
@tracked
|
||||
price
|
||||
|
||||
@tracked
|
||||
product
|
||||
|
||||
@tracked
|
||||
products = []
|
||||
|
||||
@tracked
|
||||
selectedProduct = null;
|
||||
|
||||
@tracked
|
||||
loadingProducts = false;
|
||||
@tracked price;
|
||||
@tracked product;
|
||||
@tracked products = [];
|
||||
@tracked selectedProduct = null;
|
||||
@tracked loadingProducts = false;
|
||||
|
||||
@task({drop: true})
|
||||
*fetchProducts() {
|
||||
@ -69,9 +55,12 @@ export default class ModalMemberProduct extends ModalComponent {
|
||||
this.price = price;
|
||||
}
|
||||
|
||||
@task({
|
||||
drop: true
|
||||
})
|
||||
@action
|
||||
confirm() {
|
||||
return this.addProduct.perform();
|
||||
}
|
||||
|
||||
@task({drop: true})
|
||||
*addProduct() {
|
||||
let url = this.ghostPaths.url.api(`members/${this.member.get('id')}`);
|
||||
// Cancel existing active subscriptions for member
|
||||
|
||||
@ -24,8 +24,13 @@ export default ModalComponent.extend({
|
||||
this.label.rollbackAttributes();
|
||||
this.set('showDeleteLabelModal', true);
|
||||
},
|
||||
|
||||
validate(property) {
|
||||
return this.label.validate({property});
|
||||
},
|
||||
|
||||
confirm() {
|
||||
return this.saveTask.perform();
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -30,7 +30,10 @@ export default ModalComponent.extend({
|
||||
actions: {
|
||||
changeType(type) {
|
||||
this.set('type', type);
|
||||
}
|
||||
},
|
||||
|
||||
// noop - we don't want the enter key to do anything here
|
||||
confirm() {}
|
||||
},
|
||||
|
||||
renderEmailPreview: action(async function renderEmailPreview(iframe) {
|
||||
|
||||
@ -8,17 +8,22 @@ export default ModalComponent.extend({
|
||||
ajax: service(),
|
||||
store: service(),
|
||||
ghostPaths: service(),
|
||||
|
||||
errorMessage: null,
|
||||
|
||||
// Allowed actions
|
||||
confirm: () => {},
|
||||
|
||||
apiKey: alias('model.apiKey'),
|
||||
integration: alias('model.integration'),
|
||||
internalIntegration: alias('model.internalIntegration'),
|
||||
|
||||
actions: {
|
||||
confirm() {
|
||||
this.regenerateApiKey.perform();
|
||||
}
|
||||
},
|
||||
|
||||
regenerateKey: task(function* () {
|
||||
let url = this.get('ghostPaths.url').api('/integrations/', this.integration.id, 'api_key', this.apiKey.id, 'refresh');
|
||||
try {
|
||||
|
||||
@ -21,7 +21,7 @@
|
||||
class="gh-btn gh-btn-black"
|
||||
{{action "closeModal"}}
|
||||
{{action (optional this.noop) on="mouseDown"}}
|
||||
data-test-button="cancel-webhook"
|
||||
data-test-button="stripe-connect-ok"
|
||||
>
|
||||
<span>OK</span>
|
||||
</button>
|
||||
|
||||
@ -32,4 +32,14 @@ export default class ModalStripeConnect extends ModalBase {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
actions = {
|
||||
confirm() {
|
||||
if (this.settings.get('stripeConnectAccountId')) {
|
||||
return this.send('closeModal');
|
||||
}
|
||||
|
||||
// noop - enter key shouldn't do anything
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -9,5 +9,11 @@ export default ModalComponent.extend({
|
||||
warnings: reads('model.warnings'),
|
||||
errors: reads('model.errors'),
|
||||
fatalErrors: reads('model.fatalErrors'),
|
||||
canActivate: reads('model.canActivate')
|
||||
canActivate: reads('model.canActivate'),
|
||||
|
||||
actions: {
|
||||
confirm() {
|
||||
this.send('closeModal');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@ -5,8 +5,12 @@ export default ModalComponent.extend({
|
||||
router: service(),
|
||||
|
||||
actions: {
|
||||
upgrade: function () {
|
||||
upgrade() {
|
||||
this.router.transitionTo('pro');
|
||||
},
|
||||
|
||||
confirm() {
|
||||
this.send('upgrade');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@ -5,8 +5,12 @@ export default ModalComponent.extend({
|
||||
router: service(),
|
||||
|
||||
actions: {
|
||||
upgrade: function () {
|
||||
upgrade() {
|
||||
this.router.transitionTo('pro');
|
||||
},
|
||||
|
||||
confirm() {
|
||||
this.send('upgrade');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@ -11,9 +11,14 @@ export default ModalComponent.extend({
|
||||
|
||||
return {limit, total, message};
|
||||
}),
|
||||
|
||||
actions: {
|
||||
upgrade: function () {
|
||||
upgrade() {
|
||||
this.router.transitionTo('pro');
|
||||
},
|
||||
|
||||
confirm() {
|
||||
this.send('upgrade');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@ -5,8 +5,12 @@ export default ModalComponent.extend({
|
||||
router: service(),
|
||||
|
||||
actions: {
|
||||
upgrade: function () {
|
||||
upgrade() {
|
||||
this.router.transitionTo('pro');
|
||||
},
|
||||
|
||||
confirm() {
|
||||
this.send('upgrade');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@ -4,5 +4,10 @@ import {inject as service} from '@ember/service';
|
||||
export default ModalComponent.extend({
|
||||
whatsNew: service(),
|
||||
|
||||
confirm() {}
|
||||
confirm() {},
|
||||
|
||||
actions: {
|
||||
// noop - enter key shouldn't do anything
|
||||
confirm() {}
|
||||
}
|
||||
});
|
||||
|
||||
Loading…
Reference in New Issue
Block a user