#4 Total amount of income/expense

[nadine-grantz]

Value proposition

As a User I want to see the total amount of expenses or incomes depending which filter i clicked to have an overview of my financial situation

Description

Acceptance criteria

• [ ] On the homepage, there is a list of current income and expenses.
• [ ] There are two filter buttons: one for income and one for expenses.
• [ ] When the user clicks the income filter button, the total amount of income is displayed.
• [ ] When the user clicks the expense filter button, the total amount of expenses is displayed.
• [ ] The user can only apply one filter at a time.

Tasks

• [ ] Create a new component called TotalAmount in the components folder. This component will render the total amount of income or expenses depending on which filter button was clicked.
• [ ] Implement logic to calculate the total amount of income when the user clicks the income filter button.
• [ ] Implement logic to calculate the total amount of expenses when the user clicks the expense filter button.
• [ ] Implement logic to ensure that the user can only apply one filter at a time.
• [ ] Here’s an example of how to create a new component called TotalAmount in the components folder

function TotalAmount() {
  const [filter, setFilter] = useState('');

  function handleFilter(filter) {
    setFilter(filter);
  }

[StellaKakarali]

Cool Function! Looks good !

[ahohnsen]

If I understood correctly, the user can either view incomes or expenses, but not both at the same time. That is, when the user clicks on incomes, only the incomes and the total of these incomes are displayed. The same applies to expenses. In the wireframe, this is somewhat misleading because the list shows both incomes and expenses, as well as a total.

[ahohnsen]

The title is sooooooo long! 😃 How about: Total amount of income/expense