Proyectos de Subversion LeadersLinked - SPA

import React from "react";

import { useDispatch } from "react-redux";

import { useForm } from "react-hook-form";

import { axios } from "@app/utils";

import { addNotification } from "@app/redux/notification/notification.actions";

import Modal from "../UI/modal/Modal";

import Input from "../UI/inputs/Input";

const CreateGroupModal = ({ isOpen, onClose }) => {

  const {

    control,

    handleSubmit,

    formState: { errors },

  } = useForm();

  const dispatch = useDispatch();

  const onSubmitHandler = handleSubmit(async (group) => {

    const formData = new FormData();

    Object.entries(group).map(([key, value]) => formData.append(key, value));

    axios

      .post("/chat/create-group", group)

      .then((response) => {

        const { success } = response.data;

        if (!success) {

          dispatch(

            addNotification({

              style: "danger",

              message: "Ha ocurrido un error, por favor intente más tarde.",

            })

          );

          return;

        }

        onClose();

      })

      .catch((err) => {

        dispatch(addNotification({ style: "danger", message: err.message }));

      });

  });

  return (

    <Modal

      title="Crear grupo"

      show={isOpen}

      onClose={onClose}

      onReject={onClose}

      onAccept={onSubmitHandler}

    >

      <Input

        name="name"

        label="Nombre"

        placeholder="Nombre del grupo"

        control={control}

        rules={{ required: "Este campo es requerido" }}

        error={errors.name?.message}

      />

    </Modal>

  );

};

export default CreateGroupModal;