github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2025-06-02 04:08:41 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

UX: Muted style for entire chat section link when muted (#18852)

Browse Source
This commit is contained in:
Alan Guo Xiang Tan
2022-11-03 07:37:39 +08:00
committed by GitHub
parent 391a456443
commit d446ad3290
6 changed files with 35 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
app/assets/javascripts/discourse/app/components/sidebar/user/sections.hbs
View File

@ -24,6 +24,7 @@
{{#each customSection.links as |link|}}
<Sidebar::SectionLink
@linkName={{link.name}}
@class={{link.classNames}}
@route={{link.route}}
@model={{link.model}}
@models={{link.models}}

7
app/assets/javascripts/discourse/app/lib/sidebar/base-custom-sidebar-section-link.js
View File

@ -9,6 +9,13 @@ export default class BaseCustomSidebarSectionLink {
this._notImplemented();
}
/**
* @returns {string} The classnames of the section link.
*/
get classNames() {
return "";
}
/**
* @returns {string} The Ember route which the section link should link to.
*/

9
app/assets/javascripts/discourse/tests/acceptance/sidebar-plugin-api-test.js
View File

@ -69,6 +69,10 @@ acceptance("Sidebar - Plugin API", function (needs) {
return "random-channel";
}
get classNames() {
return "my-class-name";
}
get route() {
return "topic";
}
@ -243,6 +247,11 @@ acceptance("Sidebar - Plugin API", function (needs) {
"displays first link with correct text"
);
assert.ok(
exists(".sidebar-section-link.my-class-name"),
"sets the custom class name for the section link"
);
assert.strictEqual(
links[0].title,
"random channel title",

24
plugins/chat/assets/javascripts/discourse/initializers/chat-sidebar.js
View File

@ -61,6 +61,12 @@ export default {
return dasherize(slugifyChannel(this.title));
}
get classNames() {
return this.channel.current_user_membership.muted
? "sidebar-section-link--muted"
: "";
}
get route() {
return "chat.channel";
}
@ -108,12 +114,6 @@ export default {
? "urgent"
: "unread";
}
get contentCSSClass() {
return this.channel.current_user_membership.muted
? "sidebar-section-link-content-muted"
: "";
}
};
const SidebarChatChannelsSection = class extends BaseCustomSidebarSection {
@ -243,6 +243,12 @@ export default {
return slugifyChannel(this.title);
}
get classNames() {
return this.channel.current_user_membership.muted
? "sidebar-section-link--muted"
: "";
}
get route() {
return "chat.channel";
}
@ -307,12 +313,6 @@ export default {
return "";
}
get contentCSSClass() {
return this.channel.current_user_membership.muted
? "sidebar-section-link-content-muted"
: "";
}
get suffixType() {
return "icon";
}

4
plugins/chat/assets/stylesheets/sidebar-extensions.scss
View File

@ -162,7 +162,7 @@
}
}
.sidebar-section-link-content-muted {
opacity: 0.65;
.sidebar-section-link--muted {
opacity: 0.3;
}
}

8
plugins/chat/test/javascripts/acceptance/core-sidebar-test.js
View File

@ -310,9 +310,9 @@ acceptance("Discourse Chat - Core Sidebar", function (needs) {
assert.ok(
exists(
".sidebar-section-chat-dms .sidebar-section-link-sam .sidebar-section-link-content-muted"
".sidebar-section-chat-dms .sidebar-section-link-sam.sidebar-section-link--muted"
),
"muted direct chat channel has right CSS class configured"
"muted direct chat channel section link has right classname configured"
);
});
@ -321,9 +321,9 @@ acceptance("Discourse Chat - Core Sidebar", function (needs) {
assert.ok(
exists(
".sidebar-section-chat-channels .sidebar-section-link-random .sidebar-section-link-content-muted"
".sidebar-section-chat-channels .sidebar-section-link-random.sidebar-section-link--muted"
),
"muted random chat channel has right CSS class configured"
"muted random chat channel section link has right classname configured"
);
});