Fixes bug causing AssetInfo to not live update properly.

composer.json

@@ -14,7 +14,7 @@
         "laravel/framework": "^6.2",
         "laravel/passport": "^8.4",
         "laravel/tinker": "^2.0",
-        "pusher/pusher-php-server": "~4.0"
+        "pusher/pusher-php-server": "~3.0"
     },
     "require-dev": {
         "facade/ignition": "^1.4",

config/websockets.php

@@ -68,10 +68,10 @@ return [
      * the chance to add your own middleware to this list or change any of
      * the existing middleware. Or, you can simply stick with this list.
      */
-    'middleware' => [
+    /* 'middleware' => [
         'web',
         Authorize::class,
-    ],
+    ], */
 
     'statistics' => [
         /*

public/js/app.js

@@ -1932,13 +1932,6 @@ __webpack_require__.r(__webpack_exports__);
       type: Object,
       required: true
     }
-  },
-  mounted: function mounted() {
-    var _this = this;
-
-    Echo.channel('asset.' + this.asset.pcid).listen('AssetUpdated', function (e) {
-      _this.asset = e.data;
-    });
   }
 });
 
@@ -2462,7 +2455,7 @@ __webpack_require__.r(__webpack_exports__);
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _components_Credential_vue__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../components/Credential.vue */ "./resources/js/components/Credential.vue");
+/* harmony import */ var _components_Credential_vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../components/Credential.vue */ "./resources/js/components/Credential.vue");
 /* harmony import */ var _components_CredentialFormModal_vue__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../components/CredentialFormModal.vue */ "./resources/js/components/CredentialFormModal.vue");
 //
 //
@@ -2477,7 +2470,7 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony default export */ __webpack_exports__["default"] = ({
   components: {
-    Credential: _components_Credential_vue__WEBPACK_IMPORTED_MODULE_2__["default"],
+    Credential: _components_Credential_vue__WEBPACK_IMPORTED_MODULE_0__["default"],
     CredentialFormModal: _components_CredentialFormModal_vue__WEBPACK_IMPORTED_MODULE_1__["default"]
   },
   props: {
@@ -2782,7 +2775,7 @@ __webpack_require__.r(__webpack_exports__);
 __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _components_Modal_vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../components/Modal.vue */ "./resources/js/components/Modal.vue");
 /* harmony import */ var _components_AutocompleteCustomDropdown_vue__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../components/AutocompleteCustomDropdown.vue */ "./resources/js/components/AutocompleteCustomDropdown.vue");
-/* harmony import */ var _components_ErrorList_vue__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../components/ErrorList.vue */ "./resources/js/components/ErrorList.vue");
+/* harmony import */ var _components_ErrorList_vue__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../components/ErrorList.vue */ "./resources/js/components/ErrorList.vue");
 /* harmony import */ var _components_CircleSpinner_vue__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../components/CircleSpinner.vue */ "./resources/js/components/CircleSpinner.vue");
 //
 //
@@ -2828,7 +2821,7 @@ __webpack_require__.r(__webpack_exports__);
   components: {
     Modal: _components_Modal_vue__WEBPACK_IMPORTED_MODULE_0__["default"],
     AutocompleteCustomDropdown: _components_AutocompleteCustomDropdown_vue__WEBPACK_IMPORTED_MODULE_1__["default"],
-    ErrorList: _components_ErrorList_vue__WEBPACK_IMPORTED_MODULE_4__["default"],
+    ErrorList: _components_ErrorList_vue__WEBPACK_IMPORTED_MODULE_2__["default"],
     CircleSpinner: _components_CircleSpinner_vue__WEBPACK_IMPORTED_MODULE_3__["default"]
   },
   props: {
@@ -3286,7 +3279,7 @@ __webpack_require__.r(__webpack_exports__);
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _components_WorkOrderInfo_vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../components/WorkOrderInfo.vue */ "./resources/js/components/WorkOrderInfo.vue");
-/* harmony import */ var _components_AssetInfo_vue__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../components/AssetInfo.vue */ "./resources/js/components/AssetInfo.vue");
+/* harmony import */ var _components_AssetInfo_vue__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../components/AssetInfo.vue */ "./resources/js/components/AssetInfo.vue");
 /* harmony import */ var _components_CircleSpinner_vue__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../components/CircleSpinner.vue */ "./resources/js/components/CircleSpinner.vue");
 /* harmony import */ var _components_CredentialList_vue__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../components/CredentialList.vue */ "./resources/js/components/CredentialList.vue");
 /* harmony import */ var _components_Notes_vue__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../components/Notes.vue */ "./resources/js/components/Notes.vue");
