forked from decred/decrediton
-
Notifications
You must be signed in to change notification settings - Fork 0
/
ListUTXOsModal.jsx
78 lines (71 loc) · 2.1 KB
/
ListUTXOsModal.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
import { FormattedMessage as T, defineMessages } from "react-intl";
import Modal from "../Modal";
import styles from "./ListUTXOsModal.module.css";
import { Table } from "pi-ui";
import { useListUtxo } from "./hooks";
import { Balance } from "shared";
import { CopyToClipboardButton } from "buttons";
import { AccountsSelect } from "inputs";
const messages = defineMessages({
utxo: {
id: "listutxo.header.utxo",
defaultMessage: "UTXO"
},
value: {
id: "listutxo.header.value",
defaultMessage: "Value"
}
});
const ListUTXOsModal = ({ onCancelModal, show }) => {
const { intl, unspentOutputs, account, setAccount } = useListUtxo();
const data =
unspentOutputs?.map((utxo) => {
const utxoValue = `${utxo.txHash}:${utxo.outpointIndex}`;
return {
UTXO: (
<div className={styles.utxoValue}>
<span>{utxoValue}</span>
<CopyToClipboardButton
textToCopy={utxoValue}
className={styles.copyIcon}
/>
</div>
),
Value: (
<Balance
amount={utxo.amount}
classNameUnit={styles.balanceNameUnit}
classNameSecondary={styles.balanceSecondary}
/>
)
};
}) ?? [];
const headers = [
intl.formatMessage(messages.utxo),
intl.formatMessage(messages.value)
];
return (
<Modal className={styles.modal} {...{ show, onCancelModal }}>
<div className={styles.modalHeader}>
<div className={styles.title}>
<T id="listutxos.listUnspentUTXOs" m="List Unspent UTXOs" />
</div>
<AccountsSelect
{...{ account, onChange: setAccount }}
className={styles.accountSelect}
/>
</div>
<div className={styles.closeButton} onClick={onCancelModal} />
<Table
disablePagination
data={data}
headers={headers}
headClassName={styles.tableHeader}
bodyClassName={styles.tableBody}
wrapperClassName={styles.tableWrapper}
linesPerPage={Math.max(data.length, 1)}
/>
</Modal>
);
};
export default ListUTXOsModal;