@plusscommunities/pluss-maintenance-web-a 1.1.30 → 1.1.31

package/dist/index.cjs.js

@@ -508,6 +508,15 @@ var maintenanceActions = {
         id: jobId
       })
     });
+  },
+  retrySync: function retrySync(jobId) {
+    return Session$9.authedFunction({
+      method: 'POST',
+      url: Helper$5.getUrl(values.serviceKey, 'update/retrysync'),
+      data: {
+        id: jobId
+      }
+    });
   }
 };
 
@@ -3421,6 +3430,63 @@ var Job = /*#__PURE__*/function (_Component) {
       }, _callee3, null, [[0, 8]]);
     })));
 
+    _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "onRetrySync", /*#__PURE__*/_asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee4() {
+      var job, errorMessage;
+      return _regeneratorRuntime__default['default'].wrap(function _callee4$(_context4) {
+        while (1) {
+          switch (_context4.prev = _context4.next) {
+            case 0:
+              job = _this.state.job;
+
+              if (!(!job || _this.state.retryingSync)) {
+                _context4.next = 3;
+                break;
+              }
+
+              return _context4.abrupt("return");
+
+            case 3:
+              _this.setState({
+                retryingSync: true,
+                retrySyncError: null
+              });
+
+              _context4.prev = 4;
+              _context4.next = 7;
+              return maintenanceActions.retrySync(job.id);
+
+            case 7:
+              _context4.next = 9;
+              return _this.getJob();
+
+            case 9:
+              _this.setState({
+                retryingSync: false,
+                retrySyncInitiated: true
+              });
+
+              _context4.next = 17;
+              break;
+
+            case 12:
+              _context4.prev = 12;
+              _context4.t0 = _context4["catch"](4);
+              console.error('onRetrySync', _context4.t0);
+              errorMessage = _context4.t0 && _context4.t0.response && _context4.t0.response.data && _context4.t0.response.data.error || 'Failed to retry sync. Please try again.';
+
+              _this.setState({
+                retryingSync: false,
+                retrySyncError: errorMessage
+              });
+
+            case 17:
+            case "end":
+              return _context4.stop();
+          }
+        }
+      }, _callee4, null, [[4, 12]]);
+    })));
+
     _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "getStatusType", function (status) {
       var statusTypes = _this.props.statusTypes;
       var statusType = statusTypes.find(function (s) {
@@ -3586,35 +3652,35 @@ var Job = /*#__PURE__*/function (_Component) {
       });
     });
 
