'use strict';

var _extends = require('@babel/runtime/helpers/extends');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
var isEqual = require('../../node_modules/lodash-es/isEqual.js');
var find = require('../../node_modules/lodash-es/find.js');
var omit = require('../../node_modules/lodash-es/omit.js');
var React = require('react');
var PropTypes = require('prop-types');
var LayoutConstants = require('../../constants/LayoutConstants.js');
var ValueCard = require('../ValueCard/ValueCard.js');
var TimeSeriesCard = require('../TimeSeriesCard/TimeSeriesCard.js');
var BarChartCard = require('../BarChartCard/BarChartCard.js');
var ImageCard = require('../ImageCard/ImageCard.js');
var TableCard = require('../TableCard/TableCard.js');
var ListCard = require('../ListCard/ListCard.js');
var Card = require('../Card/Card.js');
var editorUtils = require('./editorUtils.js');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var _extends__default = /*#__PURE__*/_interopDefault(_extends);
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefault(_objectWithoutProperties);
var React__default = /*#__PURE__*/_interopDefault(React);
var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);

var _excluded = ["id", "children"];

/**
 * Renders a card and lists the JSON within
 * @param {Object} props
 * @returns {Node}
 */
// eslint-disable-next-line react/prop-types
var renderDefaultCard = function renderDefaultCard(_ref) {
  var id = _ref.id,
    children = _ref.children,
    others = _objectWithoutProperties__default.default(_ref, _excluded);
  return /*#__PURE__*/React__default.default.createElement(Card.default, _extends__default.default({
    isEditable: true
  }, others), /*#__PURE__*/React__default.default.createElement("div", {
    style: {
      padding: '1rem'
    }
  }, JSON.stringify(id, null, 4)), children);
};

/**
 * This component renders our default representation of a card in the editor based on the card type
 */
var DashboardEditorDefaultCardRenderer = function DashboardEditorDefaultCardRenderer(_ref2) {
  var _cardProps$content;
  var cardProps = _ref2.card,
    availableDimensions = _ref2.availableDimensions;
  // For time based cards, we need to deduce the correct interval
  var timeRangeJSON = find(editorUtils.timeRangeToJSON, function (_ref3) {
    var _cardProps$dataSource;
    var range = _ref3.range;
    return isEqual(range, cardProps === null || cardProps === void 0 || (_cardProps$dataSource = cardProps.dataSource) === null || _cardProps$dataSource === void 0 ? void 0 : _cardProps$dataSource.range);
  });
  var interval = React.useMemo(function () {
    return (timeRangeJSON === null || timeRangeJSON === void 0 ? void 0 : timeRangeJSON.interval) || 'day';
  }, [timeRangeJSON]);

  // if our card isn't valid render the default
  if (!editorUtils.isCardJsonValid(cardProps)) {
    // eslint-disable-next-line no-console
    console.warn("Warning: The card JSON for ".concat(cardProps.id, " is invalid."));
    return renderDefaultCard(cardProps);
  }

  // otherwise we can check the type to decide which card to render
  switch (cardProps.type) {
    case LayoutConstants.CARD_TYPES.VALUE:
      return /*#__PURE__*/React__default.default.createElement(ValueCard, _extends__default.default({
        isEditable: true
      }, cardProps));
    case LayoutConstants.CARD_TYPES.TIMESERIES:
      {
        return /*#__PURE__*/React__default.default.createElement(TimeSeriesCard, _extends__default.default({
          isEditable: true,
          interval: interval
        }, cardProps));
      }
    case LayoutConstants.CARD_TYPES.BAR:
      return /*#__PURE__*/React__default.default.createElement(BarChartCard, _extends__default.default({
        isEditable: true,
        isDashboardPreview: true,
        availableDimensions: availableDimensions,
        interval: interval
      }, cardProps));
    case LayoutConstants.CARD_TYPES.TABLE:
      return /*#__PURE__*/React__default.default.createElement(TableCard
      // workaround needed to regen TableCard if columns change
      , _extends__default.default({
        key: JSON.stringify(cardProps === null || cardProps === void 0 || (_cardProps$content = cardProps.content) === null || _cardProps$content === void 0 ? void 0 : _cardProps$content.columns),
        isEditable: true
      }, cardProps));
    case LayoutConstants.CARD_TYPES.IMAGE:
      return /*#__PURE__*/React__default.default.createElement(ImageCard, _extends__default.default({}, cardProps, {
        isEditable: true // render the icon in the right color in the card preview
      }));
    case LayoutConstants.CARD_TYPES.LIST:
      return /*#__PURE__*/React__default.default.createElement(ListCard, _extends__default.default({
        isEditable: true
      }, cardProps));
    default:
      // if the user passes an element for a custom card type, render it
      return /*#__PURE__*/React__default.default.isValidElement(cardProps.content) || typeof cardProps.content === 'function' ? /*#__PURE__*/React__default.default.createElement(Card.default, _extends__default.default({
        isEditable: true
        // need to omit the content because its getting passed content to be rendered, which should not
        // get attached to the card wrapper
      }, omit(cardProps, 'content')), cardProps.content, cardProps.children // children is the resizable element attached by react-grid-layout which must be rendered to support resizing
      ) :
      // all else fails render the default card
      renderDefaultCard(cardProps);
  }
};
DashboardEditorDefaultCardRenderer.propTypes = {
  card: PropTypes__default.default.oneOfType([PropTypes__default.default.object]),
  availableDimensions: PropTypes__default.default.objectOf(PropTypes__default.default.arrayOf(PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number])))
};
DashboardEditorDefaultCardRenderer.defaultProps = {
  card: undefined,
  availableDimensions: undefined
};
DashboardEditorDefaultCardRenderer.__docgenInfo = {
  "description": "This component renders our default representation of a card in the editor based on the card type",
  "methods": [],
  "displayName": "DashboardEditorDefaultCardRenderer",
  "props": {
    "card": {
      "defaultValue": {
        "value": "undefined",
        "computed": true
      },
      "description": "",
      "type": {
        "name": "union",
        "value": [{
          "name": "object"
        }]
      },
      "required": false
    },
    "availableDimensions": {
      "defaultValue": {
        "value": "undefined",
        "computed": true
      },
      "description": "",
      "type": {
        "name": "objectOf",
        "value": {
          "name": "arrayOf",
          "value": {
            "name": "union",
            "value": [{
              "name": "string"
            }, {
              "name": "number"
            }]
          }
        }
      },
      "required": false
    }
  }
};
var DashboardEditorDefaultCardRenderer$1 = DashboardEditorDefaultCardRenderer;

module.exports = DashboardEditorDefaultCardRenderer$1;
