visgraph: init window.eventHub as external emitter called in Vue. This implementation works with vue2, but is deprecated in vue3 !!

see https://vue3-fr.netlify.app/guide/migration/events-api.html#_2-x-syntax

src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/App.vue

@@ -79,6 +79,12 @@ export default {
       }
 
    },
+   created() {
+      eventHub.$on('add-switch', this.addSwitch)
+   },
+   unmounted() {
+      eventHub.$off('add-switch', this.addSwitch)
+   },
    mounted() {
       console.log('=== mounted: init graph')
       this.initGraph()
@@ -118,6 +124,9 @@ export default {
          console.log('** click on node **')
          window.network.on('click', callback)
       },
+      addSwitch(edgeData) {
+         console.log('==> addSwitch <=======================', edgeData)
+      },
    }
 /*
    TODO / TO CHECK / TO UNDERSTAND

src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/index.js

@@ -3,6 +3,7 @@ import { store } from "./store.js"
 import { _createI18n } from 'ChillMainAssets/vuejs/_js/i18n'
 import { visMessages } from './i18n'
 import App from './App.vue'
+
 import './vis-network'
 
 const i18n = _createI18n(visMessages)

src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/vis-network.js

@@ -1,4 +1,5 @@
 import { visMessages } from './i18n'
+import {createApp} from "vue"
 
 /**
  * Vis-network initial data/configuration script
@@ -7,6 +8,11 @@ import { visMessages } from './i18n'
  *   cfr. https://github.com/almende/vis/issues/2524#issuecomment-307108271
  */
 
+console.log('@@@@@@@ eventHub App @@@@@@@@@@')
+window.eventHub = createApp()
+console.log('@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@')
+
+
 window.network = {}
 
 window.options = {
@@ -98,6 +104,7 @@ window.options = {
         addEdge: function(edgeData, callback) {
             console.log('addEdge', edgeData)
             callback(edgeData)
+            eventHub.$emit('add-switch', edgeData)
         },
         editEdge: function(edgeData, callback) {
             console.log('editNode', edgeData)