-    _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "onConfirmAssignee", /*#__PURE__*/_asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee4() {
-      return _regeneratorRuntime__default['default'].wrap(function _callee4$(_context4) {
+    _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "onConfirmAssignee", /*#__PURE__*/_asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee5() {
+      return _regeneratorRuntime__default['default'].wrap(function _callee5$(_context5) {
         while (1) {
-          switch (_context4.prev = _context4.next) {
+          switch (_context5.prev = _context5.next) {
             case 0:
               _this.setState({
                 confirmingAssignee: true
               });
 
-              _context4.prev = 1;
+              _context5.prev = 1;
 
               if (!_this.state.selectedAssignee) {
-                _context4.next = 5;
+                _context5.next = 5;
                 break;
               }
 
-              _context4.next = 5;
+              _context5.next = 5;
               return _this.onAssignUser(_this.state.selectedAssignee.id);
 
             case 5:
               _this.onCloseSelectAssignee();
 
-              _context4.next = 11;
+              _context5.next = 11;
               break;
 
             case 8:
-              _context4.prev = 8;
-              _context4.t0 = _context4["catch"](1);
-              console.error('onConfirmAssignee', _context4.t0);
+              _context5.prev = 8;
+              _context5.t0 = _context5["catch"](1);
+              console.error('onConfirmAssignee', _context5.t0);
 
             case 11:
               _this.setState({
@@ -3623,68 +3689,68 @@ var Job = /*#__PURE__*/function (_Component) {
 
             case 12:
             case "end":
-              return _context4.stop();
+              return _context5.stop();
           }
         }
-      }, _callee4, null, [[1, 8]]);
+      }, _callee5, null, [[1, 8]]);
     })));
 
     _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "onAssignUser", /*#__PURE__*/function () {
-      var _ref5 = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee5(userId) {
-        return _regeneratorRuntime__default['default'].wrap(function _callee5$(_context5) {
+      var _ref6 = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee6(userId) {
+        return _regeneratorRuntime__default['default'].wrap(function _callee6$(_context6) {
           while (1) {
-            switch (_context5.prev = _context5.next) {
+            switch (_context6.prev = _context6.next) {
               case 0:
-                _context5.prev = 0;
-                _context5.next = 3;
+                _context6.prev = 0;
+                _context6.next = 3;
                 return maintenanceActions.assignJob(_this.state.jobId, userId);
 
               case 3:
 
                 _this.getJob();
 
-                _context5.next = 10;
+                _context6.next = 10;
                 break;
 
               case 7:
-                _context5.prev = 7;
-                _context5.t0 = _context5["catch"](0);
-                console.error('onAssignUser', _context5.t0);
+                _context6.prev = 7;
+                _context6.t0 = _context6["catch"](0);
+                console.error('onAssignUser', _context6.t0);
 
               case 10:
               case "end":
-                return _context5.stop();
+                return _context6.stop();
             }
           }
-        }, _callee5, null, [[0, 7]]);
+        }, _callee6, null, [[0, 7]]);
       }));
 
       return function (_x) {
-        return _ref5.apply(this, arguments);
+        return _ref6.apply(this, arguments);
       };
     }());
 
-    _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "onConfirmAddNote", /*#__PURE__*/_asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee6() {
+    _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "onConfirmAddNote", /*#__PURE__*/_asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee7() {
       var res;
-      return _regeneratorRuntime__default['default'].wrap(function _callee6$(_context6) {
+      return _regeneratorRuntime__default['default'].wrap(function _callee7$(_context7) {
         while (1) {
-          switch (_context6.prev = _context6.next) {
+          switch (_context7.prev = _context7.next) {
             case 0:
               if (_this.isReadyToSaveNote()) {
-                _context6.next = 2;
+                _context7.next = 2;
                 break;
               }
 
-              return _context6.abrupt("return");
+              return _context7.abrupt("return");
 
             case 2:
-              _context6.prev = 2;
+              _context7.prev = 2;
 
               _this.setState({
                 submittingNote: true
               });
 
-              _context6.next = 6;
+              _context7.next = 6;
               return _this.state.editingNote ? maintenanceActions.editNote(_this.state.jobId, _this.state.editingNote, _this.state.noteInput, _this.state.noteAttachments.map(function (a) {
                 return {
                   Title: a.Title,
@@ -3698,7 +3764,7 @@ var Job = /*#__PURE__*/function (_Component) {
               }), _this.state.noteImages);
 
             case 6:
-              res = _context6.sent;
+              res = _context7.sent;
 
               _this.setState({
                 job: res.data.job,
@@ -3712,20 +3778,20 @@ var Job = /*#__PURE__*/function (_Component) {
                 _this.props.jobsLoaded([_this.state.job]);
               });
 
-              _context6.next = 13;
+              _context7.next = 13;
               break;
 
             case 10:
-              _context6.prev = 10;
-              _context6.t0 = _context6["catch"](2);
-              console.error('onConfirmAddNote', _context6.t0);
+              _context7.prev = 10;
+              _context7.t0 = _context7["catch"](2);
+              console.error('onConfirmAddNote', _context7.t0);
 
             case 13:
             case "end":
-              return _context6.stop();
+              return _context7.stop();
           }
         }
-      }, _callee6, null, [[2, 10]]);
+      }, _callee7, null, [[2, 10]]);
     })));
 
     _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "onDeleteNote", function (n) {
@@ -3773,42 +3839,42 @@ var Job = /*#__PURE__*/function (_Component) {
 
       _this.setState({
         updating: true
-      }, /*#__PURE__*/_asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee7() {
+      }, /*#__PURE__*/_asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee8() {
         var update;
-        return _regeneratorRuntime__default['default'].wrap(function _callee7$(_context7) {
+        return _regeneratorRuntime__default['default'].wrap(function _callee8$(_context8) {
           while (1) {
-            switch (_context7.prev = _context7.next) {
+            switch (_context8.prev = _context8.next) {
               case 0:
-                _context7.prev = 0;
+                _context8.prev = 0;
                 update = {
                   id: job.id,
                   seen: true,
                   status: job.status || 'Unassigned'
                 };
-                _context7.next = 4;
+                _context8.next = 4;
                 return maintenanceActions.editJob(update, auth.site);
 
               case 4:
-                _context7.next = 11;
+                _context8.next = 11;
                 break;
 
               case 6:
-                _context7.prev = 6;
-                _context7.t0 = _context7["catch"](0);
+                _context8.prev = 6;
+                _context8.t0 = _context8["catch"](0);
 
                 _this.setState({
                   updating: false
                 });
 
-                console.log('markSeen error', _context7.t0);
+                console.log('markSeen error', _context8.t0);
                 alert('Something went wrong with the request. Please try again.');
 
               case 11:
               case "end":
-                return _context7.stop();
+                return _context8.stop();
             }
           }
-        }, _callee7, null, [[0, 6]]);
+        }, _callee8, null, [[0, 6]]);
       })));
     });
 
@@ -3820,44 +3886,44 @@ var Job = /*#__PURE__*/function (_Component) {
       });
     });
 
