// 3rd-Party Libraries
import React from 'react';
import PropTypes from 'prop-types';
import debounce from 'lodash/debounce';

// Components
import CodeEditor from '../../../CodeEditor';

// Permissions
import { PermissionContext } from '../..';

export default function TutorialResponse(_ref) {
  var response = _ref.response,
      updateTutorial = _ref.updateTutorial;

  var handleChange = function handleChange(value, _ref2, readOnly) {
    var origin = _ref2.origin;

    if (['+input', 'paste', '+delete'].includes(origin) && !readOnly) {
      updateTutorial({ response: value });
    }
  };

  var _onChange = process.env.NODE_ENV === 'test' ? handleChange : debounce(handleChange, 300);

  return React.createElement(
    PermissionContext.Consumer,
    null,
    function (readOnly) {
      return React.createElement(CodeEditor, {
        code: response,
        lang: 'json',
        onChange: function onChange(editor, data, value) {
          _onChange(value, data, readOnly);
        },
        options: { readOnly: readOnly ? 'nocursor' : false }
      });
    }
  );
}

TutorialResponse.propTypes = process.env.NODE_ENV !== "production" ? {
  response: PropTypes.string,
  updateTutorial: PropTypes.func
} : {};

TutorialResponse.defaultProps = {
  response: ''
};