left_sidebar: Clean up hide_unread_counts vs hide-unread-messages-count.

Now the former is only used in the channels list (headers and inactive
toggles included) and the latter is only used for the home view.

Note that this changes some behavior, notably the header and inactive
toggles now show the masked dots when all unread markers in them are
also masked.
This commit is contained in:
Evy Kassirer
2025-07-29 16:07:50 -07:00
committed by Tim Abbott
parent 756ff53912
commit ef052182b1
3 changed files with 28 additions and 24 deletions

View File

@@ -172,7 +172,7 @@ export function update_dom_with_unread_counts(
}
$header.toggleClass("has-only-muted-unreads", show_muted_count);
$header.toggleClass(
"hide-unread-messages-count",
"hide_unread_counts",
should_mask_header_unread_count(show_muted_count, unmuted_count),
);
}

View File

@@ -133,13 +133,9 @@ export function update_invite_user_option(): void {
export function update_unread_counts_visibility(): void {
const hidden = !user_settings.web_left_sidebar_unreads_count_summary;
const $channel_sections: JQuery = $(".stream-list-subsection-header");
const $home_view_li: JQuery = $(".top_left_row");
for (const $el of [$home_view_li, $channel_sections]) {
$el.toggleClass("hide-unread-messages-count", hidden);
}
$(".top_left_row").toggleClass("hide-unread-messages-count", hidden);
// Note: Channel folder count visibilities are handled in
// `update_section_unread_count`, since they depend on unread counts.
}
export function hide_all(): void {

View File

@@ -80,21 +80,14 @@
width: var(--left-sidebar-single-digit-unread-width);
}
.selected-home-view {
&.hide-unread-messages-count {
.masked_unread_count {
/* Adding margin-right aligns the .masked_unread_count with the rest of the masked unread counts. */
margin-right: var(--left-sidebar-unread-offset);
}
}
}
#left-sidebar-navigation-list .selected-home-view,
.show-inactive-channels {
#left-sidebar-navigation-list .selected-home-view {
&.hide-unread-messages-count {
.masked_unread_count {
display: flex;
grid-area: markers-and-unreads;
/* Adding margin-right aligns the .masked_unread_count */
/* with the rest of the masked unread counts. */
margin-right: var(--left-sidebar-unread-offset);
justify-self: end;
visibility: visible;
}
@@ -110,7 +103,6 @@
}
#left-sidebar-navigation-list .selected-home-view:hover,
.stream-list-toggle-inactive-channels:hover .show-inactive-channels,
.selected-home-view.top-left-active-filter {
&.hide-unread-messages-count {
.masked_unread_count {
@@ -148,7 +140,9 @@
}
}
.stream-with-count.hide_unread_counts {
.stream-with-count.hide_unread_counts,
.stream-list-subsection-header.hide_unread_counts,
.show-inactive-channels.hide_unread_counts {
.masked_unread_count {
display: flex;
}
@@ -156,6 +150,16 @@
.unread_count {
display: none;
}
&:hover {
.masked_unread_count {
display: none;
}
.unread_count {
display: inline;
}
}
}
.narrow-filter
@@ -364,7 +368,8 @@
below. This extra margin prevents that overlap. */
margin-bottom: 1px;
.unread_count {
.unread_count,
.masked_unread_count {
margin-right: var(--left-sidebar-unread-offset);
}
@@ -465,6 +470,10 @@
"content markers-and-unreads three-dot-placeholder" auto
/ minmax(0, 1fr) minmax(0, max-content) var(--left-sidebar-vdots-width);
align-items: center;
.markers-and-unreads {
margin-right: var(--left-sidebar-unread-offset);
}
}
.stream-list-section {
@@ -1616,8 +1625,7 @@ li.top_left_scheduled_messages {
.dm-markers-and-unreads,
.stream-markers-and-unreads,
.topic-markers-and-unreads,
.show-inactive-channels .markers-and-unreads {
.topic-markers-and-unreads {
grid-area: markers-and-unreads;
display: flex;
/* Present a uniform space between icons */