@harvard-lts/mirador-citation-plugin 0.0.4 → 0.0.5

package/dist/es/index.js

@@ -646,75 +646,148 @@ var CitationButton = /*#__PURE__*/function (_Component) {
     var _this;
     _classCallCheck(this, CitationButton);
     _this = _callSuper(this, CitationButton, [props]);
-    var _this$props = _this.props,
-      manifestId = _this$props.manifestId,
-      citationAPI = _this$props.citationAPI,
-      manifestTitle = _this$props.manifestTitle;
-    _this.state = {
-      manifestId: manifestId,
-      citationAPI: citationAPI,
-      manifestTitle: manifestTitle
-    };
-    return _this;
-  }
-  _inherits(CitationButton, _Component);
-  return _createClass(CitationButton, [{
-    key: "componentDidMount",
-    value: function () {
-      var _componentDidMount = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
-        var _this2 = this;
-        var _this$state, manifestId, citationAPI, body;
+    _defineProperty(_this, "fetchCitationData", /*#__PURE__*/function () {
+      var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(manifestId, citationAPI) {
+        var body, response, citationData;
         return _regeneratorRuntime().wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
-              _this$state = this.state, manifestId = _this$state.manifestId, citationAPI = _this$state.citationAPI, _this$state.manifestTitle;
               body = {
                 "manifest_id": manifestId
               };
-              fetch(citationAPI, {
+              _context.prev = 1;
+              _context.next = 4;
+              return fetch(citationAPI, {
                 method: 'post',
                 body: JSON.stringify(body),
                 headers: {
                   'Content-Type': 'application/json'
                 }
-              }).then(function (response) {
-                if (!response.ok) {
-                  throw new Error('Network response was not ok');
-                }
-                return response.json();
-              }).then(function (citationData) {
-                _this2.setState({
-                  citationData: citationData,
-                  loading: false
-                });
-              })["catch"](function (error) {
-                console.error('There was a problem receiving the citation:', error);
-                _this2.setState({
-                  loading: false,
-                  error: error.message
-                });
               });
-            case 3:
+            case 4:
+              response = _context.sent;
+              if (response.ok) {
+                _context.next = 7;
+                break;
+              }
+              throw new Error('Network response was not ok');
+            case 7:
+              _context.next = 9;
+              return response.json();
+            case 9:
+              citationData = _context.sent;
+              _this.setState({
+                citationData: citationData,
+                loading: false
+              });
+              _context.next = 17;
+              break;
+            case 13:
+              _context.prev = 13;
+              _context.t0 = _context["catch"](1);
+              console.error('There was a problem receiving the citation:', _context.t0);
+              _this.setState({
+                loading: false,
+                error: _context.t0.message
+              });
+            case 17:
             case "end":
               return _context.stop();
           }
-        }, _callee, this);
+        }, _callee, null, [[1, 13]]);
+      }));
+      return function (_x, _x2) {
+        return _ref.apply(this, arguments);
+      };
+    }());
+    var _this$props = _this.props,
+      _manifestId = _this$props.manifestId,
+      _citationAPI = _this$props.citationAPI,
+      manifestTitle = _this$props.manifestTitle;
+    _this.state = {
+      manifestId: _manifestId,
+      citationAPI: _citationAPI,
+      manifestTitle: manifestTitle,
+      citationData: null,
+      loading: true,
+      error: null
+    };
+    return _this;
+  }
+  _inherits(CitationButton, _Component);
+  return _createClass(CitationButton, [{
+    key: "componentDidMount",
+    value: function () {
+      var _componentDidMount = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
+        var _this$state, manifestId, citationAPI;
+        return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              _this$state = this.state, manifestId = _this$state.manifestId, citationAPI = _this$state.citationAPI, _this$state.manifestTitle; // Only fetch if we have the required data
+              if (manifestId && citationAPI) {
+                this.fetchCitationData(manifestId, citationAPI);
+              } else {
+                console.log('CitationButton: manifestId or citationAPI not available yet', {
+                  manifestId: manifestId,
+                  citationAPI: citationAPI
+                });
+              }
+            case 2:
+            case "end":
+              return _context2.stop();
+          }
+        }, _callee2, this);
       }));
       function componentDidMount() {
         return _componentDidMount.apply(this, arguments);
       }
       return componentDidMount;
     }()
