Skip to content

Commit 3df80f6

Browse files
MuesliSwapTeamMuesliSwapTeam
committed
reduce code complexity etc.
1 parent dceb1e5 commit 3df80f6

File tree

3 files changed

+167
-158
lines changed

3 files changed

+167
-158
lines changed

‎src/api/extension/index.js‎

Lines changed: 61 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -274,54 +274,74 @@ export const updateTxInfo = async (txHash, pending) => {
274274
const network = await getNetwork();
275275
let detail = await currentAccount[network.id].history.details[txHash];
276276

277-
if (typeof detail !== 'object' || !detail.info || !detail.block || !detail.utxos || !detail.metadata) {
278-
detail = {};
279-
let info = await getTxInfo(txHash, pending);
280-
281-
if (!info && pending) {
282-
// This transaction is no longer part of the mempool
283-
info = await getTxInfo(txHash, false);
284-
if (info) {
285-
const accounts = await getStorage(STORAGE.accounts);
286-
const currentAccountIndex = await getCurrentAccountIndex()
287-
accounts[currentAccountIndex][network.id].history.pending = accounts[currentAccountIndex][network.id].history.pending.filter((t) => t !== txHash)
288-
pending = false
289-
await setStorage({ [STORAGE.accounts]: { ...accounts }, });
290-
}
291-
}
277+
if (isValidDetail(detail)) return detail;
292278

293-
if (!pending) {
294-
const uTxOs = getTxUTxOs(txHash);
295-
const metadata = getTxMetadata(txHash);
279+
detail = {};
280+
let info = await getTxInfo(txHash, pending);
296281

297-
detail.info = info;
298-
if (info) detail.block = await getBlock(detail.info.block_height);
299-
detail.utxos = await uTxOs;
300-
detail.metadata = await metadata;
301-
} else {
302-
// In this case it might simply no longer be in the mempool
303-
const uTxOs = {
304-
hash: txHash,
305-
inputs: info ? info.inputs : [],
306-
outputs: info ? info.outputs : [],
307-
};
308-
// Need to manually resolve outputs here
309-
// TODO automatically check if respective UTxO has to be fetched from mempool
310-
for (const input of uTxOs.inputs) {
311-
const uTxOs = await getTxUTxOs(input.tx_hash);
312-
input.amount = uTxOs.outputs[input.output_index].amount;
313-
}
314-
detail.info = info && info.tx;
315-
detail.utxos = uTxOs;
316-
detail.block = "mempool";
317-
// This is not provided by blockfrost yet
318-
detail.metadata = [];
319-
}
282+
if (!info && pending) {
283+
info = await handleMissingInfoWhenPending(txHash, network);
284+
if (info) pending = false;
285+
}
286+
287+
if (!pending) {
288+
detail = await buildFinalizedDetail(detail, info);
289+
} else {
290+
detail = await buildPendingDetail(detail, txHash, info);
320291
}
321292

322293
return detail;
323294
};
324295

296+
function isValidDetail(detail) {
297+
return (
298+
typeof detail === 'object' &&
299+
detail.info &&
300+
detail.block &&
301+
detail.utxos &&
302+
detail.metadata
303+
);
304+
}
305+
306+
async function handleMissingInfoWhenPending(txHash, network) {
307+
const info = await getTxInfo(txHash, false);
308+
if (info) {
309+
const accounts = await getStorage(STORAGE.accounts);
310+
const currentAccountIndex = await getCurrentAccountIndex();
311+
accounts[currentAccountIndex][network.id].history.pending = accounts[currentAccountIndex][network.id].history.pending.filter((t) => t !== txHash);
312+
await setStorage({ [STORAGE.accounts]: { ...accounts } });
313+
}
314+
return info;
315+
}
316+
317+
async function buildFinalizedDetail(detail, info) {
318+
const txHash = info ? info.tx_hash : null;
319+
const uTxOs = txHash ? getTxUTxOs(txHash) : [];
320+
const metadata = txHash ? getTxMetadata(txHash) : [];
321+
detail.info = info;
322+
if (info) detail.block = await getBlock(info.block_height);
323+
detail.utxos = await uTxOs;
324+
detail.metadata = await metadata;
325+
return detail;
326+
}
327+
328+
async function buildPendingDetail(detail, txHash, info) {
329+
const uTxOs = {
330+
hash: txHash,
331+
inputs: info ? info.inputs : [],
332+
outputs: info ? info.outputs : [],
333+
};
334+
for (const input of uTxOs.inputs) {
335+
const inputUTxOs = await getTxUTxOs(input.tx_hash);
336+
input.amount = inputUTxOs.outputs[input.output_index].amount;
337+
}
338+
detail.info = info?.tx;
339+
detail.utxos = uTxOs;
340+
detail.block = "mempool";
341+
detail.metadata = [];
342+
return detail;
343+
}
344+
325345
export const setTxDetail = async (txObject) => {
326346
const currentIndex = await getCurrentAccountIndex();
327347
const network = await getNetwork();

‎src/ui/app/components/historyViewer.jsx‎

Lines changed: 105 additions & 116 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ const HistoryViewer = ({ history, network, currentAddr, addresses }) => {
2727
const [memLoaded, setMemLoaded] = React.useState(false);
2828
const [final, setFinal] = React.useState(false);
2929
const [loadNext, setLoadNext] = React.useState(false);
30+
3031
const getTxs = async () => {
3132
if (!history) {
3233
pending_slice = [];
@@ -39,31 +40,21 @@ const HistoryViewer = ({ history, network, currentAddr, addresses }) => {
3940
setMemLoaded(false);
4041
return;
4142
}
42-
await new Promise((res, rej) => setTimeout(() => res(), 10));
43-
44-
// if (!memLoaded) {
45-
// pending_slice = pending_slice.concat(
46-
// history.pending.slice((pendingPage - 1)*BATCH, pendingPage*BATCH)
47-
// );
48-
// } else {
49-
// slice = slice.concat(
50-
// history.confirmed.slice((page - 1)*BATCH, page * BATCH)
51-
// );
52-
// }
43+
await new Promise((res) => setTimeout(() => res(), 10));
5344

5445
if (!memLoaded && pending_slice.length < pendingPage * BATCH) {
5546
const txs = await getTransactions(pendingPage, BATCH, !memLoaded);
5647
if (txs.length <= 0) {
57-
setMemLoaded(true)
48+
setMemLoaded(true);
5849
} else {
5950
pending_slice = Array.from(new Set(pending_slice.concat(txs.map((tx) => tx.txHash))));
6051
await setTransactions(pending_slice, true);
6152
}
62-
}
53+
}
6354
if (memLoaded && slice.length < page * BATCH) {
6455
const txs = await getTransactions(page, BATCH, !memLoaded);
6556
if (txs.length <= 0) {
66-
setFinal(true);
57+
setFinal(true);
6758
} else {
6859
slice = Array.from(new Set(slice.concat(txs.map((tx) => tx.txHash))));
6960
await setTransactions(slice, false);
@@ -96,110 +87,108 @@ const HistoryViewer = ({ history, network, currentAddr, addresses }) => {
9687
if (historySlice.length >= (page - 1) * BATCH) setLoadNext(false);
9788
}, [historySlice]);
9889

99-
return (
100-
<Box position="relative">
101-
{!(history && historySlice) ? (
102-
<HistorySpinner />
103-
) : historySlice.length <= 0 && pendingHistorySlice.length <= 0 ? (
104-
<Box
105-
mt="16"
106-
display="flex"
107-
alignItems="center"
108-
justifyContent="center"
109-
flexDirection="column"
110-
opacity="0.5"
90+
let content;
91+
if (!(history && historySlice)) {
92+
content = <HistorySpinner />;
93+
} else if (historySlice.length <= 0 && pendingHistorySlice.length <= 0) {
94+
content = (
95+
<Box
96+
mt="16"
97+
display="flex"
98+
alignItems="center"
99+
justifyContent="center"
100+
flexDirection="column"
101+
opacity="0.5"
102+
>
103+
<File size={80} mood="ko" color="#61DDBC" />
104+
<Box height="2" />
105+
<Text fontWeight="bold" color="GrayText">
106+
No History
107+
</Text>
108+
</Box>
109+
);
110+
} else {
111+
content = (
112+
<>
113+
<Accordion
114+
allowToggle
115+
borderBottom="none"
116+
onClick={() => {
117+
capture(Events.ActivityActivityActivityRowClick);
118+
}}
111119
>
112-
<File size={80} mood="ko" color="#61DDBC" />
113-
<Box height="2" />
114-
<Text fontWeight="bold" color="GrayText">
115-
No History
116-
</Text>
117-
</Box>
118-
) : (
119-
<>
120-
<Accordion
121-
allowToggle
122-
borderBottom="none"
123-
onClick={() => {
124-
capture(Events.ActivityActivityActivityRowClick);
125-
}}
120+
{pendingHistorySlice.map((txHash) => {
121+
if (!history.details[txHash]) history.details[txHash] = {};
122+
return (
123+
<Transaction
124+
onLoad={(hash, txDetail) => {
125+
history.details[hash] = txDetail;
126+
txObject[hash] = txDetail;
127+
}}
128+
key={txHash}
129+
txHash={txHash}
130+
detail={history.details[txHash]}
131+
currentAddr={currentAddr}
132+
addresses={addresses}
133+
network={network}
134+
pending
135+
/>
136+
);
137+
})}
138+
{historySlice.map((txHash) => {
139+
if (!history.details[txHash]) history.details[txHash] = {};
140+
return (
141+
<Transaction
142+
onLoad={(hash, txDetail) => {
143+
history.details[hash] = txDetail;
144+
txObject[hash] = txDetail;
145+
}}
146+
key={txHash}
147+
txHash={txHash}
148+
detail={history.details[txHash]}
149+
currentAddr={currentAddr}
150+
addresses={addresses}
151+
network={network}
152+
pending={false}
153+
/>
154+
);
155+
})}
156+
</Accordion>
157+
{final ? (
158+
<Box
159+
textAlign="center"
160+
fontSize={16}
161+
fontWeight="bold"
162+
color="gray.400"
126163
>
127-
{pendingHistorySlice.map((txHash, index) => {
128-
if (!history.details[txHash]) history.details[txHash] = {};
129-
130-
return (
131-
<Transaction
132-
onLoad={(txHash, txDetail) => {
133-
history.details[txHash] = txDetail;
134-
txObject[txHash] = txDetail;
135-
}}
136-
key={index}
137-
txHash={txHash}
138-
detail={history.details[txHash]}
139-
currentAddr={currentAddr}
140-
addresses={addresses}
141-
network={network}
142-
pending={true}
143-
/>
144-
);
145-
})}
146-
{historySlice.map((txHash, index) => {
147-
if (!history.details[txHash]) history.details[txHash] = {};
148-
149-
return (
150-
<Transaction
151-
onLoad={(txHash, txDetail) => {
152-
history.details[txHash] = txDetail;
153-
txObject[txHash] = txDetail;
154-
}}
155-
key={index}
156-
txHash={txHash}
157-
detail={history.details[txHash]}
158-
currentAddr={currentAddr}
159-
addresses={addresses}
160-
network={network}
161-
pending={false}
162-
/>
163-
);
164-
})}
165-
</Accordion>
166-
{final ? (
167-
<Box
168-
textAlign="center"
169-
// mt={18}
170-
fontSize={16}
171-
fontWeight="bold"
172-
color="gray.400"
164+
... nothing more
165+
</Box>
166+
) : (
167+
<Box textAlign="center">
168+
<Button
169+
variant="outline"
170+
onClick={() => {
171+
setLoadNext(true);
172+
setTimeout(
173+
memLoaded ? () => setPage(page + 1) : () => setPendingPage(pendingPage + 1)
174+
);
175+
}}
176+
colorScheme="orange"
177+
aria-label="More"
178+
fontSize={20}
179+
w="50%"
180+
h="30px"
181+
rounded="xl"
173182
>
174-
... nothing more
175-
</Box>
176-
) : (
177-
<Box textAlign="center">
178-
<Button
179-
variant="outline"
180-
onClick={() => {
181-
setLoadNext(true);
182-
setTimeout(
183-
memLoaded ?
184-
() => setPage(page + 1) :
185-
() => setPendingPage(pendingPage + 1)
186-
);
187-
}}
188-
colorScheme="orange"
189-
aria-label="More"
190-
fontSize={20}
191-
w="50%"
192-
h="30px"
193-
rounded="xl"
194-
>
195-
{loadNext ? '...' : <ChevronDownIcon fontSize="30px" />}
196-
</Button>
197-
</Box>
198-
)}
199-
</>
200-
)}
201-
</Box>
202-
);
183+
{loadNext ? '...' : <ChevronDownIcon fontSize="30px" />}
184+
</Button>
185+
</Box>
186+
)}
187+
</>
188+
);
189+
}
190+
191+
return <Box position="relative">{content}</Box>;
203192
};
204193

205194
const HistorySpinner = () => (
@@ -208,4 +197,4 @@ const HistorySpinner = () => (
208197
</Box>
209198
);
210199

211-
export default HistoryViewer;
200+
export default HistoryViewer;

‎src/ui/app/components/transaction.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,7 @@ const Transaction = ({
108108
};
109109

110110
const getTxDetail = async () => {
111-
if (true || !displayInfo || detail.block === "mempool") {
111+
if (!displayInfo || detail.block === "mempool") {
112112
let txDetail = await updateTxInfo(txHash, pending);
113113
detail.block = txDetail.block;
114114
onLoad(txHash, txDetail);

0 commit comments

Comments
 (0)