как обрабатывать множественное состояние setstate в реакции (бюджетное приложение)

это изображение

У меня есть учебный пример для создания бюджетного приложения в реакции. есть форма, которая содержит 3 для ввода, а именно выберите тип (расход, доход), сумму и название. *nb pengeluaran=расход, pemasukan=доход, jumlah=сумма.

У меня есть два компонента: InputData для входных данных, TotalMoney для отображения общей суммы денег, расходов и доходов.

форма для добавления данных

<form onSubmit={this.countMoney}>
            <div className="form-group col-md-4">
              <label>Tipe</label>
              <select className="form-control" onChange={this.onChangeTipe}>
                <option>Pilih</option>
                <option value="pengeluaran">Pengeluaran</option>
                <option value="pemasukan">Pemasukan</option>
              </select>
            </div>

.......input value for amount and title

обработчик при отправке входных данных

countMoney = event => {
    event.preventDefault();
    let items = {
      // id: this.state.itemLists.length + 1,
      tipe: this.state.tipe,
      jumlah: this.state.jumlah,
      judul: this.state.judul
    };

    this.setState(
      {
        jumlah: 0,
        judul: "",
        items: items,
        itemLists: [...this.state.itemLists, items]
      },
      () => {
        if (this.state.tipe === "pengeluaran") {
          this.setState({
            pengeluaran: this.state.pengeluaran + items.jumlah,
            totalUang: this.state.totalUang - items.jumlah
          });
        } else if (this.state.tipe === "pemasukan") {
          this.setState({
            pemasukan: this.state.pemasukan + items.jumlah,
            totalUang: this.state.totalUang + items.jumlah
          });
        }
      }
    );

каждый введенный элемент будет сделан объектом и введен в состояние itemLists

это компоненты для отображения данных

function TotalMoney(props) {
  return (
    <div className="totalMoney">
      <div className="description">
        Total Pemasukan
        <div className="rupiah">{props.pemasukan}</div>
      </div>
      <div className="description">
        Total Pengeluaran
        <div className="rupiah">{props.pengeluaran}</div>
      </div>
      <div className="description">
        Total Uang
        <div className="rupiah">{props.totalUang}</div>
      </div>
    </div>
  );
}

у меня возникла проблема при вводе данных следующим образом:

1. Пемасукан (доход) = 20000
2. Пенгелуаран(расход) = 10000
3. Пемасукан (доход) = 20000
4. Пенгелуаран(расход) = 5000

вывод должен быть

1. Всего Пемасукан (доход) = 40000
2. Итого Пенгелуаран(расход) = 15000
3. Всего Уанг (Деньги) = 25000

но выход есть

1. Общий пемасукан (доход) = 02000020000
2. Всего Pengeluaran(расход) = 0100005000
3. Всего Уанг (деньги) = 1000015000

для большей полноты это мой код https://github.com/saldhyyoga/test/blob/master/src/components/InputData.js