@@ -3399,7 +3392,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony default export */ __webpack_exports__["default"] = ({
   components: {
     WorkOrderInfo: _components_WorkOrderInfo_vue__WEBPACK_IMPORTED_MODULE_0__["default"],
-    AssetInfo: _components_AssetInfo_vue__WEBPACK_IMPORTED_MODULE_5__["default"],
+    AssetInfo: _components_AssetInfo_vue__WEBPACK_IMPORTED_MODULE_1__["default"],
     CircleSpinner: _components_CircleSpinner_vue__WEBPACK_IMPORTED_MODULE_2__["default"],
     CredentialList: _components_CredentialList_vue__WEBPACK_IMPORTED_MODULE_3__["default"],
     Notes: _components_Notes_vue__WEBPACK_IMPORTED_MODULE_4__["default"]
@@ -3471,7 +3464,13 @@ __webpack_require__.r(__webpack_exports__);
 
     axios.get("/api/workorders/".concat(this.id, "/asset")).then(function (response) {
       _this.asset = response.data;
-      _this.assetLoading = false; // Get Credentials for this asset. May be relocated to be part of asset
+      _this.assetLoading = false; // Establish listener for liveupdate broadcasts.
+      // Must be done here or we can't guarantee this.asset
+      // exists by the time we execute this code.
+
+      Echo.channel('asset.' + _this.asset.pcid).listen('AssetUpdated', function (e) {
+        _this.asset = e.data;
+      }); // Get Credentials for this asset. May be relocated to be part of asset
       // Component when WOs can have more than one asset.
 
       axios.get("/api/assets/".concat(_this.asset.pcid, "/credentials")).then(function (response) {
@@ -50946,11 +50945,11 @@ var render = function() {
               },
               slot: "header"
             },
-            [_vm._v("\n            Delete Credential\n        ")]
+            [_vm._v("\r\n            Delete Credential\r\n        ")]
           ),
           _vm._v(" "),
           _c("div", { attrs: { slot: "body" }, slot: "body" }, [
-            _vm._v("\n            Are you sure?\n        ")
+            _vm._v("\r\n            Are you sure?\r\n        ")
           ]),
           _vm._v(" "),
           _c("div", { attrs: { slot: "footer" }, slot: "footer" }, [
@@ -51778,7 +51777,7 @@ var render = function() {
           attrs: { slot: "header", id: _vm.id + "Label" },
           slot: "header"
         },
-        [_vm._v("\n        Edit Work Order Information\n    ")]
+        [_vm._v("\r\n        Edit Work Order Information\r\n    ")]
       ),
       _vm._v(" "),
       _c("div", { attrs: { slot: "body" }, slot: "body" }, [
@@ -68036,7 +68035,6 @@ window.Pusher = __webpack_require__(/*! pusher-js */ "./node_modules/pusher-js/d
 window.Echo = new laravel_echo__WEBPACK_IMPORTED_MODULE_0__["default"]({
   broadcaster: 'pusher',
   key: "upccrt",
-  authEndpoint: '/broadcasting/auth',
   wsHost: window.location.hostname,
   wsPort: 6001,
   disableStats: true

resources/js/bootstrap.js

@@ -36,7 +36,6 @@ window.Pusher = require('pusher-js');
 window.Echo = new Echo({
     broadcaster: 'pusher',
     key: process.env.MIX_PUSHER_APP_KEY,
-    authEndpoint: '/broadcasting/auth',
     wsHost: window.location.hostname,
     wsPort: 6001,
     disableStats: true,

resources/js/components/AssetInfo.vue

@@ -23,11 +23,5 @@ export default {
             required: true
         },
     },
-    mounted() {
-        Echo.channel('asset.'+this.asset.pcid)
-                .listen('AssetUpdated', (e) => {
-                this.asset = e.data;
-            });
-    },
 }
 </script>

resources/js/views/WorkOrder.vue

@@ -180,6 +180,14 @@ export default {
             this.asset = response.data
             this.assetLoading = false
 
+            // Establish listener for liveupdate broadcasts.
+            // Must be done here or we can't guarantee this.asset
+            // exists by the time we execute this code.
+             Echo.channel('asset.'+this.asset.pcid)
+            .listen('AssetUpdated', (e) => {
+                this.asset = e.data;
+            });
+
             // Get Credentials for this asset. May be relocated to be part of asset
             // Component when WOs can have more than one asset.
             axios.get(`/api/assets/${this.asset.pcid}/credentials`).then (response => {