DEV: Add glimmer header deprecation notice (#25891)

- Remove `_customHeaderClasses`. It was not supposed to have been a part of the glimmer header PR
- Add deprecation notice to `addHeaderPanel`

# Example

<img width="437" alt="Screenshot 2024-02-26 at 2 50 39 PM" src="https://github.com/discourse/discourse/assets/50783505/23fce1ee-fff9-4071-8c34-a480cec7e2e7">
This commit is contained in:
Isaac Janzen 2024-02-28 11:59:44 -07:00 committed by GitHub
parent 80cc538e77
commit 0e5307d8e2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 40 additions and 32 deletions

View File

@ -4,7 +4,6 @@ import { action } from "@ember/object";
import didInsert from "@ember/render-modifiers/modifiers/did-insert";
import { inject as service } from "@ember/service";
import { modifier } from "ember-modifier";
import concatClass from "discourse/helpers/concat-class";
import scrollLock from "discourse/lib/scroll-lock";
import DiscourseURL from "discourse/lib/url";
import { scrollTop } from "discourse/mixins/scroll-top";
@ -21,11 +20,6 @@ import PluginOutlet from "./plugin-outlet";
const SEARCH_BUTTON_ID = "search-button";
let _customHeaderClasses = [];
export function addCustomHeaderClass(className) {
_customHeaderClasses.push(className);
}
export default class GlimmerHeader extends Component {
@service router;
@service search;
@ -53,10 +47,6 @@ export default class GlimmerHeader extends Component {
};
});
get customHeaderClasses() {
return _customHeaderClasses.join(" ");
}
@action
headerKeyboardTrigger(msg) {
switch (msg.type) {
@ -168,10 +158,7 @@ export default class GlimmerHeader extends Component {
}
<template>
<header
class={{concatClass this.customHeaderClasses "d-header"}}
{{this.appEventsListeners}}
>
<header class="d-header" {{this.appEventsListeners}}>
<div class="wrap">
<Contents
@sidebarEnabled={{@sidebarEnabled}}

View File

@ -9,7 +9,6 @@ import {
import { addPluginDocumentTitleCounter } from "discourse/components/d-document";
import { addToolbarCallback } from "discourse/components/d-editor";
import { addCategorySortCriteria } from "discourse/components/edit-category-settings";
import { addCustomHeaderClass } from "discourse/components/glimmer-header";
import { addToHeaderIcons as addToGlimmerHeaderIcons } from "discourse/components/glimmer-header/icons";
import { forceDropdownForMenuPanels as glimmerForceDropdownForMenuPanels } from "discourse/components/glimmer-site-header";
import { addGlobalNotice } from "discourse/components/global-notice";
@ -147,6 +146,18 @@ import { modifySelectKit } from "select-kit/mixins/plugin-api";
export const PLUGIN_API_VERSION = "1.27.0";
const DEPRECATED_HEADER_WIDGETS = [
"header",
"site-header",
"header-contents",
"header-buttons",
"user-status-bubble",
"sidebar-toggle",
"header-icons",
"header-topic-info",
"header-notifications",
];
// This helper prevents us from applying the same `modifyClass` over and over in test mode.
function canModify(klass, type, resolverName, changes) {
if (!changes.pluginId) {
@ -185,6 +196,19 @@ function wrapWithErrorHandler(func, messageKey) {
};
}
function deprecatedHeaderWidgetOverride(widgetName, override) {
if (DEPRECATED_HEADER_WIDGETS.includes(widgetName)) {
deprecated(
`The ${widgetName} widget has been deprecated and ${override} is no longer a supported override.`,
{
since: "v3.3.0.beta1-dev",
id: "discourse.header-widget-overrides",
url: "https://meta.discourse.org/t/296544",
}
);
}
}
class PluginApi {
constructor(version, container) {
this.version = version;
@ -528,6 +552,9 @@ class PluginApi {
*
**/
decorateWidget(name, fn) {
const widgetName = name.split(":")[0];
deprecatedHeaderWidgetOverride(widgetName, "decorateWidget");
decorateWidget(name, fn);
}
@ -557,6 +584,8 @@ class PluginApi {
return;
}
deprecatedHeaderWidgetOverride(widget, "attachWidgetAction");
widgetClass.prototype[actionName] = fn;
}
@ -874,6 +903,7 @@ class PluginApi {
*
**/
changeWidgetSetting(widgetName, settingName, newValue) {
deprecatedHeaderWidgetOverride(widgetName, "changeWidgetSetting");
changeSetting(widgetName, settingName, newValue);
}
@ -907,6 +937,7 @@ class PluginApi {
**/
reopenWidget(name, args) {
deprecatedHeaderWidgetOverride(name, "reopenWidget");
return reopenWidget(name, args);
}
@ -934,10 +965,13 @@ class PluginApi {
*
**/
addHeaderPanel(name, toggle, transformAttrs) {
// deprecated(
// "addHeaderPanel has been removed. Use api.addToHeaderIcons instead.",
// { id: "discourse.add-header-panel" }
// );
deprecated(
"addHeaderPanel has been removed. Use api.addToHeaderIcons instead.",
{
id: "discourse.add-header-panel",
url: "https://meta.discourse.org/t/296544",
}
);
attachAdditionalPanel(name, toggle, transformAttrs);
}
@ -2802,19 +2836,6 @@ class PluginApi {
addImageWrapperButton(label, btnClass, icon);
addApiImageWrapperButtonClickEvent(fn);
}
/**
* Add a custom css class to the header. The class or classes will live alongside the `d-header` class.
*
* ```
* api.addCustomHeaderClass("class-one");
* api.addCustomHeaderClass("class-two");
*
*/
addCustomHeaderClass(klass) {
addCustomHeaderClass(klass);
}
}
// from http://stackoverflow.com/questions/6832596/how-to-compare-software-version-number-using-js-only-number