react-cimpress-fulfiller-logo - npm Package Compare versions

Comparing version 0.0.15 to 0.0.16

lib/FufillerLogo.js

@@ -7,2 +7,4 @@ 'use strict';
 
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
 var _react = require('react');
@@ -22,7 +24,17 @@
 
-class FulfillerLogo extends _react2.default.Component {
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
-  constructor(props) {
-    super(props);
-    this.state = {
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var FulfillerLogo = function (_React$Component) {
+  _inherits(FulfillerLogo, _React$Component);
+
+  function FulfillerLogo(props) {
+    _classCallCheck(this, FulfillerLogo);
+
+    var _this = _possibleConstructorReturn(this, (FulfillerLogo.__proto__ || Object.getPrototypeOf(FulfillerLogo)).call(this, props));
+
+    _this.state = {
       imageObjectUrl: null,
@@ -35,3 +47,3 @@ fulfillerId: props.fulfillerId,
     };
-    this.defaultStyle = {
+    _this.defaultStyle = {
       maxWidth: "50px",
@@ -46,116 +58,134 @@ maxHeight: "50px",
     };
+    return _this;
   }
 
-  componentWillReceiveProps(newProps) {
-    if (newProps.fulfillerId !== this.props.fulfillerId) {
+  _createClass(FulfillerLogo, [{
+    key: 'componentWillReceiveProps',
+    value: function componentWillReceiveProps(newProps) {
+      var _this2 = this;
+
+      if (newProps.fulfillerId !== this.props.fulfillerId) {
+        if (this.state.imageObjectUrl) {
+          URL.revokeObjectURL(this.state.imageObjectUrl);
+        }
+        this.setState({
+          imageObjectUrl: null,
+          fulfillerId: newProps.fulfillerId,
+          imageIsLoading: false,
+          imageIsForbidden: false,
+          imageIsNotPresent: false
+        }, function () {
+          return _this2.fetchImage(_this2.state.visible);
+        });
+      }
+    }
+  }, {
+    key: 'componentWillUnmount',
+    value: function componentWillUnmount() {
       if (this.state.imageObjectUrl) {
         URL.revokeObjectURL(this.state.imageObjectUrl);
       }
-      this.setState({
-        imageObjectUrl: null,
-        fulfillerId: newProps.fulfillerId,
-        imageIsLoading: false,
-        imageIsForbidden: false,
-        imageIsNotPresent: false
-      }, () => this.fetchImage(this.state.visible));
     }
-  }
-
-  componentWillUnmount() {
-    if (this.state.imageObjectUrl) {
-      URL.revokeObjectURL(this.state.imageObjectUrl);
+  }, {
+    key: 'shouldRetryLoading',
+    value: function shouldRetryLoading() {
+      return !(this.state.imageIsForbidden || this.state.imageIsNotPresent);
     }
-  }
+  }, {
+    key: 'fetchImage',
+    value: function fetchImage(isVisible) {
+      var _this3 = this;
 
-  shouldRetryLoading() {
-    return !(this.state.imageIsForbidden || this.state.imageIsNotPresent);
-  }
-
-  fetchImage(isVisible) {
-    this.setState({
-      visible: isVisible
-    });
-    if (isVisible && !this.state.imageObjectUrl && this.shouldRetryLoading()) {
       this.setState({
-        imageIsLoading: true
+        visible: isVisible
       });
-      let headers = new Headers();
-      headers.append('Authorization', `Bearer ${this.props.accessToken}`);
-      headers.append('Accept', 'image/*');
-      let init = {
-        method: 'GET',
-        headers: headers,
-        mode: 'cors',
-        cache: 'default'
-      };
-      let url = `https://fulfilleridentity.trdlnk.cimpress.io/v1/fulfillers/${this.state.fulfillerId}/logo`;
-      try {
-        let cacheSuffix = this.props.accessToken ? JSON.parse(atob(this.props.accessToken.split('.')[1])).sub : null;
-        url += `?user=${encodeURIComponent(cacheSuffix)}`;
-      } catch (err) {
-        console.log("Unable to extract sub from the token");
-      }
-      fetch(url, init).then(response => {
-        if (response.status === 200) {
-          return response.blob();
-        } else {
-          throw response;
-        }
-      }).then(blob => {
-        this.setState({ imageObjectUrl: URL.createObjectURL(blob) });
-      }).catch(err => {
-        console.log(`Unable to fetch image for ${this.state.fulfillerId}, return status ${err.status}`);
+      if (isVisible && !this.state.imageObjectUrl && this.shouldRetryLoading()) {
         this.setState({
-          imageIsForbidden: err.status === 403,
-          imageIsNotPresent: err.status === 404
+          imageIsLoading: true
         });
-      }).then(() => {
-        this.setState({
-          imageIsLoading: false
+        var headers = new Headers();
+        headers.append('Authorization', 'Bearer ' + this.props.accessToken);
+        headers.append('Accept', 'image/*');
+        var init = {
+          method: 'GET',
+          headers: headers,
+          mode: 'cors',
+          cache: 'default'
+        };
+        var url = 'https://fulfilleridentity.trdlnk.cimpress.io/v1/fulfillers/' + this.state.fulfillerId + '/logo';
+        try {
+          var cacheSuffix = this.props.accessToken ? JSON.parse(atob(this.props.accessToken.split('.')[1])).sub : null;
+          url += '?user=' + encodeURIComponent(cacheSuffix);
+        } catch (err) {
+          console.log("Unable to extract sub from the token");
+        }
+        fetch(url, init).then(function (response) {
+          if (response.status === 200) {
+            return response.blob();
+          } else {
+            throw response;
+          }
+        }).then(function (blob) {
+          _this3.setState({ imageObjectUrl: URL.createObjectURL(blob) });
+        }).catch(function (err) {
+          console.log('Unable to fetch image for ' + _this3.state.fulfillerId + ', return status ' + err.status);
+          _this3.setState({
+            imageIsForbidden: err.status === 403,
+            imageIsNotPresent: err.status === 404
+          });
+        }).then(function () {
+          _this3.setState({
+            imageIsLoading: false
+          });
         });
-      });
+      }
     }
-  }
+  }, {
+    key: 'render',
+    value: function render() {
+      var childContent = this.props.placeholder;
+      if (this.state.imageObjectUrl) {
+        childContent = _react2.default.createElement('img', { style: { maxWidth: "inherit", maxHeight: "inherit" }, src: this.state.imageObjectUrl });
+      } else if (this.state.imageIsLoading) {
+        childContent = this.props.imageLoading || this.props.placeholder;
+      } else if (this.state.imageIsForbidden) {
+        childContent = this.props.noAccess || this.props.noImage || this.props.placeholder;
+      } else if (this.props.noImage) {
+        childContent = this.props.noImage || this.props.placeholder;
+      }
 
-  render() {
-    let childContent = this.props.placeholder;
-    if (this.state.imageObjectUrl) {
-      childContent = _react2.default.createElement('img', { style: { maxWidth: "inherit", maxHeight: "inherit" }, src: this.state.imageObjectUrl });
-    } else if (this.state.imageIsLoading) {
-      childContent = this.props.imageLoading || this.props.placeholder;
-    } else if (this.state.imageIsForbidden) {
-      childContent = this.props.noAccess || this.props.noImage || this.props.placeholder;
-    } else if (this.props.noImage) {
-      childContent = this.props.noImage || this.props.placeholder;
-    }
+      var content = null;
 
-    let content = null;
+      if (!childContent) {
+        childContent = _react2.default.createElement('span', null);
+      }
 
-    if (!childContent) {
-      childContent = _react2.default.createElement('span', null);
-    }
+      if (this.props.className) {
+        content = _react2.default.createElement(
+          'div',
+          { className: this.props.className },
+          childContent
+        );
+      } else {
+        content = _react2.default.createElement(
+          'div',
+          { style: this.defaultStyle },
+          childContent
+        );
+      }
 
-    if (this.props.className) {
-      content = _react2.default.createElement(
-        'div',
-        { className: this.props.className },
-        childContent
+      return _react2.default.createElement(
+        _reactVisibilitySensor2.default,
+        { partialVisibility: true, scrollDelay: 1000, scrollCheck: true, onChange: this.fetchImage.bind(this) },
+        content
       );
-    } else {
-      content = _react2.default.createElement(
-        'div',
-        { style: this.defaultStyle },
-        childContent
-      );
     }
+  }]);
 
-    return _react2.default.createElement(
-      _reactVisibilitySensor2.default,
-      { partialVisibility: true, scrollDelay: 1000, scrollCheck: true, onChange: this.fetchImage.bind(this) },
-      content
-    );
-  }
-}
+  return FulfillerLogo;
+}(_react2.default.Component);
 
 exports.default = FulfillerLogo;
+
+
 FulfillerLogo.propTypes = {
@@ -162,0 +192,0 @@ fulfillerId: _propTypes2.default.string,

lib/index.js

 "use strict";
 
-let FulfillerLogo = require("./FufillerLogo");
+var FulfillerLogo = require("./FufillerLogo");
 
 module.exports = FulfillerLogo;

package.json

 {
   "name": "react-cimpress-fulfiller-logo",
-  "version": "0.0.15",
+  "version": "0.0.16",
   "description": "Fetches fulfiller logo from Fulfiller Identity Service.",
@@ -41,4 +41,4 @@ "main": "./lib/index.js",
     "babel-cli": "^6.24.1",
-    "babel-plugin-transform-es2015-modules-commonjs": "^6.26.0",
     "babel-plugin-transform-react-jsx": "^6.24.1",
+    "babel-preset-env": "^1.6.1",
     "jest": "^21.2.1",
@@ -45,0 +45,0 @@ "jest-cli": "^21.2.1",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

10643

increased by28.26%

Lines of code

170

increased by17.24%

No dependency changes