+  }, {
+    key: "componentDidUpdate",
+    value: function () {
+      var _componentDidUpdate = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee3(prevProps, prevState) {
+        var _this$props2, newManifestId, newCitationAPI, newManifestTitle, prevManifestId, prevCitationAPI, _this$state2, manifestId, citationAPI;
+        return _regeneratorRuntime().wrap(function _callee3$(_context3) {
+          while (1) switch (_context3.prev = _context3.next) {
+            case 0:
+              // Check if props changed and update state accordingly
+              _this$props2 = this.props, newManifestId = _this$props2.manifestId, newCitationAPI = _this$props2.citationAPI, newManifestTitle = _this$props2.manifestTitle;
+              prevManifestId = prevState.manifestId, prevCitationAPI = prevState.citationAPI; // Update state if props changed
+              if (newManifestId !== prevManifestId || newCitationAPI !== prevCitationAPI || newManifestTitle !== prevState.manifestTitle) {
+                this.setState({
+                  manifestId: newManifestId,
+                  citationAPI: newCitationAPI,
+                  manifestTitle: newManifestTitle
+                });
+              }
+
+              // Check if manifestId or citationAPI became available and fetch data
+              _this$state2 = this.state, manifestId = _this$state2.manifestId, citationAPI = _this$state2.citationAPI;
+              if ((manifestId !== prevManifestId || citationAPI !== prevCitationAPI) && manifestId && citationAPI) {
+                this.fetchCitationData(manifestId, citationAPI);
+              }
+            case 5:
+            case "end":
+              return _context3.stop();
+          }
+        }, _callee3, this);
+      }));
+      function componentDidUpdate(_x3, _x4) {
+        return _componentDidUpdate.apply(this, arguments);
+      }
+      return componentDidUpdate;
+    }()
   }, {
     key: "render",
     value: function render() {
-      var _this$props2 = this.props,
-        classes = _this$props2.classes,
-        windowId = _this$props2.windowId;
-      var _this$state2 = this.state,
-        citationData = _this$state2.citationData;
-        _this$state2.loading;
-        _this$state2.error;
+      var _this$props3 = this.props,
+        classes = _this$props3.classes,
+        windowId = _this$props3.windowId;
+      var _this$state3 = this.state,
+        citationData = _this$state3.citationData;
+        _this$state3.loading;
+        _this$state3.error;
       if (citationData) {
         if (!citationData.error) {
           return /*#__PURE__*/jsx("div", {
@@ -740,9 +813,9 @@ var CitationButton = /*#__PURE__*/function (_Component) {
   }]);
 }(Component);
 CitationButton.value = 'CitationKey';
-var mapStateToProps$3 = function mapStateToProps(state, _ref) {
+var mapStateToProps$3 = function mapStateToProps(state, _ref2) {
   var _state$config$mirador;
-  var windowId = _ref.windowId;
+  var windowId = _ref2.windowId;
   var manifestId = getManifestUrl(state, {
     windowId: windowId
   });
@@ -998,75 +1071,148 @@ var RelatedLinksButton = /*#__PURE__*/function (_Component) {
     var _this;
     _classCallCheck(this, RelatedLinksButton);
     _this = _callSuper(this, RelatedLinksButton, [props]);
-    var _this$props = _this.props,
-      manifestId = _this$props.manifestId,
-      citationAPI = _this$props.citationAPI,
-      manifestTitle = _this$props.manifestTitle;
-    _this.state = {
-      manifestId: manifestId,
-      citationAPI: citationAPI,
-      manifestTitle: manifestTitle
-    };
-    return _this;
-  }
-  _inherits(RelatedLinksButton, _Component);
-  return _createClass(RelatedLinksButton, [{
-    key: "componentDidMount",
-    value: function () {
-      var _componentDidMount = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
-        var _this2 = this;
-        var _this$state, manifestId, citationAPI, body;
+    _defineProperty(_this, "fetchRelatedLinksData", /*#__PURE__*/function () {
+      var _ref = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(manifestId, citationAPI) {
+        var body, response, citationData;
         return _regeneratorRuntime().wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
-              _this$state = this.state, manifestId = _this$state.manifestId, citationAPI = _this$state.citationAPI, _this$state.manifestTitle;
               body = {
                 "manifest_id": manifestId
               };
-              fetch(citationAPI, {
+              _context.prev = 1;
+              _context.next = 4;
+              return fetch(citationAPI, {
                 method: 'post',
                 body: JSON.stringify(body),
                 headers: {
                   'Content-Type': 'application/json'
                 }
-              }).then(function (response) {
-                if (!response.ok) {
-                  throw new Error('Network response was not ok');
-                }
-                return response.json();
-              }).then(function (citationData) {
-                _this2.setState({
-                  citationData: citationData,
-                  loading: false
-                });
-              })["catch"](function (error) {
-                console.error('There was a problem receiving the citation:', error);
-                _this2.setState({
-                  loading: false,
-                  error: error.message
-                });
               });
-            case 3:
+            case 4:
+              response = _context.sent;
+              if (response.ok) {
+                _context.next = 7;
+                break;
+              }
+              throw new Error('Network response was not ok');
+            case 7:
+              _context.next = 9;
+              return response.json();
+            case 9:
+              citationData = _context.sent;
+              _this.setState({
+                citationData: citationData,
+                loading: false
+              });
+              _context.next = 17;
+              break;
+            case 13:
+              _context.prev = 13;
+              _context.t0 = _context["catch"](1);
+              console.error('There was a problem receiving the related links:', _context.t0);
+              _this.setState({
+                loading: false,
+                error: _context.t0.message
+              });
+            case 17:
             case "end":
               return _context.stop();
           }
-        }, _callee, this);
+        }, _callee, null, [[1, 13]]);
+      }));
+      return function (_x, _x2) {
+        return _ref.apply(this, arguments);
+      };
+    }());
+    var _this$props = _this.props,
+      _manifestId = _this$props.manifestId,
+      _citationAPI = _this$props.citationAPI,
+      manifestTitle = _this$props.manifestTitle;
+    _this.state = {
+      manifestId: _manifestId,
+      citationAPI: _citationAPI,
+      manifestTitle: manifestTitle,
+      citationData: null,
+      loading: true,
+      error: null
+    };
+    return _this;
+  }
+  _inherits(RelatedLinksButton, _Component);
+  return _createClass(RelatedLinksButton, [{
+    key: "componentDidMount",
+    value: function () {
+      var _componentDidMount = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
+        var _this$state, manifestId, citationAPI;
+        return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+          while (1) switch (_context2.prev = _context2.next) {
+            case 0:
+              _this$state = this.state, manifestId = _this$state.manifestId, citationAPI = _this$state.citationAPI, _this$state.manifestTitle; // Only fetch if we have the required data
+              if (manifestId && citationAPI) {
+                this.fetchRelatedLinksData(manifestId, citationAPI);
+              } else {
+                console.log('RelatedLinksButton: manifestId or citationAPI not available yet', {
+                  manifestId: manifestId,
+                  citationAPI: citationAPI
+                });
+              }
+            case 2:
+            case "end":
+              return _context2.stop();
+          }
+        }, _callee2, this);
       }));
       function componentDidMount() {
         return _componentDidMount.apply(this, arguments);
       }
       return componentDidMount;
     }()
+  }, {
+    key: "componentDidUpdate",
+    value: function () {
+      var _componentDidUpdate = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee3(prevProps, prevState) {
+        var _this$props2, newManifestId, newCitationAPI, newManifestTitle, prevManifestId, prevCitationAPI, _this$state2, manifestId, citationAPI;
+        return _regeneratorRuntime().wrap(function _callee3$(_context3) {
+          while (1) switch (_context3.prev = _context3.next) {
+            case 0:
+              // Check if props changed and update state accordingly
+              _this$props2 = this.props, newManifestId = _this$props2.manifestId, newCitationAPI = _this$props2.citationAPI, newManifestTitle = _this$props2.manifestTitle;
+              prevManifestId = prevState.manifestId, prevCitationAPI = prevState.citationAPI; // Update state if props changed
+              if (newManifestId !== prevManifestId || newCitationAPI !== prevCitationAPI || newManifestTitle !== prevState.manifestTitle) {
+                this.setState({
+                  manifestId: newManifestId,
+                  citationAPI: newCitationAPI,
+                  manifestTitle: newManifestTitle
+                });
+              }
+
+              // Check if manifestId or citationAPI became available and fetch data
+              _this$state2 = this.state, manifestId = _this$state2.manifestId, citationAPI = _this$state2.citationAPI;
+              if ((manifestId !== prevManifestId || citationAPI !== prevCitationAPI) && manifestId && citationAPI) {
+                this.fetchRelatedLinksData(manifestId, citationAPI);
+              }
+            case 5:
+            case "end":
+              return _context3.stop();
+          }
+        }, _callee3, this);
+      }));
+      function componentDidUpdate(_x3, _x4) {
+        return _componentDidUpdate.apply(this, arguments);
+      }
+      return componentDidUpdate;
+    }()
   }, {
     key: "render",
     value: function render() {
-      var _this$props2 = this.props,
-        classes = _this$props2.classes,
-        windowId = _this$props2.windowId;
-      var _this$state2 = this.state,
-        citationData = _this$state2.citationData;
-        _this$state2.loading;
-        _this$state2.error;
+      var _this$props3 = this.props,
+        classes = _this$props3.classes,
+        windowId = _this$props3.windowId;
+      var _this$state3 = this.state,
+        citationData = _this$state3.citationData;
+        _this$state3.loading;
+        _this$state3.error;
       if (citationData) {
         if (!citationData.error) {
           return /*#__PURE__*/jsx("div", {
@@ -1092,9 +1238,9 @@ var RelatedLinksButton = /*#__PURE__*/function (_Component) {
   }]);
 }(Component);
 RelatedLinksButton.value = 'RelatedLinksKey';
-var mapStateToProps$1 = function mapStateToProps(state, _ref) {
+var mapStateToProps$1 = function mapStateToProps(state, _ref2) {
   var _state$config$mirador;
-  var windowId = _ref.windowId;
+  var windowId = _ref2.windowId;
   var manifestId = getManifestUrl(state, {
     windowId: windowId
   });

package/package.json

@@ -5,7 +5,7 @@
     "keywords": [
         "react-component"
     ],
-    "version": "0.0.4",
+    "version": "0.0.5",
     "description": "A Mirador 3 plugin for displaying Harvard-specific citations.",
     "module": "dist/es/index.js",
     "files": [