Add notifications to the plugin API

client/src/modules/pluginapi.js

@@ -10,7 +10,7 @@
 
 import { EmoteModule } from 'builtin';
 import { SettingsSet, SettingsCategory, Setting, SettingsScheme } from 'structs';
-import { BdMenu, Modals, DOM, DOMObserver, Reflection, VueInjector, Toasts, BdContextMenu, DiscordContextMenu } from 'ui';
+import { BdMenu, Modals, DOM, DOMObserver, Reflection, VueInjector, Toasts, Notifications, BdContextMenu, DiscordContextMenu } from 'ui';
 import * as CommonComponents from 'commoncomponents';
 import { Utils, Filters, ClientLogger as Logger, ClientIPC, AsyncEventEmitter } from 'common';
 import Settings from './settings';
@@ -275,9 +275,6 @@ export default class PluginApi {
     get modalStack() {
         return this._modalStack || (this._modalStack = []);
     }
-    get baseModalComponent() {
-        return Modals.baseComponent;
-    }
     addModal(_modal, component) {
         const modal = Modals.add(_modal, component);
         modal.on('close', () => Utils.removeFromArray(this.modalStack, modal));
@@ -316,7 +313,7 @@ export default class PluginApi {
                 get: () => this.modalStack
             },
             baseComponent: {
-                get: () => this.baseModalComponent
+                get: () => Modals.baseComponent
             }
         });
     }
@@ -324,6 +321,7 @@ export default class PluginApi {
     /**
      * Toasts
      */
+
     showToast(message, options = {}) {
         return Toasts.push(message, options);
     }
@@ -350,6 +348,36 @@ export default class PluginApi {
         };
     }
 
+    /**
+     * Notifications
+     */
+
+    get notificationStack() {
+        return this._notificationStack || (this._notificationStack = []);
+    }
+    addNotification(text, buttons = []) {
+        const notification = Notifications.add(text, buttons, () => Utils.removeFromArray(this.notificationStack, notification));
+        this.notificationStack.push(notification);
+        return notification;
+    }
+    dismissNotification(index) {
+        index = Notifications.stack.indexOf(this.notificationStack[index]);
+        if (index) Notifications.dismiss(index);
+    }
+    dismissAll() {
+        for (let index in this.notificationStack) {
+            this.dismissNotification(index);
+        }
+    }
+    get Notifications() {
+        return Object.defineProperty({
+            add: this.addNotification.bind(this),
+            dismiss: this.dismissNotification.bind(this)
+        }, 'stack', {
+            get: () => this.notificationStack
+        });
+    }
+
     /**
      * Autocomplete
      */

client/src/ui/notifications.js

@@ -16,10 +16,12 @@ export default class Notifications {
      * Add a new notification to the stack.
      * Notifications should only be used for important things.
      * @param {String} text
-     * @param {Object} [buttons] buttons to show { text: 'Text for the button', onClick: fn() { return true if notification should be dismissed } }
+     * @param {Object[]} [buttons] buttons to show { text: 'Text for the button', onClick: fn() { return true if notification should be dismissed } }
      */
-    static add(text, buttons = []) {
-        this.stack.push({ text, buttons });
+    static add(text, buttons = [], ondismiss) {
+        const notification = { text, buttons, ondismiss };
+        this.stack.push(notification);
+        return notification;
     }
 
     /**
@@ -35,6 +37,9 @@ export default class Notifications {
      * @param {Number} index Index of the notification
      */
     static dismiss(index) {
+        const notification = this.stack[index];
+        if (!notification) return;
+        if (notification.ondismiss) notification.ondismiss();
         this.stack.splice(index, 1);
     }
 

tests/ext/plugins/Example 4/index.js

@@ -1,4 +1,4 @@
-exports.main = (Plugin, { Logger, Settings, Modals, BdMenu: { BdMenuItems }, CommonComponents, DiscordContextMenu, Autocomplete, Api }) => class extends Plugin {
+exports.main = (Plugin, { Logger, Settings, Modals, BdMenu: { BdMenuItems }, CommonComponents, DiscordContextMenu, Autocomplete, Notifications, Api }) => class extends Plugin {
     async onstart() {
         this.keybindEvent = this.keybindEvent.bind(this);
 
@@ -96,6 +96,14 @@ exports.main = (Plugin, { Logger, Settings, Modals, BdMenu: { BdMenuItems }, Com
          */
 
         Autocomplete.add('|');
+
+        /**
+         * Notifications.
+         */
+
+        Notifications.add('Notification from Plugin 4', [
+            {text: 'Dismiss', onClick: () => true}
+        ]);
     }
 
     onstop() {