Bank connections
+
+
+ Connect your CSAS (George) account.
+ +
+
+ Generate data from a mock bank.
+ +Filters
+
+ setStartDate(e.target.value)} />
+ setEndDate(e.target.value)} />
+ setMinAmount(e.target.value)} />
+ setMaxAmount(e.target.value)} />
+
+ setSearchText(e.target.value)} />
+
+ Balance over time
+ {loading ? ( +Loading…
+ ) : error ? (
+ {error}
+ ) : (
+ Loading…
+ ) : error ? (
+ {error}
+ ) : (
+ // Pass the filtered transactions to see the breakdown for the current view
+ Transactions
+ {loading ? ( +Loading…
+ ) : error ? (
+ {error}
+ ) : filtered.length === 0 ? (
+ No transactions
+ ) : (
+ <>
+
+
+
+ Showing {visible.length} of {filtered.length} (page {Math.min(page + 1, Math.max(1, totalPages))}/{Math.max(1, totalPages)})
+
+
+ {selectedTxIds.length > 0 && (
+ <>
+ Selected: {selectedTxIds.length}
+
+
+
+
+ )}
+
+
+
+ | + 0 && visible.every(v => selectedTxIds.includes(v.id))} + onChange={(e) => { + if (e.currentTarget.checked) { + selectAllVisible(visible.map(v => v.id)); + } else { + // remove only currently visible from selection + setSelectedTxIds(prev => prev.filter(id => !visible.some(v => v.id === id))); + } + }} + /> + | +Date | +Amount | +Description | +Categories | +Actions | +
|---|---|---|---|---|---|
| + toggleSelectTx(t.id)} + /> + | + {/* Date cell */} ++ {editingTxId === t.id ? ( + setEditingDate(e.target.value)} + /> + ) : ( + t.date || '' + )} + | + + {/* Amount cell */} ++ {editingTxId === t.id ? ( + setEditingAmount(e.target.value)} + style={{ textAlign: 'right' }} + /> + ) : ( + formatAmount(t.amount) + )} + | + + {/* Description cell */} ++ {editingTxId === t.id ? ( + setEditingDescription(e.target.value)} + /> + ) : ( + t.description || '' + )} + | + + {/* Categories cell */} +
+ {editingTxId === t.id ? (
+
+
+
+ ) : (
+ {t.category_ids.map(id => categoryNameById(id)).join(', ') || '—'}
+ )}
+ |
+
+ {/* Actions cell */}
+
+ {editingTxId === t.id ? (
+
+
+
+
+
+ ) : (
+
+
+
+
+ )}
+ |
+