import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import React, { useState } from "react";
import { styled } from "@material-ui/core/styles";
import Box from "@material-ui/core/Box";
import Stepper from "@material-ui/core/Stepper";
import Step from "@material-ui/core/Step";
import StepLabel from "@material-ui/core/StepLabel";
import { useLabelHelp } from "./";
import * as colors from "@material-ui/core/colors";
import LabelHelpSetup from "./label-help-setup";
import LabelHelpRunning from "./label-help-running";
import LabelHelpCompleted from "./label-help-completed";
var Container = styled("div")({
  fontVariantNumeric: "tabular-nums"
});
var steps = ["setup", "running", "completed"];
export default (function () {
  var _useState = useState("setup"),
      _useState2 = _slicedToArray(_useState, 2),
      activeStep = _useState2[0],
      setActiveStep = _useState2[1];

  var _useLabelHelp = useLabelHelp(),
      labelHelpEnabled = _useLabelHelp.labelHelpEnabled,
      labelHelpError = _useLabelHelp.labelHelpError;

  var _useState3 = useState(),
      _useState4 = _slicedToArray(_useState3, 2),
      error = _useState4[0],
      setError = _useState4[1];

  if (!labelHelpEnabled) return /*#__PURE__*/React.createElement(Container, null, "Label Help isn't enabled, check the error below. If you can't resolve the error, reach out on", " ", /*#__PURE__*/React.createElement("a", {
    href: "https://universaldatatool.slack.com"
  }, "the slack"), " for more help!", labelHelpError && /*#__PURE__*/React.createElement("div", {
    style: {
      color: colors.red[500],
      marginTop: 24
    }
  }, labelHelpError));
  return /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement(Stepper, {
    activeStep: steps.indexOf(activeStep)
  }, ["Setup", "Running", "Completed"].map(function (step) {
    return /*#__PURE__*/React.createElement(Step, {
      key: step
    }, /*#__PURE__*/React.createElement(StepLabel, null, step));
  })), error && /*#__PURE__*/React.createElement(Box, {
    color: colors.red[600]
  }, error), activeStep === "setup" ? /*#__PURE__*/React.createElement(LabelHelpSetup, {
    onChangeActiveStep: setActiveStep,
    onError: setError
  }) : activeStep === "running" ? /*#__PURE__*/React.createElement(LabelHelpRunning, {
    onChangeActiveStep: setActiveStep,
    onError: setError
  }) : activeStep === "completed" ? /*#__PURE__*/React.createElement(LabelHelpCompleted, {
    onError: setError
  }) : null);
});