function _extends() { _extends = Object.assign || 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, useEffect } from 'react';
import "./style.css";
import RangeSlider from "../../components/SliderRange";
import Button from "../../components/Button";
import Select from 'react-select';
import { useDispatch, useSelector } from 'react-redux';
import { savePatientEvaluation } from "../../store/rehab/main";
var colors = {
  primary25: '#f0e8ff',
  primary50: '#f0e8ff',
  primary: '#673ab7',
  neutral50: '#7b7b7b',
  neutral60: '#7b7b7b',
  neutral70: '#7b7b7b',
  neutral80: '#7b7b7b',
  neutral90: '#7b7b7b'
};
var errorMessage = 'fill the required fields';
var assessmentEvaluation = {
  painLevel: 0,
  mobility: 0,
  exerciseEffort: null
};

var EvaluationAssessment = function EvaluationAssessment(props) {
  var dispatch = useDispatch();

  var _useState = useState(assessmentEvaluation),
      fields = _useState[0],
      setFields = _useState[1];

  var _useState2 = useState(false),
      error = _useState2[0],
      setError = _useState2[1];

  var _useSelector = useSelector(function (state) {
    return state.rehab.main;
  }),
      identifier = _useSelector.identifier,
      user = _useSelector.user,
      exercisesEffort = _useSelector.exercisesEffort;

  var onSubmit = function onSubmit(e) {
    e.preventDefault();

    if (fields.exerciseEffort === null) {
      return setError(true);
    }

    dispatch(savePatientEvaluation(_extends({}, fields, {
      identifier: identifier,
      user: user
    })));
  }; // const [execEffort, setExecEffort] = useState(false);


  var onChangeRange = function onChangeRange(e, select) {
    var _e$target, _e$target2, _extends2;

    var name = (e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.name) || (select === null || select === void 0 ? void 0 : select.name);
    var value = (e === null || e === void 0 ? void 0 : (_e$target2 = e.target) === null || _e$target2 === void 0 ? void 0 : _e$target2.value) || (e === null || e === void 0 ? void 0 : e.value);
    setFields(_extends({}, fields, (_extends2 = {}, _extends2[name] = value, _extends2)));

    if (fields.exerciseEffort != null || fields.exerciseEffort != '') {
      return setError(false);
    }
  };

  return /*#__PURE__*/React.createElement("div", {
    className: "evaluation-assessment"
  }, /*#__PURE__*/React.createElement("div", {
    className: "container"
  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h1", {
    className: "evaluation-assessment-title"
  }, "Rehab Evaluation"), /*#__PURE__*/React.createElement("div", {
    className: "evaluation-assessment-content"
  }, /*#__PURE__*/React.createElement("form", {
    className: "form",
    onSubmit: onSubmit
  }, /*#__PURE__*/React.createElement("h1", {
    className: "evaluation-assessment-subtitle"
  }, "What is your current level of pain?"), /*#__PURE__*/React.createElement(RangeSlider, {
    min: -5,
    max: 5,
    step: 1,
    level1: "Better",
    level2: "No Change",
    level3: "Worse",
    className: "range-slider",
    onChange: onChangeRange,
    name: "painLevel"
  }), /*#__PURE__*/React.createElement("h1", {
    className: "evaluation-assessment-subtitle"
  }, "How is your progress?"), /*#__PURE__*/React.createElement(RangeSlider, {
    min: -5,
    max: 5,
    step: 1,
    level1: "Better",
    level2: "No Change",
    level3: "Worse",
    className: "range-slider",
    onChange: onChangeRange,
    name: "mobility"
  }), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h1", {
    className: "evaluation-assessment-subtitle"
  }, "What is the effort to complete your rehab exercises?"), /*#__PURE__*/React.createElement(Select, {
    name: "exerciseEffort",
    options: exercisesEffort === null || exercisesEffort === void 0 ? void 0 : exercisesEffort.map(function (exer) {
      return {
        label: exer.name,
        value: exer._id
      };
    }),
    theme: function theme(_theme) {
      return _extends({}, _theme, {
        colors: _extends({}, _theme.colors, colors)
      });
    },
    className: error ? 'custom-select-opt invalid' : 'custom-select-opt',
    onChange: onChangeRange
  })), /*#__PURE__*/React.createElement(Button, {
    text: "Save"
  }), error && /*#__PURE__*/React.createElement("div", {
    className: "error-message"
  }, errorMessage))))));
};

export default EvaluationAssessment;