mirror of
https://github.com/discourse/discourse.git
synced 2024-11-22 15:25:35 +08:00
FIX: Checkbox value should not leak between themes (#11327)
This commit includes a hack to ensure didInsertElement is called only once.
This commit is contained in:
parent
4b538e7cb9
commit
2742595b00
|
@ -1,42 +1,44 @@
|
|||
import I18n from "I18n";
|
||||
import Component from "@ember/component";
|
||||
import discourseComputed, { observes } from "discourse-common/utils/decorators";
|
||||
import { action } from "@ember/object";
|
||||
import discourseComputed from "discourse-common/utils/decorators";
|
||||
|
||||
export default Component.extend({
|
||||
classNames: ["inline-edit"],
|
||||
|
||||
checked: null,
|
||||
checkedInternal: null,
|
||||
buffer: null,
|
||||
bufferModelId: null,
|
||||
|
||||
init() {
|
||||
didReceiveAttrs() {
|
||||
this._super(...arguments);
|
||||
|
||||
this.set("checkedInternal", this.checked);
|
||||
if (this.modelId !== this.bufferModelId) {
|
||||
// HACK: The condition above ensures this method is called only when its
|
||||
// attributes are changed (i.e. only when `checked` changes).
|
||||
//
|
||||
// Reproduction steps: navigate to theme #1, switch to theme #2 from the
|
||||
// left-side panel, then switch back to theme #1 and click on the <input>
|
||||
// element wrapped by this component. It will call `didReceiveAttrs` even
|
||||
// though none of the attributes have changed (only `buffer` does).
|
||||
this.setProperties({
|
||||
buffer: this.checked,
|
||||
bufferModelId: this.modelId,
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
@observes("checked")
|
||||
checkedChanged() {
|
||||
this.set("checkedInternal", this.checked);
|
||||
@discourseComputed("checked", "buffer")
|
||||
changed(checked, buffer) {
|
||||
return !!checked !== !!buffer;
|
||||
},
|
||||
|
||||
@discourseComputed("labelKey")
|
||||
label(key) {
|
||||
return I18n.t(key);
|
||||
@action
|
||||
apply() {
|
||||
this.set("checked", this.buffer);
|
||||
this.action();
|
||||
},
|
||||
|
||||
@discourseComputed("checked", "checkedInternal")
|
||||
changed(checked, checkedInternal) {
|
||||
return !!checked !== !!checkedInternal;
|
||||
},
|
||||
|
||||
actions: {
|
||||
cancelled() {
|
||||
this.set("checkedInternal", this.checked);
|
||||
},
|
||||
|
||||
finished() {
|
||||
this.set("checked", this.checkedInternal);
|
||||
this.action();
|
||||
},
|
||||
@action
|
||||
cancel() {
|
||||
this.set("buffer", this.checked);
|
||||
},
|
||||
});
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
<label class="checkbox-label">
|
||||
{{input type="checkbox" disabled=disabled checked=checkedInternal}}
|
||||
{{label}}
|
||||
{{input type="checkbox" disabled=disabled checked=buffer}}
|
||||
{{i18n labelKey}}
|
||||
</label>
|
||||
{{#if changed}}
|
||||
{{d-button action=(action "finished") class="btn-primary btn-small submit-edit" icon="check"}}
|
||||
{{d-button action=(action "cancelled") class="btn-small cancel-edit" icon="times"}}
|
||||
{{d-button action=(action "apply") class="btn-primary btn-small submit-edit" icon="check"}}
|
||||
{{d-button action=(action "cancel") class="btn-small cancel-edit" icon="times"}}
|
||||
{{/if}}
|
||||
|
|
|
@ -42,7 +42,7 @@
|
|||
|
||||
<div class="admin-controls">
|
||||
{{#if model.theme_id}}
|
||||
{{inline-edit-checkbox action=(action "applyUserSelectable") labelKey="admin.customize.theme.color_scheme_user_selectable" checked=model.user_selectable}}
|
||||
{{inline-edit-checkbox action=(action "applyUserSelectable") labelKey="admin.customize.theme.color_scheme_user_selectable" checked=model.user_selectable modelId=model.id}}
|
||||
{{else}}
|
||||
<label>
|
||||
{{input type="checkbox" checked=model.user_selectable}}
|
||||
|
|
|
@ -141,11 +141,11 @@
|
|||
{{#if showCheckboxes}}
|
||||
<div class="control-unit">
|
||||
{{#unless model.component}}
|
||||
{{inline-edit-checkbox action=(action "applyDefault") labelKey="admin.customize.theme.is_default" checked=model.default}}
|
||||
{{inline-edit-checkbox action=(action "applyUserSelectable") labelKey="admin.customize.theme.user_selectable" checked=model.user_selectable}}
|
||||
{{inline-edit-checkbox action=(action "applyDefault") labelKey="admin.customize.theme.is_default" checked=model.default modelId=model.id}}
|
||||
{{inline-edit-checkbox action=(action "applyUserSelectable") labelKey="admin.customize.theme.user_selectable" checked=model.user_selectable modelId=model.id}}
|
||||
{{/unless}}
|
||||
{{#if model.remote_theme}}
|
||||
{{inline-edit-checkbox action=(action "applyAutoUpdateable") labelKey="admin.customize.theme.auto_update" checked=model.auto_update}}
|
||||
{{inline-edit-checkbox action=(action "applyAutoUpdateable") labelKey="admin.customize.theme.auto_update" checked=model.auto_update modelId=model.id}}
|
||||
{{/if}}
|
||||
</div>
|
||||
{{/if}}
|
||||
|
|
Loading…
Reference in New Issue
Block a user