left_sidebar: Display unmuted topic in regular font (not faded).

Add class unmuted_topic to li.bottom_left_row element if topic is
unmuted. Add relevant CSS for .unmuted_topic to display unmuted
topics in regular font.

Fixes part of #24243.
This commit is contained in:
Hardik Dharmani
2023-04-22 21:44:26 +05:30
committed by Tim Abbott
parent 8701d546f3
commit 19a2365ab9
5 changed files with 19 additions and 1 deletions

View File

@@ -16,6 +16,7 @@ function choose_topics(stream_id, topic_names, zoomed, topic_choice_state) {
const num_unread = unread.num_unread_for_topic(stream_id, topic_name);
const is_active_topic = topic_choice_state.active_topic === topic_name.toLowerCase();
const is_topic_muted = user_topics.is_topic_muted(stream_id, topic_name);
const is_topic_unmuted = user_topics.is_topic_unmuted(stream_id, topic_name);
const [topic_resolved_prefix, topic_display_name] =
resolved_topic.display_parts(topic_name);
// Important: Topics are lower-case in this set.
@@ -90,6 +91,7 @@ function choose_topics(stream_id, topic_names, zoomed, topic_choice_state) {
unread: num_unread,
is_zero: num_unread === 0,
is_muted: is_topic_muted,
is_unmuted: is_topic_unmuted,
is_active_topic,
url: hash_util.by_stream_topic_url(stream_id, topic_name),
contains_unread_mention,

View File

@@ -37,6 +37,10 @@
color: hsl(236deg 33% 90%/50%);
}
& li.unmuted_topic {
color: hsl(236deg 33% 90%);
}
& li.out_of_home_view {
&:hover {
color: hsl(236deg 33% 90%/ 75%);

View File

@@ -346,6 +346,13 @@ ul.filters {
opacity: 0.5;
}
& li.unmuted_topic {
color: hsl(0deg 0% 20%);
.unread_count {
opacity: 1;
}
}
}
& li.out_of_home_view {

View File

@@ -1,4 +1,4 @@
<li class='bottom_left_row {{#if is_active_topic}}active-sub-filter{{/if}} {{#if is_zero}}zero-topic-unreads{{/if}} {{#if is_muted}}muted_topic{{/if}} topic-list-item' data-topic-name='{{topic_name}}'>
<li class='bottom_left_row {{#if is_active_topic}}active-sub-filter{{/if}} {{#if is_zero}}zero-topic-unreads{{/if}} {{#if is_muted}}muted_topic{{/if}} {{#if is_unmuted}}unmuted_topic{{/if}} topic-list-item' data-topic-name='{{topic_name}}'>
<span class='topic-box'>
<span class="sidebar-topic-check">
{{topic_resolved_prefix}}

View File

@@ -19,6 +19,9 @@ const user_topics = mock_esm("../src/user_topics", {
is_topic_muted() {
return false;
},
is_topic_unmuted() {
return false;
},
});
const narrow_state = mock_esm("../src/narrow_state", {
topic() {},
@@ -91,6 +94,7 @@ test("get_list_info w/real stream_topic_history", ({override}) => {
contains_unread_mention: false,
is_active_topic: false,
is_muted: false,
is_unmuted: false,
is_zero: true,
topic_display_name: "topic 9",
topic_name: "✔ topic 9",
@@ -103,6 +107,7 @@ test("get_list_info w/real stream_topic_history", ({override}) => {
contains_unread_mention: false,
is_active_topic: false,
is_muted: false,
is_unmuted: false,
is_zero: true,
topic_display_name: "topic 8",
topic_name: "topic 8",