Proyectos de Subversion LeadersLinked - SPA

import React from 'react';

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

import { useSelector } from 'react-redux';

import { Box, Button } from '@mui/material';

import Input from '@components/UI/inputs/Input';

import Form from '@components/common/form';

export default function CommentForm({ onSubmit = () => {} }) {

  const labels = useSelector(({ intl }) => intl.labels);

  const {

    control,

    handleSubmit,

    reset,

    formState: { errors }

  } = useForm({

    defaultValues: {

      comment: ''

    }

  });

  const submitHandler = handleSubmit(({ comment }) => {

    onSubmit(comment);

    reset();

  });

  return (

    <Form onSubmit={submitHandler}>

      <Box

        sx={{

          display: 'flex',

          gap: ({ spacing }) => spacing(0.5),

          alignItems: 'center'

        }}

      >

        <Input

          name='comment'

          placeholder={labels.write_a_comment}

          control={control}

          error={errors.comment?.message}

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

          variant='search'

          autoComplete='off'

        />

        <Button color='primary' type='submit'>

          Publicar

        </Button>

      </Box>

    </Form>

  );

}