UX: Introduce composer-actions when editing a post.

This commit is contained in:
Guo Xiang Tan 2020-05-14 13:56:45 +08:00
parent 5b603cb3ab
commit d7e230c1b9
No known key found for this signature in database
GPG Key ID: FBD110179AAC1F20
4 changed files with 52 additions and 25 deletions

View File

@ -23,7 +23,6 @@ export default Component.extend({
classNames: ["composer-action-title"],
options: alias("model.replyOptions"),
action: alias("model.action"),
isEditing: equal("action", EDIT),
@discourseComputed("options", "action")
actionTitle(opts, action) {

View File

@ -1,18 +1,14 @@
{{#if isEditing}}
{{d-icon "pencil-alt"}}
{{else}}
{{composer-actions
composerModel=model
replyOptions=model.replyOptions
canWhisper=canWhisper
openComposer=openComposer
closeComposer=closeComposer
action=model.action
tabindex=tabindex
topic=model.topic
post=model.post
}}
{{/if}}
{{composer-actions
composerModel=model
replyOptions=model.replyOptions
canWhisper=canWhisper
openComposer=openComposer
closeComposer=closeComposer
action=model.action
tabindex=tabindex
topic=model.topic
post=model.post
}}
<span class="action-title">
{{actionTitle}}

View File

@ -4,10 +4,12 @@ import {
PRIVATE_MESSAGE,
CREATE_TOPIC,
CREATE_SHARED_DRAFT,
REPLY
REPLY,
EDIT
} from "discourse/models/composer";
import Draft from "discourse/models/draft";
import { computed } from "@ember/object";
import { equal } from "@ember/object/computed";
import { camelize } from "@ember/string";
import { isEmpty } from "@ember/utils";
@ -24,13 +26,23 @@ export default DropdownSelectBoxComponent.extend({
seq: 0,
pluginApiIdentifiers: ["composer-actions"],
classNames: ["composer-actions"],
isEditing: equal("action", EDIT),
selectKitOptions: {
icon: "share",
icon: "iconForComposerAction",
filterable: false,
showFullTitle: false
},
iconForComposerAction: computed("action", function() {
switch (this.action) {
case EDIT:
return "pencil-alt";
default:
return "share";
}
}),
contentChanged() {
this.set("seq", this.seq + 1);
},
@ -54,6 +66,11 @@ export default DropdownSelectBoxComponent.extend({
this.contentChanged();
}
this.set(
"selectKit.options.icon",
this.action === EDIT ? "pencil-alt" : "share"
);
if (isEmpty(this.content)) {
this.set("selectKit.isHidden", true);
}
@ -69,6 +86,7 @@ export default DropdownSelectBoxComponent.extend({
if (
this.action !== CREATE_TOPIC &&
this.action !== CREATE_SHARED_DRAFT &&
!this.isEditing &&
_topicSnapshot
) {
items.push({
@ -100,7 +118,8 @@ export default DropdownSelectBoxComponent.extend({
if (
this.siteSettings.enable_personal_messages &&
this.action !== PRIVATE_MESSAGE
this.action !== PRIVATE_MESSAGE &&
!this.isEditing
) {
items.push({
name: I18n.t(
@ -115,12 +134,13 @@ export default DropdownSelectBoxComponent.extend({
}
if (
(this.action !== REPLY && _topicSnapshot) ||
(this.action === REPLY &&
_topicSnapshot &&
this.replyOptions.userAvatar &&
this.replyOptions.userLink &&
this.replyOptions.topicLink)
!this.isEditing &&
((this.action !== REPLY && _topicSnapshot) ||
(this.action === REPLY &&
_topicSnapshot &&
this.replyOptions.userAvatar &&
this.replyOptions.userLink &&
this.replyOptions.topicLink))
) {
items.push({
name: I18n.t("composer.composer_actions.reply_to_topic.label"),

View File

@ -339,6 +339,18 @@ QUnit.test(
}
);
QUnit.test("editing post", async assert => {
const composerActions = selectKit(".composer-actions");
await visit("/t/internationalization-localization/280");
await click("article#post_1 button.show-more-actions");
await click("article#post_1 button.edit");
await composerActions.expand();
assert.equal(composerActions.rows().length, 1);
assert.equal(composerActions.rowByIndex(0).value(), "reply_to_post");
});
acceptance("Composer Actions With New Topic Draft", {
loggedIn: true,
settings: {