import React from "react";
import { connect } from "../../../redux";
import { set } from "dot-prop-immutable";
import { i18n } from '@fishx/i18n';
import { getActiveElement } from "../../../selectors";
import { SimpleForm as Form, Select } from '@whalecloud/fdx';
import { toolFormAttr } from "../../../utils";
var Option = Select.Option;
var itemKey = 'data.formSettings';

var MacroSettings = function MacroSettings(props) {
  var updateElement = props.updateElement,
      element = props.element,
      _props$macros = props.macros,
      macros = _props$macros === void 0 ? [] : _props$macros;

  if (!element.data.formSettings) {
    return null;
  }

  var _element$data$formSet = element.data.formSettings.macroValue,
      macroValue = _element$data$formSet === void 0 ? null : _element$data$formSet;

  var onFormChange = function onFormChange(obj) {
    Object.keys(obj).forEach(function (key) {
      var value = obj[key] === 'null' ? null : obj[key];
      var newElement = set(element, "".concat(itemKey, ".").concat(key), value);
      updateElement({
        element: newElement
      });
    });
  };

  return /*#__PURE__*/React.createElement(Form, Object.assign({}, toolFormAttr, {
    initialValues: {
      macroValue: macroValue
    },
    onValuesChange: onFormChange
  }), /*#__PURE__*/React.createElement(Form.Item, {
    label: i18n('PAGEBUIDER_SETTINGS_MACRO'),
    name: "macroValue"
  }, /*#__PURE__*/React.createElement(Select, {
    allowClear: true,
    placeholder: "Please Choose Macro Value"
  }, macros.map(function (macro, index) {
    return /*#__PURE__*/React.createElement(Option, {
      key: "macro_item_".concat(index),
      value: macro.value
    }, macro.label);
  }))));
};

var mapDispatchToProps = function mapDispatchToProps(dispatch) {
  return {
    updateElement: function updateElement(payload) {
      dispatch({
        type: 'appBuilder/updateAndFlattenElement',
        payload: payload
      });
    }
  };
};

export default connect(function (state) {
  return {
    element: getActiveElement(state),
    macros: state.appRender.macro
  };
}, mapDispatchToProps)(MacroSettings);
//# sourceMappingURL=MacroSettings.js.map