discourse/app/assets/javascripts/admin/addon/controllers/admin-site-text-edit.js
Osama Sayegh 13cb472ec8
FIX: Refresh disabled state when switching between site texts (#32262)
Repro steps:

1. Go to `/admin/customize/site_texts`
2. Click edit on any translation
3. Go back by clicking on "Back to search"
4. Click edit on another translation
5. Change the text field in any way

Expected results:

The disabled state on the "Save changes" button is removed and you're
able to click it

Actual results:

The "Save changes" button remains disabled

This happens because the computed property for the button's disabled
state doesn't get re-evaluated when navigating between translation
strings because it doesn't include on the `siteText` property in its
dependent properties, so changing the site text doesn't invalidate the
old value for the disabled state and it always stays the same.

Meta topic:
https://meta.discourse.org/t/i-cant-save-edit-on-site-texts/360990?u=osama
2025-04-14 08:00:08 +03:00

83 lines
1.9 KiB
JavaScript

import { cached, tracked } from "@glimmer/tracking";
import Controller from "@ember/controller";
import { action } from "@ember/object";
import { dependentKeyCompat } from "@ember/object/compat";
import { service } from "@ember/service";
import BufferedProxy from "ember-buffered-proxy/proxy";
import { popupAjaxError } from "discourse/lib/ajax-error";
import discourseComputed from "discourse/lib/decorators";
import { i18n } from "discourse-i18n";
export default class AdminSiteTextEdit extends Controller {
@service dialog;
@tracked siteText;
saved = false;
queryParams = ["locale"];
@cached
@dependentKeyCompat
get buffered() {
return BufferedProxy.create({
content: this.siteText,
});
}
@discourseComputed("buffered.value", "siteText.value")
saveDisabled(value) {
return this.siteText.value === value;
}
@discourseComputed("siteText.status")
isOutdated(status) {
return status === "outdated";
}
@action
saveChanges() {
const attrs = this.buffered.getProperties("value");
attrs.locale = this.locale;
this.siteText
.save(attrs)
.then(() => {
this.buffered.applyChanges();
this.set("saved", true);
})
.catch(popupAjaxError);
}
@action
revertChanges() {
this.set("saved", false);
this.dialog.yesNoConfirm({
message: i18n("admin.site_text.revert_confirm"),
didConfirm: () => {
this.siteText
.revert(this.locale)
.then((props) => {
const buffered = this.buffered;
buffered.setProperties(props);
this.buffered.applyChanges();
})
.catch(popupAjaxError);
},
});
}
@action
dismissOutdated() {
this.siteText
.dismissOutdated(this.locale)
.then(() => {
this.siteText.set("status", "up_to_date");
})
.catch(popupAjaxError);
}
get interpolationKeys() {
return this.siteText.interpolation_keys.join(", ");
}
}