DEV: Allow plugins/themes to add global notices at any time (#24922)

Previously, `addGlobalNotice` would have to be called before the GlobalNotice component was rendered. By using a TrackedArray, we can improve that so that plugins can call the function at any time and the notice will be rendered immediately

app/assets/javascripts/discourse/app/components/global-notice.js

@@ -2,12 +2,13 @@ import Component from "@ember/component";
 import EmberObject, { action } from "@ember/object";
 import { inject as service } from "@ember/service";
 import { htmlSafe } from "@ember/template";
+import { TrackedArray } from "@ember-compat/tracked-built-ins";
 import { tagName } from "@ember-decorators/component";
 import cookie, { removeCookie } from "discourse/lib/cookie";
-import discourseComputed, { bind } from "discourse-common/utils/decorators";
+import { bind } from "discourse-common/utils/decorators";
 import I18n from "discourse-i18n";
 
-const _pluginNotices = [];
+const _pluginNotices = new TrackedArray();
 
 export function addGlobalNotice(text, id, options = {}) {
   _pluginNotices.push(Notice.create({ text, id, options }));
@@ -78,31 +79,14 @@ export default class GlobalNotice extends Component {
     return !this.router.currentRouteName.startsWith("wizard.");
   }
 
-  @discourseComputed(
-    "site.isReadOnly",
-    "site.isStaffWritesOnly",
-    "siteSettings.login_required",
-    "siteSettings.disable_emails",
-    "siteSettings.global_notice",
-    "session.safe_mode",
-    "logNotice.{id,text,hidden}"
-  )
-  notices(
-    isReadOnly,
-    isStaffWritesOnly,
-    loginRequired,
-    disableEmails,
-    globalNotice,
-    safeMode,
-    logNotice
-  ) {
+  get notices() {
     let notices = [];
 
     if (cookie("dosp") === "1") {
       removeCookie("dosp", { path: "/" });
       notices.push(
         Notice.create({
-          text: loginRequired
+          text: this.siteSettings.login_required
             ? I18n.t("forced_anonymous_login_required")
             : I18n.t("forced_anonymous"),
           id: "forced-anonymous",
@@ -110,20 +94,20 @@ export default class GlobalNotice extends Component {
       );
     }
 
-    if (safeMode) {
+    if (this.session.get("safe_mode")) {
       notices.push(
         Notice.create({ text: I18n.t("safe_mode.enabled"), id: "safe-mode" })
       );
     }
 
-    if (isStaffWritesOnly) {
+    if (this.site.get("isStaffWritesOnly")) {
       notices.push(
         Notice.create({
           text: I18n.t("staff_writes_only_mode.enabled"),
           id: "alert-staff-writes-only",
         })
       );
-    } else if (isReadOnly) {
+    } else if (this.site.get("isReadOnly")) {
       notices.push(
         Notice.create({
           text: I18n.t("read_only_mode.enabled"),
@@ -132,14 +116,14 @@ export default class GlobalNotice extends Component {
       );
     }
 
-    if (disableEmails === "yes") {
+    if (this.siteSettings.disable_emails === "yes") {
       notices.push(
         Notice.create({
           text: I18n.t("emails_are_disabled"),
           id: "alert-emails-disabled",
         })
       );
-    } else if (disableEmails === "non-staff") {
+    } else if (this.siteSettings.disable_emails === "non-staff") {
       notices.push(
         Notice.create({
           text: I18n.t("emails_are_disabled_non_staff"),
@@ -148,17 +132,17 @@ export default class GlobalNotice extends Component {
       );
     }
 
-    if (globalNotice?.length > 0) {
+    if (this.siteSettings.global_notice?.length > 0) {
       notices.push(
         Notice.create({
-          text: globalNotice,
+          text: this.siteSettings.global_notice,
           id: "alert-global-notice",
         })
       );
     }
 
-    if (logNotice) {
-      notices.push(logNotice);
+    if (this.get("logNotice")) {
+      notices.push(this.get("logNotice"));
     }
 
     return notices.concat(_pluginNotices).filter((notice) => {