"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.DiffScene = void 0;

var _react = _interopRequireWildcard(require("react"));

var _reactRouterDom = require("react-router-dom");

var _components = require("@looker/components");

var _SyncAlt = require("@styled-icons/material/SyncAlt");

var _reactRedux = require("react-redux");

var _components2 = require("../../components");

var _state = require("../../state");

var _utils = require("../../utils");

var _diffUtils = require("./diffUtils");

var _DocDiff = require("./DocDiff");

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

var diffToggles = [{
  label: 'Missing',
  value: 'missing'
}, {
  label: 'Status',
  value: 'status'
}, {
  label: 'Parameters',
  value: 'params'
}, {
  label: 'Type',
  value: 'type'
}, {
  label: 'Body',
  value: 'body'
}, {
  label: 'Response',
  value: 'response'
}];

var validateParam = function validateParam(specs) {
  var specKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
  return specs[specKey] ? specKey : '';
};

var DiffScene = _ref => {
  var {
    specs,
    toggleNavigation
  } = _ref;
  var adaptor = (0, _utils.getApixAdaptor)();
  var history = (0, _reactRouterDom.useHistory)();
  var spec = (0, _reactRedux.useSelector)(_state.selectCurrentSpec);
  var currentSpecKey = spec.key;
  var match = (0, _reactRouterDom.useRouteMatch)("/".concat(_utils.diffPath, "/:l?/:r?"));
  var l = validateParam(specs, match === null || match === void 0 ? void 0 : match.params.l);
  var r = validateParam(specs, match === null || match === void 0 ? void 0 : match.params.r);
  var options = Object.entries(specs).map(_ref2 => {
    var [key, spec] = _ref2;
    return {
      value: key,
      label: "".concat(key, " (").concat(spec.status, ")")
    };
  });
  var [leftKey, setLeftKey] = (0, _react.useState)(l || currentSpecKey);
  var [rightKey, setRightKey] = (0, _react.useState)(r || '');
  var [leftApi, setLeftApi] = (0, _react.useState)(specs[leftKey].api);
  var [rightApi, setRightApi] = (0, _react.useState)(() => rightKey ? specs[rightKey].api : specs[leftKey].api);
  var [toggles, setToggles] = (0, _react.useState)(_diffUtils.standardDiffToggles);
  (0, _react.useEffect)(() => {
    if (r !== rightKey) {
      setRightKey(r);
    }
  }, [r, rightKey]);
  (0, _react.useEffect)(() => {
    if (l !== leftKey) {
      setLeftKey(l);
    }
  }, [l, leftKey]);
  (0, _react.useEffect)(() => {
    toggleNavigation(false);
  }, []);
  var [delta, setDelta] = (0, _react.useState)([]);

  var handleLeftChange = newLeft => {
    history.push("/".concat(_utils.diffPath, "/").concat(newLeft, "/").concat(rightKey));
  };

  var handleRightChange = newRight => {
    history.push("/".concat(_utils.diffPath, "/").concat(leftKey, "/").concat(newRight));
  };

  var handleSwitch = () => {
    history.push("/".concat(_utils.diffPath, "/").concat(rightKey, "/").concat(leftKey));
  };

  (0, _react.useEffect)(() => {
    adaptor.fetchSpec(specs[leftKey]).then(spec => setLeftApi(spec.api));
  }, [leftKey]);
  (0, _react.useEffect)(() => {
    if (rightKey in specs) {
      adaptor.fetchSpec(specs[rightKey]).then(spec => setRightApi(spec.api));
    }
  }, [rightKey]);
  (0, _react.useEffect)(() => {
    if (leftApi && rightApi) {
      setDelta([...(0, _diffUtils.diffSpecs)(leftApi, rightApi, toggles)]);
    }
  }, [leftApi, rightApi, toggles]);

  var handleTogglesChange = values => {
    var newToggles = values || [];
    setToggles(newToggles);
  };

  return _react.default.createElement(_components2.ApixSection, null, _react.default.createElement(_components.Box, null, _react.default.createElement(_components.Flex, {
    bg: "AliceBlue",
    padding: "large",
    mb: "large",
    alignItems: "center"
  }, _react.default.createElement(_components.FlexItem, null, _react.default.createElement(_components.Label, {
    htmlFor: "base"
  }, "Base"), _react.default.createElement(_components.Select, {
    mt: "xxsmall",
    id: "base",
    name: "Left Version",
    value: leftKey,
    options: options,
    onChange: handleLeftChange
  })), _react.default.createElement(_components.IconButton, {
    label: "switch",
    size: "small",
    disabled: !leftKey || !rightKey,
    icon: _react.default.createElement(_SyncAlt.SyncAlt, null),
    mt: "medium",
    onClick: handleSwitch
  }), _react.default.createElement(_components.FlexItem, null, _react.default.createElement(_components.Label, {
    htmlFor: "compare"
  }, "Compare"), _react.default.createElement(_components.Select, {
    mt: "xxsmall",
    id: "compare",
    name: "Right Version",
    placeholder: "Select a comparison...",
    value: rightKey,
    options: options,
    onChange: handleRightChange
  })), _react.default.createElement(_components.FlexItem, {
    flex: "2",
    ml: "large"
  }, _react.default.createElement(_components.Label, {
    htmlFor: "options"
  }, "Comparison Options"), _react.default.createElement(_components.SelectMulti, {
    mt: "xxsmall",
    id: "options",
    name: "toggles",
    placeholder: "Comparison options",
    defaultValues: toggles,
    onChange: handleTogglesChange,
    options: diffToggles
  })))), _react.default.createElement(_DocDiff.DocDiff, {
    delta: delta,
    leftKey: leftKey,
    leftSpec: leftApi,
    rightKey: rightKey,
    rightSpec: rightApi
  }));
};

exports.DiffScene = DiffScene;
//# sourceMappingURL=DiffScene.js.map