diff --git a/ghost/admin/app/components/gh-members-lab-setting.js b/ghost/admin/app/components/gh-members-lab-setting.js index 9bde953e05..a768a5a5c8 100644 --- a/ghost/admin/app/components/gh-members-lab-setting.js +++ b/ghost/admin/app/components/gh-members-lab-setting.js @@ -1,12 +1,26 @@ import Component from '@ember/component'; import {computed} from '@ember/object'; import {inject as service} from '@ember/service'; +import {set} from '@ember/object'; + +const US = {flag: 'πΊπΈ', name: 'US', baseUrl: 'https://api.mailgun.net/v3'}; +const EU = {flag: 'πͺπΊ', name: 'EU', baseUrl: 'https://api.eu.mailgun.net/v3'}; export default Component.extend({ feature: service(), config: service(), mediaQueries: service(), + mailgunRegion: computed('settings.bulkEmailSettings.baseUrl', function () { + if (!this.settings.get('bulkEmailSettings.baseUrl')) { + return US; + } + + return [US, EU].find((region) => { + return region.baseUrl === this.settings.get('bulkEmailSettings.baseUrl'); + }); + }), + blogDomain: computed('config.blogDomain', function () { let domain = this.config.blogDomain || ''; const host = domain.replace('https://', '').replace('http://', '').split('/'); @@ -35,7 +49,7 @@ export default Component.extend({ bulkEmailSettings: computed('settings.bulkEmailSettings', function () { let bulkEmailSettings = this.get('settings.bulkEmailSettings') || {}; - const {apiKey = '', baseUrl = '', domain = ''} = bulkEmailSettings; + const {apiKey = '', baseUrl = US.baseUrl, domain = ''} = bulkEmailSettings; return {apiKey, baseUrl, domain}; }), @@ -48,6 +62,11 @@ export default Component.extend({ return this.get('settings.defaultContentVisibility'); }), + init() { + this._super(...arguments); + this.set('mailgunRegions', [US, EU]); + }, + actions: { setDefaultContentVisibility(value) { this.setDefaultContentVisibility(value); @@ -55,6 +74,14 @@ export default Component.extend({ setBulkEmailSettings(key, event) { let bulkEmailSettings = this.get('settings.bulkEmailSettings') || {}; bulkEmailSettings[key] = event.target.value; + if (!bulkEmailSettings.baseUrl) { + set(bulkEmailSettings, 'baseUrl', US.baseUrl); + } + this.setBulkEmailSettings(bulkEmailSettings); + }, + setBulkEmailRegion(region) { + let bulkEmailSettings = this.get('settings.bulkEmailSettings') || {}; + set(bulkEmailSettings, 'baseUrl', region.baseUrl); this.setBulkEmailSettings(bulkEmailSettings); }, setSubscriptionSettings(key, event) { diff --git a/ghost/admin/app/controllers/settings/labs.js b/ghost/admin/app/controllers/settings/labs.js index 53b146988d..9c4c0d7306 100644 --- a/ghost/admin/app/controllers/settings/labs.js +++ b/ghost/admin/app/controllers/settings/labs.js @@ -53,6 +53,7 @@ export default Controller.extend({ jsonMimeType: null, yamlExtension: null, yamlMimeType: null, + init() { this._super(...arguments); this.importMimeType = IMPORT_MIME_TYPES; diff --git a/ghost/admin/app/styles/components/power-select.css b/ghost/admin/app/styles/components/power-select.css index 59987d2916..a725ff8e97 100644 --- a/ghost/admin/app/styles/components/power-select.css +++ b/ghost/admin/app/styles/components/power-select.css @@ -240,3 +240,13 @@ stroke: var(--blue); fill: var(--blue); } + +/* Inside settings */ +/* TODO: make these general styles? */ + +.form-group .ember-power-select-trigger { + padding: 6px 12px; +} +.form-group .ember-power-select-selected-item { + margin-left: 0; +} diff --git a/ghost/admin/app/templates/components/gh-members-lab-setting.hbs b/ghost/admin/app/templates/components/gh-members-lab-setting.hbs index 437a152064..f0a1062acf 100644 --- a/ghost/admin/app/templates/components/gh-members-lab-setting.hbs +++ b/ghost/admin/app/templates/components/gh-members-lab-setting.hbs @@ -185,14 +185,24 @@