diff --git a/frontend_tests/node_tests/settings_data.js b/frontend_tests/node_tests/settings_data.js index ff228902e6..b2c8077cd0 100644 --- a/frontend_tests/node_tests/settings_data.js +++ b/frontend_tests/node_tests/settings_data.js @@ -225,3 +225,25 @@ test_message_policy( "realm_edit_topic_policy", settings_data.user_can_edit_topic_of_any_message, ); + +run_test("using_dark_theme", () => { + page_params.color_scheme = settings_config.color_scheme_values.night.code; + assert.equal(settings_data.using_dark_theme(), true); + + page_params.color_scheme = settings_config.color_scheme_values.automatic.code; + + window.matchMedia = (query) => { + assert.equal(query, "(prefers-color-scheme: dark)"); + return {matches: true}; + }; + assert.equal(settings_data.using_dark_theme(), true); + + window.matchMedia = (query) => { + assert.equal(query, "(prefers-color-scheme: dark)"); + return {matches: false}; + }; + assert.equal(settings_data.using_dark_theme(), false); + + page_params.color_scheme = settings_config.color_scheme_values.day.code; + assert.equal(settings_data.using_dark_theme(), false); +}); diff --git a/static/js/realm_logo.js b/static/js/realm_logo.js index f516c86fc2..7c8e8dcc90 100644 --- a/static/js/realm_logo.js +++ b/static/js/realm_logo.js @@ -2,7 +2,7 @@ import $ from "jquery"; import * as channel from "./channel"; import {page_params} from "./page_params"; -import * as settings_config from "./settings_config"; +import * as settings_data from "./settings_data"; import * as upload_widget from "./upload_widget"; export function build_realm_logo_widget(upload_function, is_night) { @@ -82,14 +82,7 @@ export function rerender() { ); } - if ( - (page_params.color_scheme === settings_config.color_scheme_values.night.code && - page_params.realm_night_logo_source !== "D") || - (page_params.color_scheme === settings_config.color_scheme_values.automatic.code && - page_params.realm_night_logo_source !== "D" && - window.matchMedia && - window.matchMedia("(prefers-color-scheme: dark)").matches) - ) { + if (settings_data.using_dark_theme() && page_params.realm_night_logo_source !== "D") { $("#realm-logo").attr("src", page_params.realm_night_logo_url); } else { $("#realm-logo").attr("src", page_params.realm_logo_url); diff --git a/static/js/settings_data.js b/static/js/settings_data.js index 1471ab2a15..6d66f564ff 100644 --- a/static/js/settings_data.js +++ b/static/js/settings_data.js @@ -158,3 +158,18 @@ export function user_can_edit_topic_of_any_message() { } return user_has_permission(page_params.realm_edit_topic_policy); } + +export function using_dark_theme() { + if (page_params.color_scheme === settings_config.color_scheme_values.night.code) { + return true; + } + + if ( + page_params.color_scheme === settings_config.color_scheme_values.automatic.code && + window.matchMedia && + window.matchMedia("(prefers-color-scheme: dark)").matches + ) { + return true; + } + return false; +}