import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import React, { useState } from 'react';
import { connect } from "../../../redux";
import cloneDeep from 'lodash/cloneDeep';
import { getContent } from "../../../selectors";
import { IconButton } from '@webiny/ui/Button';
import { ReactComponent as InactiveIcon } from "@svgr/webpack!../../../assets/icons/page-preview-icon.svg";
import { deleteFormInstance } from "../../../../utils/util";
import PreviewDrawer from "./PreviewDrawer";

var PagePreviewButton = function PagePreviewButton(_ref) {
  var content = _ref.content,
      previewUrl = _ref.previewUrl,
      updateElement = _ref.updateElement,
      setInitialPageJson = _ref.setInitialPageJson;

  var _useState = useState(false),
      _useState2 = _slicedToArray(_useState, 2),
      previewVisible = _useState2[0],
      setPreviewVisible = _useState2[1];

  var handleClick = function handleClick() {
    var json = deleteFormInstance(cloneDeep(content)); // updateElement({ element: json });

    setInitialPageJson({
      content: json
    });
    setPreviewVisible(true); // Fishx.history.push(previewUrl.startsWith('/') ? previewUrl : `/${previewUrl}`);
  };

  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
    className: "formbuild-btn-opt-default-color",
    onClick: function onClick() {
      return handleClick();
    }
  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(IconButton, {
    icon: /*#__PURE__*/React.createElement(InactiveIcon, null)
  }))), /*#__PURE__*/React.createElement(PreviewDrawer, {
    visible: previewVisible,
    setVisible: setPreviewVisible
  }));
};

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

export default connect(function (state) {
  return {
    content: getContent(state),
    previewUrl: state.appRender.previewUrl
  };
}, mapDispatchToProps)(PagePreviewButton);
//# sourceMappingURL=PagePreviewButton.js.map