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 Library from "./Library";
import { savePhysioterapistVideo, savePatientVideo, nextSequence, nextExercise, shouldHideMenu, getVideoFromLibrary, addVideoToLibrary } 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,
      users = _useSelector.users,
      recordVideoToLibrary = _useSelector.recordVideoToLibrary,
      facingMode = _useSelector.facingMode;

  useEffect(function () {
    if (props.rehabAction !== 'record' && (sequence === null || sequence === void 0 ? void 0 : sequence.value) === 'recordConsult') {
      dispatch(nextSequence(sequence.next));
    }
  }, [sequence]);
  useEffect(function () {
    if (physioterapist) dispatch(getVideoFromLibrary(physioterapist + "?page=1"));
  }, [physioterapist]);

  var onFilterLibrary = function onFilterLibrary(filter, object, page) {
    if (page === void 0) {
      page = 1;
    }

    if (filter === 'default') return dispatch(getVideoFromLibrary(physioterapist + "?page=" + page + "&default=true"));
    if (filter === 'personal') return dispatch(getVideoFromLibrary(physioterapist + "?page=" + page + "&default=false"));
    return dispatch(getVideoFromLibrary(physioterapist + "?page=" + page));
  };

  var onSearchExerciseFromLibrary = function onSearchExerciseFromLibrary(title, page) {
    if (page === void 0) {
      page = 1;
    }

    dispatch(getVideoFromLibrary(physioterapist + "?page=" + page + "&title=" + title));
  };

  var submitPhysioterapistVideo = function submitPhysioterapistVideo(videoBlob) {
    setUploading(true);
    var form = new FormData();
    form.append('video', videoBlob);
    form.append('users', users);
    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('visible', recordConsult.visible);
    dispatch(savePhysioterapistVideo(form));
  };

  var submitLibraryVideo = function submitLibraryVideo(videoBlob) {
    setUploading(true);
    var form = new FormData();
    form.append('video', videoBlob);
    form.append('physioterapist', physioterapist);
    form.append('title', recordVideoToLibrary.title);
    form.append('description', recordVideoToLibrary.description);
    form.append('repetitions', recordVideoToLibrary.repetitions);
    form.append('setsPerSessions', recordVideoToLibrary.setsPerSessions);
    form.append('setsPerDay', recordVideoToLibrary.setsPerDay);
    form.append('frequencyPerWeek', recordVideoToLibrary.frequencyPerWeek);
    form.append('visible', recordVideoToLibrary.visible);
    dispatch(addVideoToLibrary(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)) if ((sequence === null || sequence === void 0 ? void 0 : sequence.value) === 'library') {
      dispatch(nextSequence(sequence.next.next));
    } else {
      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, (sequence === null || sequence === void 0 ? void 0 : sequence.value) === 'library' && /*#__PURE__*/React.createElement(Library, {
      onFilterLibrary: onFilterLibrary,
      onSearchExerciseFromLibrary: onSearchExerciseFromLibrary
    }), isUploading && /*#__PURE__*/React.createElement(ProgressBarUpload, null), (sequence === null || sequence === void 0 ? void 0 : sequence.value) === 'recordConsult' && props.rehabAction === 'record' && /*#__PURE__*/React.createElement(RecordConsultForm, null), (sequence === null || sequence === void 0 ? void 0 : sequence.value) === 'recordVideo' && props.rehabAction === 'record' && /*#__PURE__*/React.createElement(VideoRecord, {
      isInvertCam: isInvertCam,
      onFinish: submitPhysioterapistVideo,
      aspectArea: aspectArea,
      facingMode: facingMode
    }), (sequence === null || sequence === void 0 ? void 0 : sequence.value) === 'recordVideo' && props.rehabAction === 'library' && /*#__PURE__*/React.createElement(VideoRecord, {
      isInvertCam: isInvertCam,
      onFinish: submitLibraryVideo,
      aspectArea: aspectArea,
      facingMode: facingMode
    }), (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,
      facingMode: facingMode
    }), /*#__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);