Now using the nova-echo package to instantiate Echo.

Author: chrisbjr

composer.json

@@ -13,6 +13,7 @@
     "license": "MIT",
     "require": {
         "php": ">=7.1.0",
+        "coreproc/nova-echo": "^0.0.1",
         "pusher/pusher-php-server": "^3.2"
     },
     "autoload": {

dist/js/notification_feed.js

@@ -11,15 +11,13 @@
     },
     "devDependencies": {
         "cross-env": "^5.0.0",
-        "laravel-echo": "^1.5.1",
         "eslint": "^4.19.1",
         "eslint-config-prettier": "^2.9.0",
         "eslint-plugin-vue": "^4.4.0",
         "laravel-mix": "^1.0",
         "prettier": "^1.14.0"
     },
     "dependencies": {
-        "pusher-js": "^4.3.1",
         "vue": "^2.5.0",
         "vue-infinite-loading": "^2.4.3"
     }

package.json

@@ -20,10 +20,6 @@
 </template>
 
 <script>
-  import Echo from 'laravel-echo'
-
-  window.Pusher = require('pusher-js')
-
   export default {
     name: 'NovaNotifications',
     props: [
@@ -53,21 +49,8 @@
       },
       incrementUnreadCount: function () {
         this.unreadCount += 1
-      },
-      instantiateEcho () {
-        window.Echo = new Echo({
-          broadcaster: 'pusher',
-          key: this.pusherKey,
-          cluster: this.pusherCluster,
-          encrypted: true
-        })
-      },
-    },
-    created () {
-      if (typeof window.Echo === 'undefined') {
-        this.instantiateEcho()
       }
-    },
+    }
   }
 </script>
 

resources/js/components/NotificationFeed.vue

@@ -55,7 +55,7 @@
         })
       },
       listenForNotifications () {
-        window.Echo.private(this.broadcastOn)
+        window.userPrivateChannel
           .notification((notification) => {
             // Increment the unread count
             this.$emit('incrementUnreadCount')

resources/js/components/NotificationsPanel.vue

@@ -1,4 +1 @@
-<notification-feed pusher-key="{{ env('PUSHER_APP_KEY') }}"
-                    pusher-cluster="{{ env('PUSHER_APP_CLUSTER') }}"
-                    broadcast-on="{{ request()->user()->receivesBroadcastNotificationsOn() }}">
-</notification-feed>
+<notification-feed></notification-feed>