Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

DEV: Option to add extra topic status icons in its widget and component 

and did some refactoring
This commit is contained in:
Vinoth Kannan 2019-03-13 15:17:26 +05:30
parent 243fb8d9ad
commit 135191d1d1
3 changed files with 43 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
app/assets/javascripts/discourse/components/topic-status.js.es6
View File

@ -1,6 +1,7 @@
import { iconHTML } from "discourse-common/lib/icon-library";
import { bufferedRender } from "discourse-common/lib/buffered-render";
import { escapeExpression } from "discourse/lib/utilities";
import TopicStatusIcons from "discourse/helpers/topic-status-icons";
export default Ember.Component.extend(
bufferedRender({
@ -30,7 +31,10 @@ export default Ember.Component.extend(
}.property("disableActions"),
buildBuffer(buffer) {
const renderIcon = function(name, key, actionable) {
const canAct = this.get("canAct");
TopicStatusIcons.render(this.get("topic"), function(name, key) {
const actionable = ["pinned", "unpinned"].includes(key) && canAct;
const title = escapeExpression(I18n.t(`topic_statuses.${key}.help`)),
startTag = actionable ? "a href" : "span",
endTag = actionable ? "a" : "span",
@ -40,32 +44,7 @@ export default Ember.Component.extend(
buffer.push(
`<${startTag} title='${title}' class='topic-status'>${icon}</${endTag}>`
);
};
const renderIconIf = (conditionProp, name, key, actionable) => {
if (!this.get(conditionProp)) {
return;
}
renderIcon(name, key, actionable);
};
renderIconIf("topic.is_warning", "envelope", "warning");
if (this.get("topic.closed") && this.get("topic.archived")) {
renderIcon("lock", "locked_and_archived");
} else {
renderIconIf("topic.closed", "lock", "locked");
renderIconIf("topic.archived", "lock", "archived");
}
renderIconIf("topic.pinned", "thumbtack", "pinned", this.get("canAct"));
renderIconIf(
"topic.unpinned",
"thumbtack",
"unpinned",
this.get("canAct")
);
renderIconIf("topic.invisible", "far-eye-slash", "unlisted");
});
}
})
);

28
app/assets/javascripts/discourse/helpers/topic-status-icons.js.es6 Normal file
View File

@ -0,0 +1,28 @@
export default Ember.ArrayProxy.extend({
render(topic, renderIcon) {
const renderIconIf = (conditionProp, name, key) => {
if (!topic.get(conditionProp)) {
return;
}
renderIcon(name, key);
};
if (topic.get("closed") && topic.get("archived")) {
renderIcon("lock", "locked_and_archived");
} else {
renderIconIf("closed", "lock", "locked");
renderIconIf("archived", "lock", "archived");
}
this.forEach(args => {
renderIconIf(...args);
});
}
}).create({
content: [
["is_warning", "envelope", "warning"],
["pinned", "thumbtack", "pinned"],
["unpinned", "thumbtack", "unpinned"],
["invisible", "far-eye-slash", "unlisted"]
]
});

36
app/assets/javascripts/discourse/widgets/topic-status.js.es6
View File

@ -2,16 +2,7 @@ import { createWidget } from "discourse/widgets/widget";
import { iconNode } from "discourse-common/lib/icon-library";
import { h } from "virtual-dom";
import { escapeExpression } from "discourse/lib/utilities";
function renderIcon(name, key, canAct) {
const iconArgs = key === "unpinned" ? { class: "unpinned" } : null,
icon = iconNode(name, iconArgs);
const attributes = {
title: escapeExpression(I18n.t(`topic_statuses.${key}.help`))
};
return h(`${canAct ? "a" : "span"}.topic-status`, attributes, icon);
}
import TopicStatusIcons from "discourse/helpers/topic-status-icons";
export default createWidget("topic-status", {
tagName: "div.topic-statuses",
@ -21,25 +12,16 @@ export default createWidget("topic-status", {
const canAct = this.currentUser && !attrs.disableActions;
const result = [];
const renderIconIf = (conditionProp, name, key) => {
if (!topic.get(conditionProp)) {
return;
}
result.push(renderIcon(name, key, canAct));
};
renderIconIf("is_warning", "envelope", "warning");
TopicStatusIcons.render(topic, function(name, key) {
const iconArgs = key === "unpinned" ? { class: "unpinned" } : null,
icon = iconNode(name, iconArgs);
if (topic.get("closed") && topic.get("archived")) {
renderIcon("lock", "locked_and_archived");
} else {
renderIconIf("closed", "lock", "locked");
renderIconIf("archived", "lock", "archived");
}
renderIconIf("pinned", "thumbtack", "pinned");
renderIconIf("unpinned", "thumbtack", "unpinned");
renderIconIf("invisible", "far-eye-slash", "unlisted");
const attributes = {
title: escapeExpression(I18n.t(`topic_statuses.${key}.help`))
};
result.push(h(`${canAct ? "a" : "span"}.topic-status`, attributes, icon));
});
return result;
}