moving functionality to listTransactions fn
This commit is contained in:
parent
f83884b591
commit
f8efd6d9a2
@ -1017,7 +1017,7 @@ h3 {
|
|||||||
#queried_address_transactions {
|
#queried_address_transactions {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
padding-bottom: 1.5rem;
|
padding-bottom: 4rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
#pagination_wrapper {
|
#pagination_wrapper {
|
||||||
|
|||||||
2
css/main.min.css
vendored
2
css/main.min.css
vendored
File diff suppressed because one or more lines are too long
@ -952,7 +952,7 @@ h3 {
|
|||||||
#queried_address_transactions {
|
#queried_address_transactions {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
padding-bottom: 1.5rem;
|
padding-bottom: 4rem;
|
||||||
}
|
}
|
||||||
#pagination_wrapper {
|
#pagination_wrapper {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
|||||||
35
index.html
35
index.html
@ -208,7 +208,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<section class="grid gap-1">
|
<section class="grid gap-1">
|
||||||
<div class="flex align-center space-between sticky top-0"
|
<div class="flex align-center space-between sticky top-0"
|
||||||
style="background-color: rgba(var(--foreground-color), 1);">
|
style="background-color: rgba(var(--foreground-color), 1);transition: background-color .3s;">
|
||||||
<h4>Transactions</h4>
|
<h4>Transactions</h4>
|
||||||
<sm-chips id="filter_selector" class="hidden">
|
<sm-chips id="filter_selector" class="hidden">
|
||||||
<sm-chip value="sent" selected>Sent</sm-chip>
|
<sm-chip value="sent" selected>Sent</sm-chip>
|
||||||
@ -1224,12 +1224,6 @@
|
|||||||
try {
|
try {
|
||||||
if (floGlobals.query.string !== query) {
|
if (floGlobals.query.string !== query) {
|
||||||
checkBalance(query)
|
checkBalance(query)
|
||||||
renderElem(getRef('queried_address_transactions'), html`
|
|
||||||
<div class="grid gap-1 justify-items-center text-center" style="margin: 3rem 0">
|
|
||||||
<sm-spinner></sm-spinner>
|
|
||||||
<span>Loading transactions...</span>
|
|
||||||
</div>
|
|
||||||
`)
|
|
||||||
fetchTransactions(query).then(() => {
|
fetchTransactions(query).then(() => {
|
||||||
filterFetchedTransactions()
|
filterFetchedTransactions()
|
||||||
render.paginatedTransactions(parseInt(page))
|
render.paginatedTransactions(parseInt(page))
|
||||||
@ -1916,8 +1910,8 @@
|
|||||||
paginatedTransactions(page = 1) {
|
paginatedTransactions(page = 1) {
|
||||||
const startingIndex = ((page - 1) * 20)
|
const startingIndex = ((page - 1) * 20)
|
||||||
const endingIndex = startingIndex + 20
|
const endingIndex = startingIndex + 20
|
||||||
const { transactions, string: address } = floGlobals.query
|
const { transactions, string: address, filteredTransactions } = floGlobals.query
|
||||||
const renderedTransactions = transactions
|
const renderedTransactions = (filteredTransactions || transactions)
|
||||||
.slice(startingIndex, endingIndex)
|
.slice(startingIndex, endingIndex)
|
||||||
.map(transaction => render.transactionCard(transaction))
|
.map(transaction => render.transactionCard(transaction))
|
||||||
renderElem(getRef('queried_address_transactions'), html`${renderedTransactions}`)
|
renderElem(getRef('queried_address_transactions'), html`${renderedTransactions}`)
|
||||||
@ -1930,7 +1924,7 @@
|
|||||||
} else {
|
} else {
|
||||||
getRef('filter_selector').classList.add('hidden')
|
getRef('filter_selector').classList.add('hidden')
|
||||||
}
|
}
|
||||||
const paginationSegments = transactions ? Math.ceil(transactions.length / renderTransactions) : 0;
|
const paginationSegments = (filteredTransactions || transactions) ? Math.ceil((filteredTransactions || transactions).length / renderTransactions) : 0;
|
||||||
let pagination = []
|
let pagination = []
|
||||||
let startingPage = page - 2;
|
let startingPage = page - 2;
|
||||||
let showTill = page + 2;
|
let showTill = page + 2;
|
||||||
@ -2144,8 +2138,7 @@
|
|||||||
closePopup()
|
closePopup()
|
||||||
})
|
})
|
||||||
|
|
||||||
getRef('filter_selector').addEventListener('change', async e => {
|
getRef('filter_selector').addEventListener('change', e => {
|
||||||
floGlobals.query.transactions = (await floWebWallet.readTransactions(floGlobals.query.string)).reverse();
|
|
||||||
filterFetchedTransactions()
|
filterFetchedTransactions()
|
||||||
render.paginatedTransactions()
|
render.paginatedTransactions()
|
||||||
})
|
})
|
||||||
@ -2555,18 +2548,26 @@
|
|||||||
}
|
}
|
||||||
async function fetchTransactions(address) {
|
async function fetchTransactions(address) {
|
||||||
try {
|
try {
|
||||||
floGlobals.query.transactions = [];
|
renderElem(getRef('pagination_wrapper'), html``)
|
||||||
await floWebWallet.syncTransactions(address);
|
renderElem(getRef('queried_address_transactions'), html`
|
||||||
floGlobals.query.transactions = (await floWebWallet.readTransactions(address)).reverse();
|
<div class="grid gap-1 justify-items-center text-center" style="margin: 3rem 0">
|
||||||
|
<sm-spinner></sm-spinner>
|
||||||
|
<span>Loading transactions...</span>
|
||||||
|
</div>
|
||||||
|
`)
|
||||||
|
const { items, lastItem, initItem } = await floWebWallet.listTransactions(address);
|
||||||
|
floGlobals.query.transactions = items;
|
||||||
floGlobals.query.string = address;
|
floGlobals.query.string = address;
|
||||||
|
floGlobals.query.filteredTransactions = null
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error(err);
|
renderElem(getRef('queried_address_transactions'), html` <span>Failed to load transactions</span> `)
|
||||||
|
throw err;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
function filterFetchedTransactions() {
|
function filterFetchedTransactions() {
|
||||||
const filter = getRef('filter_selector').value;
|
const filter = getRef('filter_selector').value;
|
||||||
if (filter !== 'all') {
|
if (filter !== 'all') {
|
||||||
floGlobals.query.transactions = floGlobals.query.transactions.filter(t => filter === 'sent' ? t.sender === floGlobals.query.string : t.receiver === floGlobals.query.string)
|
floGlobals.query.filteredTransactions = floGlobals.query.transactions.filter(t => filter === 'sent' ? t.sender === floGlobals.query.string : t.receiver === floGlobals.query.string)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
async function processQuery() {
|
async function processQuery() {
|
||||||
|
|||||||
@ -843,7 +843,7 @@
|
|||||||
query_params.to = options.to;
|
query_params.to = options.to;
|
||||||
}
|
}
|
||||||
if (!isUndefined(options.latest))
|
if (!isUndefined(options.latest))
|
||||||
query_params.latest = latest;
|
query_params.latest = options.latest;
|
||||||
if (!isUndefined(options.mempool))
|
if (!isUndefined(options.mempool))
|
||||||
query_params.mempool = options.mempool;
|
query_params.mempool = options.mempool;
|
||||||
promisedAPI(api, query_params)
|
promisedAPI(api, query_params)
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user