import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import React, { useState } from "react";
import useEventCallback from "use-event-callback";
import { styled } from "@material-ui/core/styles";
import WorkspaceContainer from "../WorkspaceContainer";
import ReactTimeSeries from "react-time-series";
var Container = styled("div")({
  maxWidth: "100vw",
  display: "flex",
  flexDirection: "column"
});
var emptyObj = {};
export var TimeSeries = function TimeSeries(_ref) {
  var sampleIndex = _ref.sampleIndex,
      iface = _ref.interface,
      sampleProp = _ref.sample,
      _ref$containerProps = _ref.containerProps,
      containerProps = _ref$containerProps === void 0 ? emptyObj : _ref$containerProps,
      onModifySampleProp = _ref.onModifySample;

  var _useState = useState(sampleProp),
      _useState2 = _slicedToArray(_useState, 2),
      sample = _useState2[0],
      setSample = _useState2[1];

  var onDone = useEventCallback(function () {
    onModifySampleProp(sample);
    if (containerProps.onExit) containerProps.onExit();
  });
  var onNext = useEventCallback(function () {
    onModifySampleProp(sample);
    containerProps.onExit("go-to-next");
  });
  var onPrev = useEventCallback(function () {
    onModifySampleProp(sample);
    containerProps.onExit("go-to-previous");
  });
  return /*#__PURE__*/React.createElement(WorkspaceContainer, Object.assign({}, containerProps, {
    onNext: onNext,
    onPrev: onPrev,
    onRemoveSample: containerProps.onRemoveSample,
    onClickHeaderItem: onDone,
    currentSampleIndex: sampleIndex
  }), /*#__PURE__*/React.createElement(Container, {
    style: {
      height: containerProps.height || "calc(100% - 70px)",
      minHeight: 600
    }
  }, /*#__PURE__*/React.createElement(ReactTimeSeries, {
    sample: sample,
    interface: iface,
    onModifySample: setSample
  })));
};
export default TimeSeries;