Don't show release announcements while toasts are displayed (#30770)

* Don't show release announcements while toasts are displayed

Otherwise they can clash and look like a mess.

* Dismiss the toast in the e2e test

* Update screenshot

src/stores/ReleaseAnnouncementStore.ts

@@ -13,6 +13,7 @@ import { cloneDeep } from "lodash";
 import SettingsStore from "../settings/SettingsStore";
 import { SettingLevel } from "../settings/SettingLevel";
 import { Features } from "../settings/Settings";
+import ToastStore from "./ToastStore";
 
 /**
  * The features are shown in the array order.
@@ -76,6 +77,9 @@ export class ReleaseAnnouncementStore extends TypedEventEmitter<ReleaseAnnouncem
         SettingsStore.watchSetting("releaseAnnouncementData", null, () => {
             this.emit("releaseAnnouncementChanged", this.getReleaseAnnouncement());
         });
+        ToastStore.sharedInstance().on("update", () => {
+            this.emit("releaseAnnouncementChanged", this.getReleaseAnnouncement());
+        });
     }
 
     /**
@@ -104,6 +108,9 @@ export class ReleaseAnnouncementStore extends TypedEventEmitter<ReleaseAnnouncem
         const isReleaseAnnouncementEnabled = this.isReleaseAnnouncementEnabled();
         if (!isReleaseAnnouncementEnabled) return null;
 
+        // also don't show release announcements if any toasts are on screen
+        if (ToastStore.sharedInstance().getToasts().length > 0) return null;
+
         const viewedReleaseAnnouncements = this.getViewedReleaseAnnouncements();
 
         // Find the first feature that has not been viewed