function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import React, { useState } from "react";
import { showContextMenu, commandMenuEnhancer, FillWindow } from "teselagen-react-components";
import { CircularView } from "./CircularView";
import { LinearView } from "./LinearView";
import { RowView } from "./RowView";
import { HoveredIdContext } from "./helperComponents/withHover";
import { visibilityDefaultValues } from "./redux/annotationVisibility";
import { addWrappedAddons } from "./utils/addWrappedAddons";
import { SimpleOligoPreview } from "./SimpleOligoPreview";
import { cloneDeep, flatMap, map, startCase } from "lodash";
import { Button, ButtonGroup, Menu, MenuItem, Popover, Tooltip } from "@blueprintjs/core";
import getCommands from "./commands";
import { withHandlers } from "recompose";
import { exportSequenceToFile } from "./withEditorProps";
import { editorClicked as _editorClicked, updateSelectionOrCaret as _updateSelectionOrCaret } from "./withEditorInteractions/clickAndDragUtils";

//this view is meant to be a helper for showing a simple (non-redux connected) circular or linear view!
export default (function (props) {
  var _sequenceData = props.sequenceData,
    _props$annotationVisi = props.annotationVisibility,
    _annotationVisibility = _props$annotationVisi === void 0 ? {} : _props$annotationVisi,
    _props$noWarnings = props.noWarnings,
    noWarnings = _props$noWarnings === void 0 ? true : _props$noWarnings,
    withDownload = props.withDownload,
    withChoosePreviewType = props.withChoosePreviewType,
    withCaretEnabled = props.withCaretEnabled,
    withSelectionEnabled = props.withSelectionEnabled,
    smallSlider = props.smallSlider,
    withVisibilityOptions = props.withVisibilityOptions,
    minimalPreviewTypeBtns = props.minimalPreviewTypeBtns,
    withFullscreen = props.withFullscreen,
    selectionLayer = props.selectionLayer,
    selectionLayerUpdate = props.selectionLayerUpdate,
    caretPositionUpdate = props.caretPositionUpdate;
  var _useState = useState(_sequenceData.circular ? "circular" : "linear"),
    previewType = _useState[0],
    setPreviewType = _useState[1];
  var _useState2 = useState(false),
    isPopoverOpen = _useState2[0],
    setPopoverOpen = _useState2[1];
  var _useState3 = useState(false),
    isFullscreen = _useState3[0],
    setFullscreen = _useState3[1];
  var _useState4 = useState({}),
    visibilityOptions = _useState4[0],
    setVisibilityOptions = _useState4[1];
  var _useState5 = useState(withCaretEnabled ? -1 : undefined),
    caretPosition = _useState5[0],
    _caretPositionUpdate = _useState5[1];
  var _useState6 = useState(withSelectionEnabled ? {
      start: -1,
      end: -1
    } : undefined),
    _selectionLayer = _useState6[0],
    _selectionLayerUpdate = _useState6[1];
  var sequenceLength = _sequenceData.noSequence ? _sequenceData.size : _sequenceData.sequence.length;
  selectionLayer = selectionLayer || _selectionLayer;
  var selectionLayerUpdateOld = selectionLayerUpdate || _selectionLayerUpdate;
  var caretPositionUpdateOld = caretPositionUpdate || _caretPositionUpdate;
  selectionLayerUpdate = function selectionLayerUpdate(newSel, dontTrigger) {
    if (!dontTrigger && newSel.start > -1) {
      caretPositionUpdate(-1, true);
    }
    selectionLayerUpdateOld(newSel);
  };
  caretPositionUpdate = function caretPositionUpdate(newCaret, dontTrigger) {
    if (!dontTrigger && newCaret > -1) {
      selectionLayerUpdate({
        start: -1,
        end: -1
      }, true);
    }
    caretPositionUpdateOld(newCaret);
  };
  function annotationClicked(_ref) {
    var annotation = _ref.annotation,
      event = _ref.event;
    event.stopPropagation();
    event.preventDefault();
    withSelectionEnabled && _updateSelectionOrCaret({
      doNotWrapOrigin: !sequenceData.circular,
      shiftHeld: event.shiftKey,
      sequenceLength: sequenceLength,
      newRangeOrCaret: annotation,
      caretPosition: caretPosition,
      selectionLayer: selectionLayer,
      selectionLayerUpdate: selectionLayerUpdate,
      caretPositionUpdate: caretPositionUpdate
    });
  }
  var tickSpacing = undefined;
  var Component = (withChoosePreviewType ? previewType === "circular" : _sequenceData.circular) ? CircularView : _sequenceData.isOligo && _sequenceData.sequence ? SimpleOligoPreview : LinearView;
  if (withChoosePreviewType && previewType === "row") {
    Component = RowView;
    tickSpacing = undefined;
  }
  var sequenceData = cloneDeep(_sequenceData);
  var annotationVisibility = _extends({}, visibilityDefaultValues, _annotationVisibility, visibilityOptions);

  //here we're making it possible to not pass a sequenceData.sequence
  //we can just pass a .size property to save having to send the whole sequence if it isn't needed!
  if (sequenceData.noSequence) {
    annotationVisibility.sequence = false;
    annotationVisibility.reverseSequence = false;
    if (sequenceData.size === undefined) {
      return /*#__PURE__*/React.createElement("div", null, "Error: No sequenceData.size detected when using noSequence flag", " ");
    }
    sequenceData = _extends({}, sequenceData, {
      sequence: {
        length: sequenceData.size
      }
    });
  }
  sequenceData.parts = addWrappedAddons(sequenceData.parts, sequenceData.sequence.length);
  var inner = function inner(_ref2) {
    var width = _ref2.width,
      height = _ref2.height;
    return /*#__PURE__*/React.createElement(HoveredIdContext.Provider, {
      value: {
        hoveredId: props.hoveredId
      }
    }, /*#__PURE__*/React.createElement("div", {
      style: {
        width: "fit-content"
      }
    }, (withDownload || withChoosePreviewType || withFullscreen || VisibilityOptions) && /*#__PURE__*/React.createElement("div", {
      style: _extends({
        marginLeft: 10,
        marginBottom: 5
      }, isFullscreen && {
        marginRight: 10,
        paddingTop: 10
      }, {
        display: "flex",
        justifyContent: "end"
      })
    }, withDownload && /*#__PURE__*/React.createElement(DownloadBtn, props), withVisibilityOptions && /*#__PURE__*/React.createElement(VisibilityOptions, _extends({}, props, {
      sequenceData: sequenceData,
      annotationVisibility: annotationVisibility,
      setVisibilityOptions: setVisibilityOptions,
      isPopoverOpen: isPopoverOpen,
      setPopoverOpen: setPopoverOpen
    })), withChoosePreviewType && /*#__PURE__*/React.createElement(ButtonGroup, null, /*#__PURE__*/React.createElement(Tooltip, {
      content: "Circular View"
    }, /*#__PURE__*/React.createElement(Button, {
      minimal: minimalPreviewTypeBtns,
      className: "tgPreviewTypeCircular",
      active: previewType === "circular",
      intent: "primary",
      onClick: function onClick() {
        return setPreviewType("circular");
      },
      icon: "circle"
    })), /*#__PURE__*/React.createElement(Tooltip, {
      content: "Linear View"
    }, /*#__PURE__*/React.createElement(Button, {
      minimal: minimalPreviewTypeBtns,
      className: "tgPreviewTypeLinear",
      active: previewType === "linear",
      intent: "primary",
      onClick: function onClick() {
        return setPreviewType("linear");
      },
      icon: "layout-linear"
    })), /*#__PURE__*/React.createElement(Tooltip, {
      content: "Sequence View"
    }, /*#__PURE__*/React.createElement(Button, {
      minimal: minimalPreviewTypeBtns,
      className: "tgPreviewTypeRow",
      active: previewType === "row",
      intent: "primary",
      onClick: function onClick() {
        return setPreviewType("row");
      },
      icon: "menu"
    }))), withFullscreen && /*#__PURE__*/React.createElement(FullscreenBtn, {
      setFullscreen: setFullscreen,
      isFullscreen: isFullscreen
    })), /*#__PURE__*/React.createElement(Component, _extends({
      showCicularViewInternalLabels: true,
      className: "tg-simple-dna-view veEditor",
      width: 300,
      height: 300,
      noWarnings: noWarnings,
      partClicked: annotationClicked,
      featureClicked: annotationClicked,
      primerClicked: annotationClicked
    }, props, isFullscreen && {
      width: width - 10,
      height: height - 10
    }, {
      smartCircViewLabelRender: true,
      caretPosition: caretPosition,
      smallSlider: smallSlider
    }, withSelectionEnabled && {
      selectionLayer: selectionLayer,
      selectionLayerUpdate: selectionLayerUpdate
    }, {
      readOnly: true,
      editorClicked: function editorClicked(_temp) {
        var _ref3 = _temp === void 0 ? {} : _temp,
          nearestCaretPos = _ref3.nearestCaretPos,
          event = _ref3.event;
        if (!withCaretEnabled) {
          if (!withSelectionEnabled) return;
          if (!event.shiftKey) return;
          if (!(selectionLayer.start > -1)) return;
        }
        _editorClicked({
          nearestCaretPos: nearestCaretPos,
          shiftHeld: !withSelectionEnabled ? false : event.shiftKey,
          updateSelectionOrCaret: function updateSelectionOrCaret(shiftHeld, newRangeOrCaret) {
            _updateSelectionOrCaret({
              doNotWrapOrigin: !sequenceData.circular,
              sequenceLength: sequenceLength,
              shiftHeld: shiftHeld,
              newRangeOrCaret: newRangeOrCaret,
              caretPosition: caretPosition,
              selectionLayer: selectionLayer,
              selectionLayerUpdate: selectionLayerUpdate,
              caretPositionUpdate: caretPositionUpdate
            });
          }
        });
      },
      instantiated: true,
      tickSpacing: tickSpacing,
      hoveredId: props.hoveredId,
      annotationVisibility: annotationVisibility,
      sequenceData: sequenceData,
      showTitle: true
    }))));
  };
  if (isFullscreen) {
    return /*#__PURE__*/React.createElement(FillWindow, {
      asPortal: true,
      className: "tgSimpleViewFullscreen"
    }, inner);
  }
  return inner({});
});
var DownloadBtn = withHandlers({
  exportSequenceToFile: exportSequenceToFile
})(function (props) {
  return /*#__PURE__*/React.createElement(Tooltip, {
    content: "Download"
  }, /*#__PURE__*/React.createElement(Button, {
    className: "veDownloadButton",
    style: {
      marginRight: 10
    },
    onClick: function onClick(event) {
      return showContextMenu(["exportSequenceAsGenbank", "exportSequenceAsFasta", "exportSequenceAsTeselagenJson"], [commandMenuEnhancer(getCommands({
        props: props
      }), {
        useTicks: true,
        omitIcons: true
      })], event);
    },
    minimal: true,
    intent: "primary",
    icon: "download"
  }));
});
var FullscreenBtn = function FullscreenBtn(_ref4) {
  var setFullscreen = _ref4.setFullscreen,
    isFullscreen = _ref4.isFullscreen;
  return /*#__PURE__*/React.createElement(Tooltip, {
    content: (isFullscreen ? "Close " : "") + "Fullscreen"
  }, /*#__PURE__*/React.createElement(Button, {
    className: "veFullscreenButton",
    style: {
      marginLeft: 10,
      marginRight: 10
    },
    onClick: function onClick() {
      setFullscreen(!isFullscreen);
    },
    minimal: true,
    intent: "primary",
    icon: !isFullscreen ? "maximize" : "minimize"
  }));
};
var VisibilityOptions = function VisibilityOptions(_ref5) {
  var annotationVisibility = _ref5.annotationVisibility,
    sequenceData = _ref5.sequenceData,
    setVisibilityOptions = _ref5.setVisibilityOptions,
    isPopoverOpen = _ref5.isPopoverOpen,
    setPopoverOpen = _ref5.setPopoverOpen;
  return /*#__PURE__*/React.createElement(Tooltip, {
    disabled: isPopoverOpen,
    content: "Visibility Options"
  }, /*#__PURE__*/React.createElement(Popover, {
    minimal: true,
    onInteraction: function onInteraction(isOpen) {
      setPopoverOpen(isOpen);
    },
    isOpen: isPopoverOpen,
    content: /*#__PURE__*/React.createElement(Menu, null, flatMap(["features", "parts", "primers", "translations", "cutsites"], function (name) {
      if (!map(sequenceData[name]).length) return [];
      return /*#__PURE__*/React.createElement(MenuItem, {
        onClick: function onClick(e) {
          var _extends2;
          setVisibilityOptions(_extends({}, annotationVisibility, (_extends2 = {}, _extends2[name] = !annotationVisibility[name], _extends2)));
          e.stopPropagation();
        },
        icon: annotationVisibility[name] ? "tick" : "blank",
        key: name,
        text: startCase(name)
      });
    }))
  }, /*#__PURE__*/React.createElement(Button, {
    className: "veSimpleVisibilityBtn",
    style: {
      marginLeft: 10,
      marginRight: 10
    },
    minimal: true,
    intent: "primary",
    icon: "eye-open"
  })));
};