From 837cc2c698cff09e5751bc64575cd21969c1ea14 Mon Sep 17 00:00:00 2001
From: sanchi-t <ssharmas10662@gmail.com>
Date: Wed, 12 Mar 2025 10:50:17 +0530
Subject: [PATCH] stream_ui_updates: Hide channels in the left panel based on
 filter.

Previously on subscribing, channels used to appear in the left panel
regardless of the filter. Now, channels that don't match the
filter are hidden from the left panel.
---
 web/src/stream_settings_components.ts | 13 ++++++++++
 web/src/stream_settings_ui.ts         | 34 ++++++++++++++-------------
 web/src/stream_ui_updates.ts          |  5 +++-
 3 files changed, 35 insertions(+), 17 deletions(-)

diff --git a/web/src/stream_settings_components.ts b/web/src/stream_settings_components.ts
index 3bd24a83d9..eb0d00205d 100644
--- a/web/src/stream_settings_components.ts
+++ b/web/src/stream_settings_components.ts
@@ -16,6 +16,7 @@ import * as peer_data from "./peer_data.ts";
 import * as settings_data from "./settings_data.ts";
 import {current_user} from "./state_data.ts";
 import * as stream_data from "./stream_data.ts";
+import * as stream_settings_data from "./stream_settings_data.ts";
 import type {StreamSubscription} from "./sub_store.ts";
 import * as ui_report from "./ui_report.ts";
 
@@ -285,3 +286,15 @@ export function set_filter_dropdown_value(value: string): void {
 export function set_filters_for_tests(filter_widget: DropdownWidget): void {
     filter_dropdown_widget = filter_widget;
 }
+
+export function filter_includes_channel(sub: StreamSubscription): boolean {
+    const filter_value = get_filter_dropdown_value();
+    const FILTERS = stream_settings_data.FILTERS;
+    if (
+        (filter_value === FILTERS.NON_ARCHIVED_CHANNELS && sub.is_archived) ||
+        (filter_value === FILTERS.ARCHIVED_CHANNELS && !sub.is_archived)
+    ) {
+        return false;
+    }
+    return true;
+}
diff --git a/web/src/stream_settings_ui.ts b/web/src/stream_settings_ui.ts
index 833772de78..409eb70351 100644
--- a/web/src/stream_settings_ui.ts
+++ b/web/src/stream_settings_ui.ts
@@ -262,10 +262,18 @@ export function add_sub_to_table(sub: StreamSubscription): void {
     const html = render_browse_streams_list_item(setting_sub);
     const $new_row = $(html);
 
-    if (stream_create.get_name() === sub.name) {
-        scroll_util.get_content_element($(".streams-list")).prepend($new_row);
-        scroll_util.reset_scrollbar($(".streams-list"));
+    if (stream_settings_components.filter_includes_channel(sub)) {
+        if (stream_create.get_name() === sub.name) {
+            scroll_util.get_content_element($(".streams-list")).prepend($new_row);
+            scroll_util.reset_scrollbar($(".streams-list"));
+        } else {
+            scroll_util.get_content_element($(".streams-list")).append($new_row);
+        }
     } else {
+        $new_row.addClass("notdisplayed");
+        // It does not matter whether we append or prepend the row here as
+        // row is not visible. It will only be visible after the filter is
+        // changed and its position will be decided by the usual sort order.
         scroll_util.get_content_element($(".streams-list")).append($new_row);
     }
 
@@ -969,21 +977,15 @@ export function change_state(
         switch_to_stream_row(stream_id);
 
         const sub = stream_data.get_sub_by_id(stream_id);
-        if (sub) {
+        if (sub && !stream_settings_components.filter_includes_channel(sub)) {
             const FILTERS = stream_settings_data.FILTERS;
-            const filter_value = stream_settings_components.get_filter_dropdown_value();
-            const should_update_filter =
-                (filter_value === FILTERS.NON_ARCHIVED_CHANNELS && sub.is_archived) ||
-                (filter_value === FILTERS.ARCHIVED_CHANNELS && !sub.is_archived);
-            if (should_update_filter) {
-                let selected_filter;
-                if (sub.is_archived) {
-                    selected_filter = FILTERS.ARCHIVED_CHANNELS;
-                } else {
-                    selected_filter = FILTERS.NON_ARCHIVED_CHANNELS;
-                }
-                stream_settings_components.set_filter_dropdown_value(selected_filter);
+            let selected_filter;
+            if (sub.is_archived) {
+                selected_filter = FILTERS.ARCHIVED_CHANNELS;
+            } else {
+                selected_filter = FILTERS.NON_ARCHIVED_CHANNELS;
             }
+            stream_settings_components.set_filter_dropdown_value(selected_filter);
         }
         return;
     }
diff --git a/web/src/stream_ui_updates.ts b/web/src/stream_ui_updates.ts
index 9a99a66c3e..1b63d1eaaf 100644
--- a/web/src/stream_ui_updates.ts
+++ b/web/src/stream_ui_updates.ts
@@ -17,6 +17,7 @@ import * as settings_org from "./settings_org.ts";
 import {current_user, realm} from "./state_data.ts";
 import * as stream_data from "./stream_data.ts";
 import * as stream_edit_toggler from "./stream_edit_toggler.ts";
+import * as stream_settings_components from "./stream_settings_components.ts";
 import * as stream_settings_containers from "./stream_settings_containers.ts";
 import type {SettingsSubscription} from "./stream_settings_data.ts";
 import * as sub_store from "./sub_store.ts";
@@ -419,7 +420,9 @@ export function update_stream_row_in_settings_tab(sub: StreamSubscription): void
             (is_subscribed_stream_tab_active() && sub.subscribed) ||
             (is_not_subscribed_stream_tab_active() && !sub.subscribed)
         ) {
-            $row.removeClass("notdisplayed");
+            if (stream_settings_components.filter_includes_channel(sub)) {
+                $row.removeClass("notdisplayed");
+            }
         } else if (sub.invite_only || current_user.is_guest) {
             $row.addClass("notdisplayed");
         }