routing changes and code refactoring

This commit is contained in:
sairaj mote 2023-02-16 22:14:14 +05:30
parent c294b54444
commit ae972d0778

View File

@ -208,8 +208,8 @@
</svg> </svg>
</a> </a>
<h4 id="flo_id_name"></h4> <h4 id="flo_id_name"></h4>
<button class="icon-only" style="margin-left:auto" <button class="icon-only" style="margin-left:auto" onclick="render.transactions()"
onclick="render.transactions(pagesData.params.id)"> title="Refresh">
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" <svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24"
width="24px" fill="#000000"> width="24px" fill="#000000">
<path d="M0 0h24v24H0z" fill="none" /> <path d="M0 0h24v24H0z" fill="none" />
@ -984,21 +984,14 @@
let pageId let pageId
let params = {} let params = {}
let searchParams let searchParams
let wildcards
if (targetPage === '') { if (targetPage === '') {
pageId = 'home' pageId = 'home'
} else { } else {
if (targetPage.includes('/')) { if (targetPage.includes('/')) {
if (targetPage.includes('?')) { let path;
const splitAddress = targetPage.split('?') [path, searchParams] = targetPage.split('?');
searchParams = splitAddress.pop() [, pageId, ...wildcards] = path.split('/')
const pages = splitAddress.pop().split('/')
pageId = pages[1]
subPageId = pages[2]
} else {
const pages = targetPage.split('/')
pageId = pages[1]
subPageId = pages[2]
}
} else { } else {
pageId = targetPage pageId = targetPage
} }
@ -1009,14 +1002,20 @@
} }
if (pagesData.lastPage !== pageId) { if (pagesData.lastPage !== pageId) {
pagesData.lastPage = pageId pagesData.lastPage = pageId
pagesData.wildcards = wildcards
} }
if (params) if (params)
pagesData.params = params pagesData.params = params
switch (pageId) { switch (pageId) {
case 'transactions': case 'transactions':
render.transactions(params.id).then(() => { const floId = wildcards[0]
scrollToTopObserver.observe(getRef('transactions_hero_section')) if (floId && floCrypto.validateFloID(floId)) {
}) render.transactions(floId).then(() => {
scrollToTopObserver.observe(getRef('transactions_hero_section'))
})
} else {
}
break; break;
default: default:
getRef('transactions_list').innerHTML = '' getRef('transactions_list').innerHTML = ''
@ -1287,12 +1286,12 @@
clone.querySelector('.transaction__time').textContent = getFormattedTime(time * 1000) clone.querySelector('.transaction__time').textContent = getFormattedTime(time * 1000)
return clone return clone
}, },
async transactions(floID) { async transactions(queriedFloId = pagesData.wildcards[0]) {
try { try {
scrollToTopObserver.disconnect() scrollToTopObserver.disconnect()
// retrieve tokens and render them // retrieve tokens and render them
getRef('tokens').classList.add('hide') getRef('tokens').classList.add('hide')
fetch(`https://ranchimallflo.duckdns.org/api/v1.0/getFloAddressBalance?floAddress=${floID}`).then(res => res.json()).then(({ floAddressBalances }) => { fetch(`https://ranchimallflo.duckdns.org/api/v1.0/getFloAddressBalance?floAddress=${queriedFloId}`).then(res => res.json()).then(({ floAddressBalances }) => {
const frag = document.createDocumentFragment() const frag = document.createDocumentFragment()
getRef('token_list').innerHTML = '' getRef('token_list').innerHTML = ''
let hasTokens = false let hasTokens = false
@ -1312,23 +1311,23 @@
}) })
// retrieve FLO balance // retrieve FLO balance
getRef('flo_balance').innerHTML = `<sm-spinner></sm-spinner>`; getRef('flo_balance').innerHTML = `<sm-spinner></sm-spinner>`;
floWebWallet.getBalance(floID).then((retrievedBal) => { floWebWallet.getBalance(queriedFloId).then((retrievedBal) => {
getRef('flo_balance').textContent = `${parseFloat(retrievedBal.toFixed(3))} FLO`; getRef('flo_balance').textContent = `${parseFloat(retrievedBal.toFixed(3))} FLO`;
}).catch((error) => { }).catch((error) => {
notify(error, 'error'); notify(error, 'error');
}) })
floWebWallet.getLabels().then(allLabels => { floWebWallet.getLabels().then(allLabels => {
getRef('flo_id_name').textContent = allLabels.hasOwnProperty(floID) ? allLabels[floID] === 'Unknown' ? floID : allLabels[floID] : floID getRef('flo_id_name').textContent = allLabels.hasOwnProperty(queriedFloId) ? allLabels[queriedFloId] === 'Unknown' ? queriedFloId : allLabels[queriedFloId] : queriedFloId
}) })
// render transactions // render transactions
getRef('transactions_scroller').nextElementSibling.classList.remove('hide') getRef('transactions_scroller').nextElementSibling.classList.remove('hide')
getRef('transactions_scroller').classList.add('hide') getRef('transactions_scroller').classList.add('hide')
getRef('transactions_list').innerHTML = ''; getRef('transactions_list').innerHTML = '';
await floWebWallet.syncTransactions(floID); await floWebWallet.syncTransactions(queriedFloId);
let allTransactions = (await floWebWallet.readTransactions(floID)).reverse(); let allTransactions = (await floWebWallet.readTransactions(queriedFloId)).reverse();
const filter = getRef('filter_selector').value; const filter = getRef('filter_selector').value;
if (filter !== 'all') { if (filter !== 'all') {
allTransactions = allTransactions.filter(t => filter === 'sent' ? t.sender === floID : t.receiver === floID) allTransactions = allTransactions.filter(t => filter === 'sent' ? t.sender === queriedFloId : t.receiver === queriedFloId)
} }
if (transactionsLazyLoader) { if (transactionsLazyLoader) {
transactionsLazyLoader.update(allTransactions) transactionsLazyLoader.update(allTransactions)
@ -1371,7 +1370,7 @@
); );
} else { } else {
const target = e.target.closest('.saved-id'); const target = e.target.closest('.saved-id');
window.location.hash = `#/transactions?id=${target.dataset.floId}` window.location.hash = `#/transactions/${target.dataset.floId}`
} }
}) })
delegate(getRef('saved_ids_picker_list'), 'click', '.saved-id', e => { delegate(getRef('saved_ids_picker_list'), 'click', '.saved-id', e => {
@ -1386,10 +1385,11 @@
}) })
getRef('filter_selector').addEventListener('change', async e => { getRef('filter_selector').addEventListener('change', async e => {
const queriedFloId = pagesData.wildcards[0]
const filter = e.target.value const filter = e.target.value
let allTransactions = (await floWebWallet.readTransactions(pagesData.params.id)).reverse() let allTransactions = (await floWebWallet.readTransactions(queriedFloId)).reverse()
if (filter !== 'all') { if (filter !== 'all') {
allTransactions = allTransactions.filter(t => filter === 'sent' ? t.sender === pagesData.params.id : t.receiver === pagesData.params.id) allTransactions = allTransactions.filter(t => filter === 'sent' ? t.sender === queriedFloId : t.receiver === queriedFloId)
} }
transactionsLazyLoader.update(allTransactions) transactionsLazyLoader.update(allTransactions)
}) })