Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 16259 | Rev 16264 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |

import React, { useState, useEffect } from "react";
import { axios } from "../../../../utils";
import { useDispatch } from "react-redux";
import { useForm } from "react-hook-form";
import { Modal } from "@mui/material";
import Datetime from "react-datetime";

import FormErrorFeedback from "../../../../shared/form-error-feedback/FormErrorFeedback";

const ConferenceModal = ({
  show = false,
  timezones = {},
  zoomUrl = "",
  onCreate = () => null,
}) => {
  const dt = new Date();

  const { handleSubmit, register, errors, reset } = useForm({ mode: "all" });
  const [date, setDate] = useState({
    year: dt.toLocaleString("default", { year: "numeric" }),
    month: dt.toLocaleString("default", { month: "2-digit" }),
    day: dt.toLocaleString("default", { day: "2-digit" }),
  });
  const [time, setTime] = useState(
    dt.toLocaleString("es", {
      hour: "numeric",
      minute: "2-digit",
      second: "2-digit",
    })
  );
  const [coferenceType, setConferenceType] = useState(1);
  const [isShow, setIsShow] = useState(show);
  const dispatch = useDispatch();

  const closeModal = () => {
    setIsShow(false);
  };

  const handleChange = (value) => {
    setConferenceType(value);
  };

  const handleDateTime = (value) => {
    setDate({
      ...date,
      year: new Intl.DateTimeFormat("es", { year: "numeric" }).format(value),
      month: new Intl.DateTimeFormat("es", { month: "2-digit" }).format(value),
      day: new Intl.DateTimeFormat("es", { day: "2-digit" }).format(value),
    });
    setTime(
      new Intl.DateTimeFormat("es", {
        hour: "numeric",
        minute: "2-digit",
        second: "numeric",
      }).format(value)
    );
  };

  const onSubmit = async (data) => {
    try {
      const formData = new FormData();

      Object.entries(data).forEach(([key, value]) =>
        formData.append(key, value)
      );
      formData.append("date", `${date.year}-${date.month}-${date.day}`);
      formData.append("time", time);

      const { data: response } = await axios.post(zoomUrl, formData);

      if (!response.success && typeof response.data === "string") {
        dispatch(addNotification({ msg: response.data, style: "danger" }));
        return;
      }

      if (!response.success && typeof response.data === "object") {
        Object.entries(response.data).forEach(([key, value]) => {
          dispatch(
            addNotification({ msg: `${key}: ${value[0]}`, style: "danger" })
          );
        });
        return;
      }

      dispatch(addNotification({ msg: response.data, style: "success" }));
      onCreate();
      reset();
    } catch (error) {
      console.log(`Error: ${error.message}`);
      return dispatch(
        addNotification({ msg: "Ha ocurrido un error", style: "danger" })
      );
    }
  };

  useEffect(() => {
    setIsShow(show);
  }, [show]);

  return (
    <Modal show={isShow} onHide={closeModal}>
      <Modal.Header closeButton>
        <Modal.Title>Crear Conferencia</Modal.Title>
      </Modal.Header>
      <Modal.Body></Modal.Body>
    </Modal>
  );
};

export default ConferenceModal;