import React, { memo, useCallback, useEffect, useState } from 'react';
import { useSelector, useDispatch } from 'react-redux';
import VideoRecord from "../components/VideoRecord";
import ProgressBarUpload from "../components/ProgressBarUpload";
import RecordConsultForm from "./RecordConsultForm";
import EvaluationAssessment from "./EvaluationAssessment";
import InstructionalVideo from "./InstructionalVideo";
import ResultRecordScreen from "./ResultRecordScreen";
import EmptyData from "../components/EmptyData";
import { savePhysioterapistVideo, savePatientVideo, nextSequence, nextExercise, shouldHideMenu } from "../store/rehab/main";

var Main = function Main(props) {
  var _useState = useState(false),
      isUploading = _useState[0],
      setUploading = _useState[1];

  var dispatch = useDispatch();

  var _useSelector = useSelector(function (state) {
    return state.rehab.main;
  }),
      sequence = _useSelector.sequence,
      recordConsult = _useSelector.recordConsult,
      completed = _useSelector.completed,
      user = _useSelector.user,
      physioterapist = _useSelector.physioterapist,
      isPhysioterapist = _useSelector.isPhysioterapist,
      exercises = _useSelector.exercises,
      currentExercise = _useSelector.currentExercise,
      identifier = _useSelector.identifier,
      isInvertCam = _useSelector.isInvertCam,
      aspectArea = _useSelector.aspectArea;

  var submitPhysioterapistVideo = function submitPhysioterapistVideo(videoBlob) {
    setUploading(true);
    var form = new FormData();
    form.append('video', videoBlob);
    form.append('user', user);
    form.append('physioterapist', physioterapist);
    form.append('title', recordConsult.title);
    form.append('description', recordConsult.description);
    form.append('repetitions', recordConsult.repetitions);
    form.append('setsPerSessions', recordConsult.setsPerSessions);
    form.append('setsPerDay', recordConsult.setsPerDay);
    form.append('frequencyPerWeek', recordConsult.frequencyPerWeek);
    form.append('startDate', recordConsult.startDate);
    form.append('finalDate', recordConsult.finalDate);
    dispatch(savePhysioterapistVideo(form));
  };

  var submitVideoPatient = function submitVideoPatient(videoBlob) {
    setUploading(true);
    var form = new FormData();
    form.append('video', videoBlob);
    form.append('exercise', currentExercise._id);
    form.append('user', user);
    form.append('identifier', identifier);
    dispatch(savePatientVideo(form));
  };

  var toggleHideMenu = function toggleHideMenu(value) {
    dispatch(shouldHideMenu(value));
  };

  useEffect(function () {
    if (completed && (sequence === null || sequence === void 0 ? void 0 : sequence.next)) setTimeout(function () {
      dispatch(nextSequence(sequence.next));
      setUploading(false);
    }, 1000);
  }, [completed]);
  useEffect(function () {
    if (!isPhysioterapist && !currentExercise) {
      dispatch(nextExercise());
      setUploading(false);
    }
  }, [currentExercise]);
  var physioterapistRender = useCallback(function () {
    return /*#__PURE__*/React.createElement(React.Fragment, null, isUploading && /*#__PURE__*/React.createElement(ProgressBarUpload, null), (sequence === null || sequence === void 0 ? void 0 : sequence.value) === 'recordConsult' && /*#__PURE__*/React.createElement(RecordConsultForm, null), (sequence === null || sequence === void 0 ? void 0 : sequence.value) === 'recordVideo' && /*#__PURE__*/React.createElement(VideoRecord, {
      isInvertCam: isInvertCam,
      onFinish: submitPhysioterapistVideo,
      aspectArea: aspectArea
    }), (sequence === null || sequence === void 0 ? void 0 : sequence.value) === 'resultRecordScreen' && /*#__PURE__*/React.createElement(ResultRecordScreen, null));
  });
  var patientRender = useCallback(function () {
    return exercises.length === 0 ? /*#__PURE__*/React.createElement(EmptyData, null) : /*#__PURE__*/React.createElement(React.Fragment, null, isUploading && /*#__PURE__*/React.createElement(ProgressBarUpload, null), (sequence === null || sequence === void 0 ? void 0 : sequence.value) === 'recordVideo' && exercises.length > 0 && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(VideoRecord, {
      onFinish: submitVideoPatient,
      onRecording: toggleHideMenu,
      isInvertCam: isInvertCam,
      aspectArea: aspectArea
    }), /*#__PURE__*/React.createElement(InstructionalVideo, null)), (sequence === null || sequence === void 0 ? void 0 : sequence.value) === 'evaluationAssessment' && /*#__PURE__*/React.createElement(EvaluationAssessment, null));
  });
  return isPhysioterapist ? physioterapistRender() : patientRender();
};

export default memo(Main);