text: import React, {useState} from 'react';
  import {Link, useHistory} from 'react-router-dom';
  import swal from 'sweetalert';
  import {FiArrowLeft} from 'react-icons/fi';
  
  import api from '../../services/api';
  
  import './styles.css';
  
  import logo from '../../assets/logo.svg';
  
  export default function NewIncidents() {
    const [title, setTitle] = useState('');
    const [description, setDescription] = useState('');
    const [value, setValue] = useState('');
  
    const ongId = localStorage.getItem('ongId');
  
    const history = useHistory();
  
    async function handleNewIncident(e) {
      e.preventDefault();
  
      const data = {
        title,
        description,
        value,
      };
  
      try {
        await api.post('incidents', data, {
          headers: {Authorization: ongId}
        })
  
        history.push('/profile');
      } catch (err) {
        swal("Erro ao cadastrar caso", "Tente novamente!", "error");
      }
    }
  
    return (
      <div className="new-incident-container">
        <div className="content">
          <section>
            <img src={logo} alt="Be The Hero"/>
  
            <h1>Cadastrar novo caso</h1>
            <p>Descreva o caso detalhadamente para encontrar um herói para resolver isso.</p>
  
            <Link to="/profile" className="back-link">
              <FiArrowLeft size={16} color="#E02041"/>
              Voltar para home
            </Link>
          </section>  
  
          <form onSubmit={handleNewIncident}>
            <input placeholder="Título do caso" value={title} onChange={e => setTitle(e.target.value)}/>
            <textarea placeholder="Descrição" value={description} onChange={e => setDescription(e.target.value)}/>
            <input placeholder="Valor em reais" value={value} onChange={e => setValue(e.target.value)}/>
  
            <button className="button" type="submit">Cadastrar</button>
          </form>
        </div>    
      </div>  
    );
  };
  
  