@lyra/default-layout/lib/components/UpdateNotifier.js

The default layout components for Lyra

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _warningIcon = require('part:@lyra/base/warning-icon');

var _warningIcon2 = _interopRequireDefault(_warningIcon);

var _versionChecker = require('part:@lyra/base/version-checker');

var _versionChecker2 = _interopRequireDefault(_versionChecker);

var _UpdateNotifierDialog = require('./UpdateNotifierDialog');

var _UpdateNotifierDialog2 = _interopRequireDefault(_UpdateNotifierDialog);

var _CurrentVersionsDialog = require('./CurrentVersionsDialog');

var _CurrentVersionsDialog2 = _interopRequireDefault(_CurrentVersionsDialog);

var _UpdateNotifier = require('./styles/UpdateNotifier.css');

var _UpdateNotifier2 = _interopRequireDefault(_UpdateNotifier);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

const logError = err => console.error(err);
const classes = { low: 'notice', medium: 'warn', high: 'critical' };
const levels = ['low', 'medium', 'high'];
const getHighestLevel = outdated => outdated.reduce((acc, pkg) => Math.max(acc, levels.indexOf(pkg.severity)), 0);

class UpdateNotifier extends _react.Component {
  constructor(...args) {
    var _temp;

    return _temp = super(...args), this.state = {}, this.handleVersionReply = ({ result }) => {
      const isSupported = result.isSupported,
            isUpToDate = result.isUpToDate,
            outdated = result.outdated;

      const level = levels[getHighestLevel(outdated || [])];
      this.setState({ isSupported, isUpToDate, level, outdated });
    }, this.handleShowUpdateNotifier = () => {
      this.setState({ showUpdateNotifier: true });
    }, this.handleHideUpdateNotifier = () => {
      this.setState({ showUpdateNotifier: false });
    }, _temp;
  }

  componentDidMount() {
    _versionChecker2.default.checkVersions().then(this.handleVersionReply).catch(logError);
  }

  render() {
    var _state = this.state;
    const level = _state.level,
          outdated = _state.outdated,
          isUpToDate = _state.isUpToDate,
          isSupported = _state.isSupported,
          showUpdateNotifier = _state.showUpdateNotifier;

    const severity = isSupported ? level : 'high';
    const className = _UpdateNotifier2.default[classes[severity] || 'button'];
    const Dialog = isUpToDate ? _CurrentVersionsDialog2.default : _UpdateNotifierDialog2.default;

    return _react2.default.createElement(
      'div',
      { className: _UpdateNotifier2.default.container },
      showUpdateNotifier && _react2.default.createElement(Dialog, {
        severity: severity,
        outdated: outdated,
        onClose: this.handleHideUpdateNotifier
      }),
      _react2.default.createElement(
        'button',
        {
          type: 'button',
          onClick: this.handleShowUpdateNotifier,
          className: className
        },
        !isUpToDate && _react2.default.createElement(
          'div',
          { className: _UpdateNotifier2.default.warningIcon },
          _react2.default.createElement(_warningIcon2.default, null)
        ),
        _react2.default.createElement(
          'div',
          {
            className: isUpToDate ? _UpdateNotifier2.default.upToDateText : _UpdateNotifier2.default.upgradeText
          },
          isUpToDate ? 'Up to date' : 'Upgrade'
        )
      )
    );
  }
}

exports.default = UpdateNotifier;