diff --git a/frontend_tests/node_tests/recent_topics.js b/frontend_tests/node_tests/recent_topics.js index 28db861237..f12462cefb 100644 --- a/frontend_tests/node_tests/recent_topics.js +++ b/frontend_tests/node_tests/recent_topics.js @@ -5,6 +5,7 @@ const {strict: assert} = require("assert"); const {mock_esm, zrequire} = require("../zjsunit/namespace"); const {run_test} = require("../zjsunit/test"); const $ = require("../zjsunit/zjquery"); +const {page_params} = require("../zjsunit/zpage_params"); const noop = () => {}; @@ -330,11 +331,13 @@ test("test_recent_topics_show", ({mock_template, override}) => { // Note: unread count and urls are fake, // since they are generated in external libraries // and are not to be tested here. + page_params.is_spectator = false; const expected = { filter_participated: false, filter_unread: false, filter_muted: false, search_val: "", + is_spectator: false, }; mock_template("recent_topics_table.hbs", false, (data) => { @@ -358,11 +361,13 @@ test("test_recent_topics_show", ({mock_template, override}) => { test("test_filter_all", ({override_rewire, mock_template}) => { // Just tests inplace rerender of a message // in All topics filter. + page_params.is_spectator = true; const expected = { filter_participated: false, filter_unread: false, filter_muted: false, search_val: "", + is_spectator: true, }; let row_data; let i; @@ -408,6 +413,7 @@ test("test_filter_all", ({override_rewire, mock_template}) => { test("test_filter_unread", ({override_rewire, mock_template}) => { let expected_filter_unread = false; + page_params.is_spectator = false; mock_template("recent_topics_table.hbs", false, (data) => { assert.deepEqual(data, { @@ -415,6 +421,7 @@ test("test_filter_unread", ({override_rewire, mock_template}) => { filter_unread: expected_filter_unread, filter_muted: false, search_val: "", + is_spectator: false, }); }); @@ -517,12 +524,14 @@ test("test_filter_unread", ({override_rewire, mock_template}) => { test("test_filter_participated", ({override_rewire, mock_template}) => { let expected_filter_participated; + page_params.is_spectator = false; mock_template("recent_topics_table.hbs", false, (data) => { assert.deepEqual(data, { filter_participated: expected_filter_participated, filter_unread: false, filter_muted: false, search_val: "", + is_spectator: false, }); }); diff --git a/static/js/click_handlers.js b/static/js/click_handlers.js index b677cac009..cea5d0adc3 100644 --- a/static/js/click_handlers.js +++ b/static/js/click_handlers.js @@ -432,6 +432,11 @@ export function initialize() { $("body").on("click", ".btn-recent-filters", (e) => { e.stopPropagation(); + if (page_params.is_spectator) { + // Filter buttons are disabled for spectator. + return; + } + recent_topics_ui.change_focused_element($(e.target), "click"); recent_topics_ui.set_filter(e.currentTarget.dataset.filter); recent_topics_ui.update_filters_view(); diff --git a/static/js/recent_topics_ui.js b/static/js/recent_topics_ui.js index 8e67aa0b83..938944d1c1 100644 --- a/static/js/recent_topics_ui.js +++ b/static/js/recent_topics_ui.js @@ -18,6 +18,7 @@ import * as muted_topics from "./muted_topics"; import * as narrow from "./narrow"; import * as narrow_state from "./narrow_state"; import * as navigate from "./navigate"; +import {page_params} from "./page_params"; import * as people from "./people"; import * as recent_senders from "./recent_senders"; import {get, process_message, topics} from "./recent_topics_data"; @@ -479,6 +480,7 @@ export function update_filters_view() { filter_participated: filters.has("participated"), filter_unread: filters.has("unread"), filter_muted: filters.has("include_muted"), + is_spectator: page_params.is_spectator, }); $("#recent_filters_group").html(rendered_filters); show_selected_filters(); @@ -590,6 +592,7 @@ export function complete_rerender() { filter_unread: filters.has("unread"), filter_muted: filters.has("include_muted"), search_val: $("#recent_topics_search").val() || "", + is_spectator: page_params.is_spectator, }); $("#recent_topics_table").html(rendered_body); const $container = $("#recent_topics_table table tbody"); diff --git a/static/styles/recent_topics.css b/static/styles/recent_topics.css index e277c7f616..6bb7310739 100644 --- a/static/styles/recent_topics.css +++ b/static/styles/recent_topics.css @@ -120,6 +120,16 @@ background-color: hsl(0, 0%, 80%); outline: 0; } + + &.fake_disabled_button { + cursor: not-allowed; + opacity: 0.5; + + &:hover { + background-color: hsl(0, 0%, 100%); + border-color: hsl(0, 0%, 80%); + } + } } .btn-recent-selected { diff --git a/static/templates/recent_topics_filters.hbs b/static/templates/recent_topics_filters.hbs index c2adf74e39..c5df770c34 100644 --- a/static/templates/recent_topics_filters.hbs +++ b/static/templates/recent_topics_filters.hbs @@ -1,5 +1,5 @@ - - -