DEV: update component to be compatible with the Glimmer header

discourse · May 22, 2024 · 94e2e35 · 94e2e35
1 parent 234579c
commit 94e2e35
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 19 deletions.
diff --git a/.discourse-compatibility b/.discourse-compatibility
@@ -1,3 +1,4 @@
+< 3.3.0.beta3-dev: 234579c89a96d2d70ba6e20aed9d52821d305c94
 < 3.3.0.beta1-dev: 1ad74452d38f5449a46bd36b5cc93988a95c9a6c
 3.1.999: d206e14b51cf7a72bc175963ad99c9572a18be5d
 3.1.0.beta3: 8be5bef97767262d1a727773f6aafc0addab9b0c
diff --git a/...urse/initializers/color-scheme-toggler.js → ...rse/initializers/color-scheme-toggler.gjs b/...urse/initializers/color-scheme-toggler.js → ...rse/initializers/color-scheme-toggler.gjs
@@ -3,6 +3,7 @@ import { loadColorSchemeStylesheet } from "discourse/lib/color-scheme-picker";
 import { withPluginApi } from "discourse/lib/plugin-api";
 import { currentThemeId } from "discourse/lib/theme-selector";
 import Session from "discourse/models/session";
+import ColorSchemeToggler from "../components/color-scheme-toggler";
 import {
   COLOR_SCHEME_OVERRIDE_KEY,
   colorSchemeOverride,
@@ -68,8 +69,18 @@ export default {
       });
 
     if (settings.add_color_scheme_toggle_to_header) {
-      withPluginApi("0.8", (api) => {
-        api.addToHeaderIcons("header-toggle-button");
+      withPluginApi("1.28.0", (api) => {
+        api.headerIcons.add(
+          "header-toggle-button",
+          <template>
+            <li class="header-toggle-button header-dropdown-toggle">
+              <span class="header-color-scheme-toggle icon">
+                <ColorSchemeToggler />
+              </span>
+            </li>
+          </template>,
+          { before: "search" }
+        );
       });
     }
   },

diff --git a/javascripts/discourse/widgets/header-toggle-button.js b/javascripts/discourse/widgets/header-toggle-button.js