2019-10-23 12:30:52 -04:00
|
|
|
import Component from "@ember/component";
|
2018-06-15 11:03:24 -04:00
|
|
|
import { iconHTML } from "discourse-common/lib/icon-library";
|
|
|
|
import { bufferedRender } from "discourse-common/lib/buffered-render";
|
2017-02-20 08:42:33 -05:00
|
|
|
|
2019-10-23 12:30:52 -04:00
|
|
|
export default Component.extend(
|
2018-06-15 11:03:24 -04:00
|
|
|
bufferedRender({
|
|
|
|
tagName: "th",
|
|
|
|
classNames: ["sortable"],
|
|
|
|
rerenderTriggers: ["order", "ascending"],
|
2017-02-20 08:42:33 -05:00
|
|
|
|
2018-06-15 11:03:24 -04:00
|
|
|
buildBuffer(buffer) {
|
2019-05-27 04:15:39 -04:00
|
|
|
const icon = this.icon;
|
2017-02-20 08:42:33 -05:00
|
|
|
|
2018-06-15 11:03:24 -04:00
|
|
|
if (icon) {
|
|
|
|
buffer.push(iconHTML(icon));
|
|
|
|
}
|
2017-02-20 08:42:33 -05:00
|
|
|
|
2019-05-27 04:15:39 -04:00
|
|
|
buffer.push(I18n.t(this.i18nKey));
|
2017-02-20 08:42:33 -05:00
|
|
|
|
2019-05-27 04:15:39 -04:00
|
|
|
if (this.field === this.order) {
|
|
|
|
buffer.push(iconHTML(this.ascending ? "chevron-up" : "chevron-down"));
|
2018-06-15 11:03:24 -04:00
|
|
|
}
|
|
|
|
},
|
2017-02-20 08:42:33 -05:00
|
|
|
|
2018-06-15 11:03:24 -04:00
|
|
|
click() {
|
2019-05-27 04:15:39 -04:00
|
|
|
const currentOrder = this.order;
|
|
|
|
const field = this.field;
|
2017-02-20 08:42:33 -05:00
|
|
|
|
2018-06-15 11:03:24 -04:00
|
|
|
if (currentOrder === field) {
|
2019-05-27 04:15:39 -04:00
|
|
|
this.set("ascending", this.ascending ? null : true);
|
2018-06-15 11:03:24 -04:00
|
|
|
} else {
|
|
|
|
this.setProperties({ order: field, ascending: null });
|
|
|
|
}
|
2017-02-20 08:42:33 -05:00
|
|
|
}
|
2018-06-15 11:03:24 -04:00
|
|
|
})
|
|
|
|
);
|