계정 / ID / 카테고리별로 그룹화하여 값을 합산하는 방법은 무엇입니까?

import React from "react";
import PropTypes from "prop-types";

const AppContext = React.createContext();

const initialState = {
  balance: 0,
  transactions: []
};

const reducer = (state, action) => {
  switch (action.type) {
    case "ADD_TRANSACTION":
      return {
        ...state,
        balance: state.balance + action.payload.amount,
        transactions: [
          {
            account: action.payload.account,
            amount: action.payload.amount,
            balance: state.balance + action.payload.amount
          },
          ...state.transactions
        ]
      };
    default:
      return state;
  }
};

const AppContextProvider = ({ children }) => {
  const [state, dispatch] = React.useReducer(reducer, initialState);

  return (
    <AppContext.Provider value={{ state, dispatch }}>
      {children}
    </AppContext.Provider>
  );
};

AppContextProvider.propTypes = {
  children: PropTypes.node.isRequired
};

export { AppContext, AppContextProvider };

import React from "react";

import { AppContext } from "../../providers";

const List = () => {
  const { state } = React.useContext(AppContext);

  return (
    <div>
      {state.transactions.map((transaction) => (
        <div key={Math.random()} style={{ marginBottom: "10px" }}>
          <div>
            <span>
              <strong>
                {transaction.amount > 0 ? "Transferred" : "Withdrew"} $
                {Math.abs(transaction.amount)}{" "}
              </strong>{" "}
              {transaction.amount > 0 ? "to " : "from "}
              <strong>{transaction.account}</strong>.
            </span>
          </div>
          <div>
            <span>
              Current <strong>{transaction.account}</strong>'s balance is{" "}
              <strong>${Math.abs(transaction.balance)}</strong>.
            </span>
          </div>
        </div>
      ))}
    </div>
  );
};

export default List;