@carbon/ibm-security/es/components/StatusIndicator/StatusIndicator-story.js

Carbon for Cloud & Cognitive IBM Security UI components

import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["key"],
  _excluded2 = ["key"],
  _excluded3 = ["key"];
/**
 * @file Status indicator stories.
 * @copyright IBM Security 2019
 */

import { action } from '@storybook/addon-actions';
import { text } from '@storybook/addon-knobs';
import { storiesOf } from '@storybook/react';
import React from 'react';
import { compose, getDisplayName, lifecycle, withStateHandlers } from 'recompose';
import { patterns } from '../../../.storybook';
import { StatusStep, StatusIndicator } from '../..';
import { STATUS } from './StatusStep/StatusStep';
import props from './_mocks_';
var statusIndicator = props.statusIndicator,
  _statusSteps = props.statusSteps;
var _retry = statusIndicator.retry,
  title = statusIndicator.title;
var storyProps = {
  statusIndicator: {
    basic: function basic() {
      return {
        title: text("Title (title)", title)
      };
    },
    retry: function retry() {
      var description = _retry.description,
        label = _retry.label;
      return {
        retry: {
          label: text("".concat(label, " label (retry.label)"), label),
          description: description,
          action: action('retry.action')
        }
      };
    }
  },
  statusSteps: function statusSteps() {
    return _statusSteps.map(function (_ref) {
      var description = _ref.description,
        key = _ref.key,
        label = _ref.label,
        status = _ref.status;
      return {
        key: key,
        label: text("".concat(description, " label (StatusStep[").concat(key, "].label)"), label),
        status: status,
        description: description,
        errorMsg: status === 'failed' ? text('Error message (errorMsg)', 'Error message') : null
      };
    });
  }
};
var statusIndicatorProps = storyProps.statusIndicator,
  statusStepsProps = storyProps.statusSteps;
var basic = statusIndicatorProps.basic,
  retryProps = statusIndicatorProps.retry;
storiesOf(patterns('StatusIndicator'), module).add('Default', function () {
  return /*#__PURE__*/React.createElement(StatusIndicator, basic(), statusStepsProps().map(function (_ref2) {
    var key = _ref2.key,
      props = _objectWithoutProperties(_ref2, _excluded);
    return /*#__PURE__*/React.createElement(StatusStep, _extends({
      key: key
    }, props));
  }));
}).add('Failure', function () {
  return /*#__PURE__*/React.createElement(StatusIndicator, _extends({}, basic(), retryProps()), statusStepsProps().map(function (_ref3) {
    var key = _ref3.key,
      props = _objectWithoutProperties(_ref3, _excluded2);
    return /*#__PURE__*/React.createElement(StatusStep, _extends({
      key: key
    }, props));
  }));
}).add('Dynamic', function () {
  var COMPLETE = STATUS.COMPLETE,
    DEFAULT = STATUS.DEFAULT;
  var interval;
  var StatusIndicatorStory = compose(withStateHandlers({
    timer: 0
  }, {
    updateTimer: function updateTimer(_ref4) {
      var timer = _ref4.timer;
      return function () {
        return {
          timer: timer + 1
        };
      };
    }
  }), lifecycle({
    componentDidMount: function componentDidMount() {
      var _this = this;
      interval = setInterval(function () {
        var _this$props = _this.props,
          updateTimer = _this$props.updateTimer,
          timer = _this$props.timer;
        _this.setState({
          current: timer
        });
        updateTimer();
        if (timer === _statusSteps.length) {
          clearInterval(interval);
        }
      }, 1000);
    },
    componentWillUnmount: function componentWillUnmount() {
      return clearInterval(interval);
    }
  }))(function (_ref5) {
    var current = _ref5.current;
    var retry = current === _statusSteps.length && retryProps();
    return /*#__PURE__*/React.createElement(StatusIndicator, _extends({}, basic(), retry), _statusSteps.map(function (_ref6) {
      var key = _ref6.key,
        props = _objectWithoutProperties(_ref6, _excluded3);
      return /*#__PURE__*/React.createElement(StatusStep, _extends({
        key: key
      }, props, {
        status: current >= key ? COMPLETE : DEFAULT
      }));
    }));
  });
  StatusIndicatorStory.displayName = getDisplayName(StatusIndicator);
  StatusIndicatorStory.__docgenInfo = StatusIndicator.__docgenInfo;
  return /*#__PURE__*/React.createElement(StatusIndicatorStory, null);
});