Added custom theme setting visibility (#17763)

refs https://github.com/TryGhost/Product/issues/3716
This commit is contained in:
Michael Barrett 2023-08-21 11:26:51 +01:00 committed by GitHub
parent d0c95a37e1
commit 0ea5f9228d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 30 additions and 8 deletions

View File

@ -586,3 +586,5 @@ remove|ember-template-lint|no-action|401|46|401|46|df19e5858021b80de54052c953e70
remove|ember-template-lint|no-action|433|46|433|46|3afa41e4d86dd7e5c049a762f0f761c2464a5f96|1688342400000|1698714000000|1703898000000|app/components/gh-portal-links.hbs
remove|ember-template-lint|no-action|465|46|465|46|f2f0f3f512f141fdd821333c873f5052813bb491|1688342400000|1698714000000|1703898000000|app/components/gh-portal-links.hbs
remove|ember-template-lint|no-unused-block-params|1|0|1|0|e25f7866ab4ee682b08edf3b29a1351e4079538e|1688342400000|1698714000000|1703898000000|lib/koenig-editor/addon/components/koenig-card-header.hbs
remove|ember-template-lint|no-invalid-interactive|7|32|7|32|508e64575a985432d0588f3291a126c4b62e68d8|1688342400000|1698714000000|1703898000000|app/components/gh-nav-menu/design.hbs
add|ember-template-lint|no-invalid-interactive|7|32|7|32|2da5baf637c4f17f4acd498968b6022ffc0f3105|1692316800000|1702688400000|1707872400000|app/components/gh-nav-menu/design.hbs

View File

@ -33,7 +33,7 @@
<div class="gh-nav-design-settings" data-test-nav-group={{group.key}}>
<Settings::Design::ThemeSettingsForm
@themeSettings={{group.settings}}
@updatePreview={{perform this.themeManagement.updatePreviewHtmlTask}}
@onChange={{this.handleThemeSettingChange}}
/>
</div>
{{/liquid-if}}

View File

@ -70,6 +70,12 @@ export default class DesignMenuComponent extends Component {
this.openSection = null;
}
@action
handleThemeSettingChange() {
this.customThemeSettings.rebuildSettingGroups();
this.themeManagement.updatePreviewHtmlTask.perform();
}
openDefaultSection() {
const noCustomSettings = isEmpty(this.customThemeSettings.settings);

View File

@ -2,19 +2,19 @@
<form>
{{#each @themeSettings as |setting index|}}
{{#if (eq setting.type "select")}}
<CustomThemeSettings::Select @setting={{setting}} @index={{index}} @onChange={{@updatePreview}} />
<CustomThemeSettings::Select @setting={{setting}} @index={{index}} @onChange={{@onChange}} />
{{/if}}
{{#if (eq setting.type "boolean")}}
<CustomThemeSettings::Boolean @setting={{setting}} @index={{index}} @onChange={{@updatePreview}} />
<CustomThemeSettings::Boolean @setting={{setting}} @index={{index}} @onChange={{@onChange}} />
{{/if}}
{{#if (eq setting.type "color")}}
<CustomThemeSettings::Color @setting={{setting}} @index={{index}} @onChange={{@updatePreview}} />
<CustomThemeSettings::Color @setting={{setting}} @index={{index}} @onChange={{@onChange}} />
{{/if}}
{{#if (eq setting.type "text")}}
<CustomThemeSettings::Text @setting={{setting}} @index={{index}} @onChange={{@updatePreview}} />
<CustomThemeSettings::Text @setting={{setting}} @index={{index}} @onChange={{@onChange}} />
{{/if}}
{{#if (eq setting.type "image")}}
<CustomThemeSettings::Image @setting={{setting}} @index={{index}} @onChange={{@updatePreview}} />
<CustomThemeSettings::Image @setting={{setting}} @index={{index}} @onChange={{@onChange}} />
{{/if}}
{{/each}}
</form>

View File

@ -7,5 +7,6 @@ export default Model.extend({
options: attr(),
default: attr('string'),
value: attr(),
group: attr('string')
group: attr('string'),
visibility: attr('string')
});

View File

@ -1,4 +1,5 @@
import Service, {inject as service} from '@ember/service';
import nql from '@tryghost/nql';
import {isEmpty} from '@ember/utils';
import {run} from '@ember/runloop';
import {task} from 'ember-concurrency';
@ -92,6 +93,10 @@ export default class CustomThemeSettingsServices extends Service {
this.settings.forEach(setting => setting.rollbackAttributes());
}
rebuildSettingGroups() {
this.settingGroups = this._buildSettingGroups(this.settings);
}
_buildSettingGroups(settings) {
if (!settings || !settings.length) {
return [];
@ -111,7 +116,15 @@ export default class CustomThemeSettingsServices extends Service {
}
this.KNOWN_GROUPS.forEach((knownGroup) => {
const groupSettings = settings.filter(setting => setting.group === knownGroup.key);
const groupSettings = settings
.filter(setting => setting.group === knownGroup.key)
.filter((setting) => {
if (setting.visibility) {
return nql(setting.visibility).queryJSON(this.keyValueObject);
}
return true;
});
if (groupSettings.length) {
groups.push(Object.assign({}, knownGroup, {settings: groupSettings}));