Quiero mostrar la cantidad actual disponible en la billetera después de una transacción, en la lista de transacciones para esa transacción en particular.

Aquí está mi código

 let Transactions = [{title:'txn1',amount:100,type:'credit',date:'01-01-2021'},{title:'txn1',amount:150,type:'credit',date:'01-02-2021'},{title:'txn1',amount:60,type:'debit',date:'01-03-2021'},{title:'txn1',amount:50,type:'debit',date:'01-04-2021'}]; let totalCredit = Transactions.reduce((amount,txn)=>{ return (txn.type === 'credit' && (parseFloat(amount) + parseFloat(txn.amount)) || amount) },0); let totalDebit = Transactions.reduce((amount,txn)=>{ return (txn.type === 'debit' && (parseFloat(amount) + parseFloat(txn.amount)) || amount) },0); let currentBalance = totalCredit - totalDebit; let txncards=[]; let txn_cb = 0; Transactions = Transactions.sort((a,b)=>{ a.date = new Date(a.date), b.date = new Date(b.date) if(a.date<b.date) return 1; if(a.date>b.date) return -1; return 0; }) Transactions.forEach((txn)=>{ txn_cb = txn_cb + txn.amount; txn.cb = txn_cb; txncards.push(makecard(txn)); }) $('.card-body').html(txncards); const makecard = (txn) =>{ //this returns HTML ul li list jQuery Object filled with details provided by txn object }

Resultado

Como puede ver, el orden de la lista no es el esperado al ordenar por fecha en orden descendente; Y el saldo disponible no es correcto en li. Txn 1 debe estar en la parte inferior y el saldo disponible debe ser 100 Txn 2 debe estar en el medio y el saldo disponible debe ser 200 Txn 3 debe estar en la parte superior y el saldo disponible debe ser 150

Entonces, ¿dónde estoy haciendo mal? por favor ignore los errores tipográficos menores