-    _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "onAddComment", /*#__PURE__*/_asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee8() {
+    _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "onAddComment", /*#__PURE__*/_asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee9() {
       var _this$state2, commentInput, jobId, job, comments, res;
 
-      return _regeneratorRuntime__default['default'].wrap(function _callee8$(_context8) {
+      return _regeneratorRuntime__default['default'].wrap(function _callee9$(_context9) {
         while (1) {
-          switch (_context8.prev = _context8.next) {
+          switch (_context9.prev = _context9.next) {
             case 0:
               _this$state2 = _this.state, commentInput = _this$state2.commentInput, jobId = _this$state2.jobId, job = _this$state2.job, comments = _this$state2.comments;
-              _context8.prev = 1;
+              _context9.prev = 1;
 
               _this.setState({
                 commentInput: ''
               });
 
-              _context8.next = 5;
+              _context9.next = 5;
               return reactionActions.addComment(jobId, values.commentKey, job.title, job.site, commentInput);
 
             case 5:
-              res = _context8.sent;
+              res = _context9.sent;
 
               _this.setState({
                 comments: [].concat(_toConsumableArray__default['default'](comments), [res.data])
               });
 
-              _context8.next = 12;
+              _context9.next = 12;
               break;
 
             case 9:
-              _context8.prev = 9;
-              _context8.t0 = _context8["catch"](1);
-              console.error('onAddComment', _context8.t0);
+              _context9.prev = 9;
+              _context9.t0 = _context9["catch"](1);
+              console.error('onAddComment', _context9.t0);
 
             case 12:
             case "end":
-              return _context8.stop();
+              return _context9.stop();
           }
         }
-      }, _callee8, null, [[1, 9]]);
+      }, _callee9, null, [[1, 9]]);
     })));
 
     _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "onHandleChange", function (event) {
@@ -3874,11 +3940,11 @@ var Job = /*#__PURE__*/function (_Component) {
     });
 
     _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "onSelectPriority", /*#__PURE__*/function () {
-      var _ref9 = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee9(priority) {
+      var _ref10 = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee10(priority) {
         var res, job;
-        return _regeneratorRuntime__default['default'].wrap(function _callee9$(_context9) {
+        return _regeneratorRuntime__default['default'].wrap(function _callee10$(_context10) {
           while (1) {
-            switch (_context9.prev = _context9.next) {
+            switch (_context10.prev = _context10.next) {
               case 0:
                 _this.setState({
                   job: _objectSpread$4(_objectSpread$4({}, _this.state.job), {}, {
@@ -3887,12 +3953,12 @@ var Job = /*#__PURE__*/function (_Component) {
                   priorityChangerOpen: false
                 });
 
-                _context9.prev = 1;
-                _context9.next = 4;
+                _context10.prev = 1;
+                _context10.next = 4;
                 return maintenanceActions.editJobPriority(_this.state.job.id, priority);
 
               case 4:
-                res = _context9.sent;
+                res = _context10.sent;
                 job = res.data.job;
 
                 _this.props.jobsLoaded([job]);
@@ -3901,24 +3967,24 @@ var Job = /*#__PURE__*/function (_Component) {
                   job: job
                 });
 
-                _context9.next = 13;
+                _context10.next = 13;
                 break;
 
               case 10:
-                _context9.prev = 10;
-                _context9.t0 = _context9["catch"](1);
-                console.error('onSelectPriority', _context9.t0);
+                _context10.prev = 10;
+                _context10.t0 = _context10["catch"](1);
+                console.error('onSelectPriority', _context10.t0);
 
               case 13:
               case "end":
-                return _context9.stop();
+                return _context10.stop();
             }
           }
-        }, _callee9, null, [[1, 10]]);
+        }, _callee10, null, [[1, 10]]);
       }));
 
       return function (_x2) {
-        return _ref9.apply(this, arguments);
+        return _ref10.apply(this, arguments);
       };
     }());
 
@@ -3929,11 +3995,11 @@ var Job = /*#__PURE__*/function (_Component) {
     });
 
     _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "onSelectStatus", /*#__PURE__*/function () {
-      var _ref10 = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee10(status) {
+      var _ref11 = _asyncToGenerator__default['default']( /*#__PURE__*/_regeneratorRuntime__default['default'].mark(function _callee11(status) {
         var res, job;
-        return _regeneratorRuntime__default['default'].wrap(function _callee10$(_context10) {
+        return _regeneratorRuntime__default['default'].wrap(function _callee11$(_context11) {
           while (1) {
-            switch (_context10.prev = _context10.next) {
+            switch (_context11.prev = _context11.next) {
               case 0:
                 _this.setState({
                   job: _objectSpread$4(_objectSpread$4({}, _this.state.job), {}, {
@@ -3942,12 +4008,12 @@ var Job = /*#__PURE__*/function (_Component) {
                   statusChangerOpen: false
                 });
 
-                _context10.prev = 1;
-                _context10.next = 4;
+                _context11.prev = 1;
+                _context11.next = 4;
                 return maintenanceActions.editJobStatus(_this.state.job.id, status);
 
               case 4:
-                res = _context10.sent;
+                res = _context11.sent;
                 job = res.data.job;
 
                 _this.props.jobsLoaded([job]);
@@ -3956,24 +4022,24 @@ var Job = /*#__PURE__*/function (_Component) {
                   job: job
                 });
 
-                _context10.next = 13;
+                _context11.next = 13;
                 break;
 
               case 10:
-                _context10.prev = 10;
-                _context10.t0 = _context10["catch"](1);
-                console.error('onSelectStatus', _context10.t0);
+                _context11.prev = 10;
+                _context11.t0 = _context11["catch"](1);
+                console.error('onSelectStatus', _context11.t0);
 
               case 13:
               case "end":
-                return _context10.stop();
+                return _context11.stop();
             }
           }
-        }, _callee10, null, [[1, 10]]);
+        }, _callee11, null, [[1, 10]]);
       }));
 
       return function (_x3) {
-        return _ref10.apply(this, arguments);
+        return _ref11.apply(this, arguments);
       };
     }());
 
@@ -3993,7 +4059,10 @@ var Job = /*#__PURE__*/function (_Component) {
       noteImages: [],
       assignees: [],
       externalSync: null,
-      loadingExternalSync: false
+      loadingExternalSync: false,
+      retryingSync: false,
+      retrySyncError: null,
+      retrySyncInitiated: false
     };
     return _this;
   }
@@ -4525,24 +4594,122 @@ var Job = /*#__PURE__*/function (_Component) {
         className: "flex-1"
       }, "Priority")));
     }
