Fixes

src/csui/NotificationUi.vue

@@ -41,6 +41,7 @@
 </template>
 
 <script>
+import { mapState } from 'vuex';
 import Icon from '../common/components/Icon';
 
 export default {

src/ext/lib/uwui/PlayerNotificationUI.js

@@ -1,6 +1,11 @@
 import UI from './UI';
 import VuexWebExtensions from 'vuex-webextensions';
-import VideoNotification from '../../../csui/NotificationUi';
+import NotificationUi from '../../../csui/NotificationUi.vue';
+
+if (process.env.CHANNEL !== 'stable'){
+  console.info("Loading: PlayerNotificationUi");
+}
+
 
 class PlayerNotificationUi extends UI {
 
@@ -9,16 +14,16 @@ class PlayerNotificationUi extends UI {
   ) {
     super(
       'notification',
-      getStoreConfig(),
+      PlayerNotificationUi.getStoreConfig(),
-      getUiConfig(playerElement),
+      PlayerNotificationUi.getUiConfig(playerElement),
-      getCommsConfig()
+      PlayerNotificationUi.getCommsConfig()
     )
   }
 
 
   //#region constructor helpers
   // we will move some things out of the constructor in order to keep things clean
-  getStoreConfig() {
+  static getStoreConfig() {
     return {
       plugins: [
         VuexWebExtensions({
@@ -48,14 +53,14 @@ class PlayerNotificationUi extends UI {
     };
   }
 
-  getUiConfig(playerElement) {
+  static getUiConfig(playerElement) {
     return {
       parentElement: playerElement,
-      component: VideoNotification
+      component: NotificationUi
     }
   }
 
-  getCommsConfig() {
+  static getCommsConfig() {
     return {
       handlers: {
         'show-notification': [(message) => this.showNotification(message)],
@@ -94,4 +99,9 @@ class PlayerNotificationUi extends UI {
   }
 }
 
+if (process.env.CHANNEL !== 'stable'){
+  console.info("PlayerNotificationUi loaded");
+}
+
+
 export default PlayerNotificationUi;

src/ext/lib/uwui/UI.js

@@ -1,6 +1,11 @@
 import { createApp } from 'vue';
 import { createStore } from 'vuex';
 
+if (process.env.CHANNEL !== 'stable'){
+  console.info("Loading: UI");
+}
+
+
 class UI {
   constructor(
     interfaceId,
@@ -10,6 +15,10 @@ class UI {
   ) {
     this.interfaceId = interfaceId;
     this.commsConfig = commsConfig;
+    this.storeConfig = storeConfig,
+    this.uiConfig = uiConfig;
+
+    this.init();
   }
 
   async init() {
@@ -34,11 +43,13 @@ class UI {
 
   async initVue() {
     this.vuexStore = createStore(this.storeConfig);
+    this.initUi();
   }
 
   async initUi() {
     const random = Math.round(Math.random() * 69420);
-    const uwid = `uw-${this.interfaceId}-root-${random}`
+    // const uwid = `uw-${this.interfaceId}-root-${random}`
+    const uwid = 'not-so-random-id'
 
     const rootDiv = document.createElement('div');
     rootDiv.setAttribute('style', `position: ${uiConfig.style?.position ?? 'relative'}; width: ${uiConfig.style?.width ?? '100%'}; height: ${uiConfig.style?.height ?? '100%'}; ${uiConfig.additionalStyle}`);
@@ -73,4 +84,9 @@ class UI {
   }
 }
 
+if (process.env.CHANNEL !== 'stable'){
+  console.info("UI.js loaded");
+}
+
+
 export default UI;