Untitled

import { useEffect, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { DispatchThunk } from '../types/type';
import { apiResult } from '../redux/actions';

function WalletForm() {
  const dispatch: DispatchThunk = useDispatch();
  const { currencies } = useSelector((state: any) => state.wallet);
  const [inputInfo, setInputInfo] = useState({
    value: '',
    description: '',
    currency: 'USD',
    method: 'Dinheiro',
    tag: 'Alimentação',
  });
  const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
    event.preventDefault();

    setInputInfo({
      value: '',
      description: '',
      currency: 'USD',
      method: 'Dinheiro',
      tag: 'Alimentação',
    });
  };
  useEffect(() => {
    dispatch(apiResult());
  });
  return (
    <div>
      <form onSubmit={ handleSubmit }>
        <label htmlFor="value">
          Valor:
          <input
            type="number"
            id="value"
            data-testid="value-input"
            onChange={
              (e) => setInputInfo({ ...inputInfo, value: e.target.value })
            }
          />
        </label>
        <label htmlFor="description">
          Descrição:
          <input
            type="text"
            id="description"
            data-testid="description-input"
            onChange={
              (e) => setInputInfo({ ...inputInfo, description: e.target.value })
            }
          />
        </label>
        <label htmlFor="currency">
          Moeda:
          <select
            id="currency"
            data-testid="currency-input"
            onChange={
              (e) => setInputInfo({ ...inputInfo, currency: e.target.value })
            }
          >
            <option value="USD">USD</option>
            <option value="BRL">BRL</option>
            <option value="EUR">EUR</option>
          </select>
        </label>
        <label htmlFor="method">
          Método de pagamento:
          <select
            id="method"
            data-testid="method-input"
            onChange={
              (e) => setInputInfo({ ...inputInfo, method: e.target.value })
            }
          >
            <option value="Dinheiro">Dinheiro</option>
            <option value="Cartão de crédito">Cartão de crédito</option>
            <option value="Cartão de débito">Cartão de débito</option>
          </select>
        </label>
        <label htmlFor="tag">
          Tag:
          <select
            id="tag"
            data-testid="tag-input"
          >
            <option value="Alimentação">Alimentação</option>
            <option value="Lazer">Lazer</option>
            <option value="Trabalho">Trabalho</option>
            <option value="Transporte">Transporte</option>
            <option value="Saúde">Saúde</option>
          </select>
        </label>
        <button>
          Adicionar despesa
        </button>
      </form>
    </div>
  );
}

export default WalletForm;