+  }, {
+    key: "hasSyncFailureWithoutSuccess",
+    value: function hasSyncFailureWithoutSuccess() {
+      var job = this.state.job;
+      if (!job || !job.history) return false;
+      var history = job.history || [];
+      var hasSuccess = history.some(function (entry) {
+        return entry.EntryType === 'ExternalIDSet';
+      });
+      var hasFailure = history.some(function (entry) {
+        return entry.EntryType === 'ExternalIDSetFailed';
+      });
+      return hasFailure && !hasSuccess;
+    }
+  }, {
+    key: "renderRetrySyncButton",
+    value: function renderRetrySyncButton() {
+      var auth = this.props.auth;
+      var _this$state3 = this.state,
+          retryingSync = _this$state3.retryingSync,
+          retrySyncInitiated = _this$state3.retrySyncInitiated; // Only show for users with maintenance tracking permission
+
+      if (!Session$3.validateAccess(auth.site, values.permissionMaintenanceTracking, auth)) return null; // Only show if there's a failure without success and retry hasn't been initiated
+
+      if (!this.hasSyncFailureWithoutSuccess() || retrySyncInitiated) return null; // Show spinner while retrying
+
+      if (retryingSync) {
+        return /*#__PURE__*/React__default['default'].createElement(FontAwesome__default['default'], {
+          style: {
+            fontSize: 20,
+            color: Colours$1.COLOUR_DUSK_LIGHT,
+            marginLeft: 8
+          },
+          name: "spinner fa-pulse fa-fw"
+        });
+      }
+
+      return /*#__PURE__*/React__default['default'].createElement("div", {
+        className: "statusLabel pointer",
+        onClick: this.onRetrySync,
+        style: {
+          backgroundColor: Colours$1.COLOUR_RED,
+          marginLeft: 8
+        }
+      }, /*#__PURE__*/React__default['default'].createElement("span", {
+        className: "statusLabel_text"
+      }, "Retry Sync"));
+    }
+  }, {
+    key: "renderExternalSyncStatus",
+    value: function renderExternalSyncStatus() {
+      var _this$state4 = this.state,
+          retrySyncError = _this$state4.retrySyncError,
+          retrySyncInitiated = _this$state4.retrySyncInitiated; // Show error message if retry failed
+
+      if (retrySyncError) {
+        return /*#__PURE__*/React__default['default'].createElement(Components$3.Text, {
+          type: "body"
+        }, /*#__PURE__*/React__default['default'].createElement(FontAwesome__default['default'], {
+          className: "userStatusIcon",
+          name: "times-circle",
+          style: {
+            color: Colours$1.COLOUR_RED
+          }
+        }), " ", retrySyncError);
+      } // Show success message if retry was initiated
+
+
+      if (retrySyncInitiated) {
+        return /*#__PURE__*/React__default['default'].createElement(Components$3.Text, {
+          type: "body"
+        }, /*#__PURE__*/React__default['default'].createElement(FontAwesome__default['default'], {
+          className: "userStatusIcon",
+          name: "check-circle",
+          style: {
+            color: Colours$1.COLOUR_GREEN
+          }
+        }), " Sync retry initiated. Check back shortly for results.");
+      } // Show failure message with instruction
+
+
+      if (this.hasSyncFailureWithoutSuccess()) {
+        return /*#__PURE__*/React__default['default'].createElement(Components$3.Text, {
+          type: "body"
+        }, /*#__PURE__*/React__default['default'].createElement(FontAwesome__default['default'], {
+          className: "userStatusIcon",
+          name: "times-circle",
+          style: {
+            color: Colours$1.COLOUR_RED
+          }
+        }), " External sync failed. Use the retry button to attempt again.");
+      }
+
+      return null;
+    }
   }, {
     key: "renderExternalSync",
     value: function renderExternalSync() {
-      var _this$state3 = this.state,
-          externalSync = _this$state3.externalSync,
-          loadingExternalSync = _this$state3.loadingExternalSync; // Only show if external sync data exists
+      var _this$state5 = this.state,
+          externalSync = _this$state5.externalSync,
+          loadingExternalSync = _this$state5.loadingExternalSync; // Check if we should show this section at all
+
+      var hasExternalSyncData = externalSync && !loadingExternalSync;
+      var hasSyncFailure = this.hasSyncFailureWithoutSuccess(); // Show section if we have sync data OR if there's a failure that can be retried
 
-      if (!externalSync || loadingExternalSync) return null;
+      if (!hasExternalSyncData && !hasSyncFailure) return null;
       return /*#__PURE__*/React__default['default'].createElement("div", {
         className: "padding-32 paddingVertical-40 bottomDivideBorder relative"
       }, /*#__PURE__*/React__default['default'].createElement("div", {
         className: "newTopBar clearfix flex flex-reverse"
-      }, /*#__PURE__*/React__default['default'].createElement(Components$3.Text, {
+      }, this.renderRetrySyncButton(), /*#__PURE__*/React__default['default'].createElement(Components$3.Text, {
         type: "formTitleSmall",
         className: "flex-1"
       }, "External Sync")), /*#__PURE__*/React__default['default'].createElement("div", {
         className: "marginTop-16"
-      }, externalSync.systemType && /*#__PURE__*/React__default['default'].createElement(Components$3.Text, {
+      }, hasExternalSyncData ? /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, externalSync.systemType && /*#__PURE__*/React__default['default'].createElement(Components$3.Text, {
         type: "body",
         className: "marginBottom-8"
       }, /*#__PURE__*/React__default['default'].createElement("strong", null, "System:"), " ", externalSync.systemType), externalSync.externalId && /*#__PURE__*/React__default['default'].createElement(Components$3.Text, {
@@ -4551,7 +4718,7 @@ var Job = /*#__PURE__*/function (_Component) {
       }, /*#__PURE__*/React__default['default'].createElement("strong", null, "External ID:"), " ", externalSync.externalId), externalSync.syncedAt && /*#__PURE__*/React__default['default'].createElement(Components$3.Text, {
         type: "body",
         className: "marginBottom-8"
-      }, /*#__PURE__*/React__default['default'].createElement("strong", null, "Synced:"), " ", moment__default['default'].utc(externalSync.syncedAt).local().format('D MMM YYYY h:mma'))));
+      }, /*#__PURE__*/React__default['default'].createElement("strong", null, "Synced:"), " ", moment__default['default'].utc(externalSync.syncedAt).local().format('D MMM YYYY h:mma'))) : this.renderExternalSyncStatus()));
     }
   }, {
     key: "renderOverview",
@@ -4709,8 +4876,8 @@ var Job = /*#__PURE__*/function (_Component) {
       }), /*#__PURE__*/React__default['default'].createElement("p", {
         className: "iconTextButton_text"
       }, "Add Attachment")), /*#__PURE__*/React__default['default'].createElement(Components$3.ImageInput, {
-        ref: function ref(_ref11) {
-          _this8.imageInput = _ref11;
+        ref: function ref(_ref12) {
+          _this8.imageInput = _ref12;
         },
         multiple: true,
         refreshCallback: function refreshCallback(images) {