FIX: Change wording from title -> name in channel about page (#19889)
We refer to the channel name rather than title elsewhere (including the new channel modal), so we should be consistent. Title is an internal abstraction, since DM channels cannot have names (currently). Also change the name field on channel edit to a input type="text" rather than a textarea, since we don't want a huge input here.
This commit is contained in:
parent
3483285b89
commit
31f6811a93
|
@ -18,22 +18,22 @@
|
|||
<div class="chat-form__section">
|
||||
<div class="chat-form__field">
|
||||
<label class="chat-form__label">
|
||||
<span>{{i18n "chat.about_view.title"}}</span>
|
||||
<span>{{i18n "chat.about_view.name"}}</span>
|
||||
{{#if (chat-guardian "can-edit-chat-channel")}}
|
||||
<div class="chat-form__label-actions">
|
||||
<DButton
|
||||
@class="edit-title-btn btn-flat"
|
||||
@class="edit-name-btn btn-flat"
|
||||
@label="chat.channel_settings.edit"
|
||||
@action={{if
|
||||
this.onEditChatChannelTitle
|
||||
this.onEditChatChannelTitle
|
||||
this.onEditChatChannelName
|
||||
this.onEditChatChannelName
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
{{/if}}
|
||||
</label>
|
||||
<div class="chat-form__control">
|
||||
<div class="channel-info-about-view__title">
|
||||
<div class="channel-info-about-view__name">
|
||||
{{replace-emoji this.channel.escapedTitle}}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -5,7 +5,7 @@ export default class ChatChannelAboutView extends Component {
|
|||
@service chat;
|
||||
tagName = "";
|
||||
channel = null;
|
||||
onEditChatChannelTitle = null;
|
||||
onEditChatChannelName = null;
|
||||
onEditChatChannelDescription = null;
|
||||
isLoading = false;
|
||||
}
|
||||
|
|
|
@ -6,30 +6,30 @@ export default class ChatChannelEditTitleController extends Controller.extend(
|
|||
ModalFunctionality
|
||||
) {
|
||||
@service chatApi;
|
||||
editedTitle = "";
|
||||
editedName = "";
|
||||
|
||||
@computed("model.title", "editedTitle")
|
||||
@computed("model.title", "editedName")
|
||||
get isSaveDisabled() {
|
||||
return (
|
||||
this.model.title === this.editedTitle ||
|
||||
this.editedTitle?.length > this.siteSettings.max_topic_title_length
|
||||
this.model.title === this.editedName ||
|
||||
this.editedName?.length > this.siteSettings.max_topic_title_length
|
||||
);
|
||||
}
|
||||
|
||||
onShow() {
|
||||
this.set("editedTitle", this.model.title || "");
|
||||
this.set("editedName", this.model.title || "");
|
||||
}
|
||||
|
||||
onClose() {
|
||||
this.set("editedTitle", "");
|
||||
this.set("editedName", "");
|
||||
this.clearFlash();
|
||||
}
|
||||
|
||||
@action
|
||||
onSaveChatChannelTitle() {
|
||||
onSaveChatChannelName() {
|
||||
return this.chatApi
|
||||
.updateChannel(this.model.id, {
|
||||
name: this.editedTitle,
|
||||
name: this.editedName,
|
||||
})
|
||||
.then((result) => {
|
||||
this.model.set("title", result.channel.title);
|
||||
|
@ -43,8 +43,8 @@ export default class ChatChannelEditTitleController extends Controller.extend(
|
|||
}
|
||||
|
||||
@action
|
||||
onChangeChatChannelTitle(title) {
|
||||
onChangeChatChannelName(title) {
|
||||
this.clearFlash();
|
||||
this.set("editedTitle", title);
|
||||
this.set("editedName", title);
|
||||
}
|
||||
}
|
|
@ -7,8 +7,8 @@ export default class ChatChannelInfoAboutController extends Controller.extend(
|
|||
ModalFunctionality
|
||||
) {
|
||||
@action
|
||||
onEditChatChannelTitle() {
|
||||
showModal("chat-channel-edit-title", { model: this.model });
|
||||
onEditChatChannelName() {
|
||||
showModal("chat-channel-edit-name", { model: this.model });
|
||||
}
|
||||
|
||||
@action
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<ChatChannelAboutView
|
||||
@channel={{this.model}}
|
||||
@onEditChatChannelTitle={{action "onEditChatChannelTitle"}}
|
||||
@onEditChatChannelName={{action "onEditChatChannelName"}}
|
||||
@onEditChatChannelDescription={{action "onEditChatChannelDescription"}}
|
||||
/>
|
|
@ -0,0 +1,22 @@
|
|||
<DModalBody @title="chat.channel_edit_name_modal.title">
|
||||
<input
|
||||
class="chat-channel-edit-name-modal__name-input"
|
||||
placeholder={{i18n "chat.channel_edit_name_modal.input_placeholder"}}
|
||||
{{on "input" (action "onChangeChatChannelName" value="target.value")}}
|
||||
type="text"
|
||||
value={{this.model.title}}
|
||||
/>
|
||||
<span class="chat-channel-edit-name-modal__description">
|
||||
{{i18n "chat.channel_edit_name_modal.description"}}
|
||||
</span>
|
||||
</DModalBody>
|
||||
|
||||
<div class="modal-footer">
|
||||
<DButton
|
||||
@class="btn-primary create"
|
||||
@action={{action "onSaveChatChannelName"}}
|
||||
@label="save"
|
||||
@disabled={{this.isSaveDisabled}}
|
||||
/>
|
||||
<DModalCancel @close={{route-action "closeModal"}} />
|
||||
</div>
|
|
@ -1,20 +0,0 @@
|
|||
<DModalBody @title="chat.channel_edit_title_modal.title">
|
||||
<textarea
|
||||
class="chat-channel-edit-title-modal__title-input"
|
||||
placeholder={{i18n "chat.channel_edit_title_modal.input_placeholder"}}
|
||||
{{on "input" (action "onChangeChatChannelTitle" value="target.value")}}
|
||||
>{{this.model.title}}</textarea>
|
||||
<span class="chat-channel-edit-title-modal__description">
|
||||
{{i18n "chat.channel_edit_title_modal.description"}}
|
||||
</span>
|
||||
</DModalBody>
|
||||
|
||||
<div class="modal-footer">
|
||||
<DButton
|
||||
@class="btn-primary create"
|
||||
@action={{action "onSaveChatChannelTitle"}}
|
||||
@label="save"
|
||||
@disabled={{this.isSaveDisabled}}
|
||||
/>
|
||||
<DModalCancel @close={{route-action "closeModal"}} />
|
||||
</div>
|
|
@ -117,13 +117,14 @@ input.channel-members-view__search-input {
|
|||
}
|
||||
}
|
||||
|
||||
// Channel info edit title modal
|
||||
.chat-channel-edit-title-modal__title-input {
|
||||
// Channel info edit name modal
|
||||
.chat-channel-edit-name-modal__name-input {
|
||||
display: flex;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.chat-channel-edit-title-modal__description {
|
||||
.chat-channel-edit-name-modal__description {
|
||||
display: flex;
|
||||
padding: 0.5rem 0;
|
||||
color: var(--primary-medium);
|
||||
|
|
|
@ -233,6 +233,7 @@ en:
|
|||
associated_topic: Linked topic
|
||||
associated_category: Linked category
|
||||
title: Title
|
||||
name: Name
|
||||
description: Description
|
||||
|
||||
channel_info:
|
||||
|
@ -243,10 +244,10 @@ en:
|
|||
members: Members
|
||||
settings: Settings
|
||||
|
||||
channel_edit_title_modal:
|
||||
title: Edit title
|
||||
input_placeholder: Add a title
|
||||
description: Give a short descriptive title to your channel
|
||||
channel_edit_name_modal:
|
||||
title: Edit name
|
||||
input_placeholder: Add a name
|
||||
description: Give a short descriptive name to your channel
|
||||
|
||||
channel_edit_description_modal:
|
||||
title: Edit description
|
||||
|
|
|
@ -16,14 +16,14 @@ RSpec.describe "Channel - Info - About page", type: :system, js: true do
|
|||
chat_page.visit_channel_about(channel_1)
|
||||
|
||||
expect(page.find(".category-name")).to have_content(channel_1.chatable.name)
|
||||
expect(page.find(".channel-info-about-view__title")).to have_content(channel_1.title)
|
||||
expect(page.find(".channel-info-about-view__name")).to have_content(channel_1.title)
|
||||
end
|
||||
|
||||
it "escapes channel title" do
|
||||
channel_1.update!(name: "<script>alert('hello')</script>")
|
||||
chat_page.visit_channel_about(channel_1)
|
||||
|
||||
expect(page.find(".channel-info-about-view__title")["innerHTML"].strip).to eq(
|
||||
expect(page.find(".channel-info-about-view__name")["innerHTML"].strip).to eq(
|
||||
"<script>alert('hello')</script>",
|
||||
)
|
||||
expect(page.find(".chat-channel-title__name")["innerHTML"].strip).to eq(
|
||||
|
@ -31,10 +31,10 @@ RSpec.describe "Channel - Info - About page", type: :system, js: true do
|
|||
)
|
||||
end
|
||||
|
||||
it "can’t edit title" do
|
||||
it "can’t edit name" do
|
||||
chat_page.visit_channel_about(channel_1)
|
||||
|
||||
expect(page).to have_no_selector(".edit-title-btn")
|
||||
expect(page).to have_no_selector(".edit-name-btn")
|
||||
end
|
||||
|
||||
it "can’t edit description" do
|
||||
|
@ -76,20 +76,17 @@ RSpec.describe "Channel - Info - About page", type: :system, js: true do
|
|||
|
||||
before { sign_in(current_user) }
|
||||
|
||||
it "can edit title" do
|
||||
it "can edit name" do
|
||||
chat_page.visit_channel_about(channel_1)
|
||||
find(".edit-title-btn").click
|
||||
find(".edit-name-btn").click
|
||||
|
||||
expect(page).to have_selector(
|
||||
".chat-channel-edit-title-modal__title-input",
|
||||
text: channel_1.title,
|
||||
)
|
||||
expect(find(".chat-channel-edit-name-modal__name-input").value).to eq(channel_1.title)
|
||||
|
||||
title = "A new title"
|
||||
find(".chat-channel-edit-title-modal__title-input").fill_in(with: title)
|
||||
name = "A new name"
|
||||
find(".chat-channel-edit-name-modal__name-input").fill_in(with: name)
|
||||
find(".create").click
|
||||
|
||||
expect(page).to have_content(title)
|
||||
expect(page).to have_content(name)
|
||||
end
|
||||
|
||||
it "can edit description" do
|
||||
|
|
Loading…
Reference in New Issue