Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3530 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3530 Rev 3719
Línea 1... Línea 1...
1 
import React from 'react';
 1 
import React from 'react';
2 
import { useForm } from 'react-hook-form';
 2 
import { useForm } from 'react-hook-form';
3 
import { useSelector } from 'react-redux';
 3 
import { useSelector } from 'react-redux';
4 
import { Box, Button } from '@mui/material';
 4 
import { Box, Button } from '@mui/material';
5 
 
 5 
 
6 
import Input from '@components/UI/inputs/Input';
 6 
import Input from '@components/UI/inputs/Input';
7 
import Form from '@components/common/form';
 7 
import Form from '@components/common/form';
8 
 
 8 
 
9 
export default function CommentForm({ onSubmit = () => {} }) {
 9 
export default function CommentForm({ onSubmit = () => {} }) {
10 
  const labels = useSelector(({ intl }) => intl.labels);
 10 
  const labels = useSelector(({ intl }) => intl.labels);
11 
 
 11 
 
12 
  const {
 12 
  const {
13 
    control,
 13 
    control,
14 
    handleSubmit,
 14 
    handleSubmit,
15 
    reset,
 15 
    reset,
16 
    formState: { errors }
 16 
    formState: { errors }
17 
  } = useForm({
 17 
  } = useForm({
18 
    defaultValues: {
 18 
    defaultValues: {
19 
      comment: ''
 19 
      comment: ''
20 
    }
 20 
    }
21 
  });
 21 
  });
22 
 
 22 
 
23 
  const submitHandler = handleSubmit(({ comment }) => {
 23 
  const submitHandler = handleSubmit(({ comment }) => {
24 
    onSubmit(comment);
 24 
    onSubmit(comment);
25 
    reset();
 25 
    reset();
26 
  });
 26 
  });
27 
 
 27 
 
28 
  return (
 28 
  return (
29 
    <Form onSubmit={submitHandler}>
 29 
    <Form onSubmit={submitHandler}>
30 
      <Box
 30 
      <Box
31 
        sx={{
 31 
        sx={{
32 
          display: 'flex',
 32 
          display: 'flex',
33 
          gap: ({ spacing }) => spacing(0.5),
 33 
          gap: ({ spacing }) => spacing(0.5),
34 
          alignItems: 'center'
 34 
          alignItems: 'center'
35 
        }}
 35 
        }}
36 
      >
 36 
      >
37 
        <Input
 37 
        <Input
38 
          name='comment'
 38 
          name='comment'
39 
          placeholder={labels.write_a_comment}
 39 
          placeholder={labels.write_a_comment}
40 
          control={control}
 40 
          control={control}
41 
          error={errors.comment?.message}
 41 
          error={errors.comment?.message}
42 
          rules={{ required: 'Este campo es requerido' }}
 42 
          rules={{ required: 'Este campo es requerido' }}
43 
          variant='search'
 43 
          variant='search'
44 
          autoComplete='off'
 44 
          autoComplete='off'
45 
        />
 45 
        />
46 
        <Button color='primary' type='submit'>
 46 
        <Button color='primary' type='submit'>
47 
          Publicar
 47 
          Publicar
48 
        </Button>
 48 
        </Button>
49 
      </Box>
 49 
      </Box>
50 
    </Form>
 50 
    </Form>
51 
  );
 51 
  );
52 
}
 52 
}