Replace component
This commit is contained in:
parent
b723182ad3
commit
128c70b972
|
@ -1,9 +1,8 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||||
import { faCaretRight } from "@fortawesome/free-solid-svg-icons/faCaretRight";
|
import { faCaretRight } from "@fortawesome/free-solid-svg-icons/faCaretRight";
|
||||||
import AddressHighlighter from "./components/AddressHighlighter";
|
import TransactionAddress from "./components/TransactionAddress";
|
||||||
import ValueHighlighter from "./components/ValueHighlighter";
|
import ValueHighlighter from "./components/ValueHighlighter";
|
||||||
import DecoratedAddressLink from "./components/DecoratedAddressLink";
|
|
||||||
import FormattedBalance from "./components/FormattedBalance";
|
import FormattedBalance from "./components/FormattedBalance";
|
||||||
import {
|
import {
|
||||||
AddressContext,
|
AddressContext,
|
||||||
|
@ -34,27 +33,19 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
|
||||||
<div className="grid grid-cols-5 gap-x-1">
|
<div className="grid grid-cols-5 gap-x-1">
|
||||||
<div className="flex space-x-1">
|
<div className="flex space-x-1">
|
||||||
<span className="font-bold">From</span>
|
<span className="font-bold">From</span>
|
||||||
<AddressHighlighter address={t.from}>
|
<TransactionAddress
|
||||||
<DecoratedAddressLink
|
|
||||||
address={t.from}
|
address={t.from}
|
||||||
addressCtx={AddressContext.FROM}
|
addressCtx={AddressContext.FROM}
|
||||||
txFrom={t.from === txData.from}
|
|
||||||
txTo={t.from === txData.to}
|
|
||||||
resolvedAddresses={resolvedAddresses}
|
resolvedAddresses={resolvedAddresses}
|
||||||
/>
|
/>
|
||||||
</AddressHighlighter>
|
|
||||||
</div>
|
</div>
|
||||||
<div className="flex space-x-1">
|
<div className="flex space-x-1">
|
||||||
<span className="font-bold">To</span>
|
<span className="font-bold">To</span>
|
||||||
<AddressHighlighter address={t.to}>
|
<TransactionAddress
|
||||||
<DecoratedAddressLink
|
|
||||||
address={t.to}
|
address={t.to}
|
||||||
addressCtx={AddressContext.TO}
|
addressCtx={AddressContext.TO}
|
||||||
txFrom={t.to === txData.from}
|
|
||||||
txTo={t.to === txData.to}
|
|
||||||
resolvedAddresses={resolvedAddresses}
|
resolvedAddresses={resolvedAddresses}
|
||||||
/>
|
/>
|
||||||
</AddressHighlighter>
|
|
||||||
</div>
|
</div>
|
||||||
<div className="col-span-3 flex space-x-1">
|
<div className="col-span-3 flex space-x-1">
|
||||||
<span className="font-bold">For</span>
|
<span className="font-bold">For</span>
|
||||||
|
@ -66,12 +57,10 @@ const TokenTransferItem: React.FC<TokenTransferItemProps> = ({
|
||||||
/>
|
/>
|
||||||
</ValueHighlighter>
|
</ValueHighlighter>
|
||||||
</span>
|
</span>
|
||||||
<AddressHighlighter address={t.token}>
|
<TransactionAddress
|
||||||
<DecoratedAddressLink
|
|
||||||
address={t.token}
|
address={t.token}
|
||||||
resolvedAddresses={resolvedAddresses}
|
resolvedAddresses={resolvedAddresses}
|
||||||
/>
|
/>
|
||||||
</AddressHighlighter>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -3,14 +3,17 @@ import AddressHighlighter from "./AddressHighlighter";
|
||||||
import DecoratedAddressLink from "./DecoratedAddressLink";
|
import DecoratedAddressLink from "./DecoratedAddressLink";
|
||||||
import { ResolvedAddresses } from "../api/address-resolver";
|
import { ResolvedAddresses } from "../api/address-resolver";
|
||||||
import { useSelectedTransaction } from "../useSelectedTransaction";
|
import { useSelectedTransaction } from "../useSelectedTransaction";
|
||||||
|
import { AddressContext } from "../types";
|
||||||
|
|
||||||
type TransactionAddressProps = {
|
type TransactionAddressProps = {
|
||||||
address: string;
|
address: string;
|
||||||
|
addressCtx?: AddressContext | undefined;
|
||||||
resolvedAddresses: ResolvedAddresses | undefined;
|
resolvedAddresses: ResolvedAddresses | undefined;
|
||||||
};
|
};
|
||||||
|
|
||||||
const TransactionAddress: React.FC<TransactionAddressProps> = ({
|
const TransactionAddress: React.FC<TransactionAddressProps> = ({
|
||||||
address,
|
address,
|
||||||
|
addressCtx,
|
||||||
resolvedAddresses,
|
resolvedAddresses,
|
||||||
}) => {
|
}) => {
|
||||||
const txData = useSelectedTransaction();
|
const txData = useSelectedTransaction();
|
||||||
|
@ -21,6 +24,7 @@ const TransactionAddress: React.FC<TransactionAddressProps> = ({
|
||||||
<AddressHighlighter address={address}>
|
<AddressHighlighter address={address}>
|
||||||
<DecoratedAddressLink
|
<DecoratedAddressLink
|
||||||
address={address}
|
address={address}
|
||||||
|
addressCtx={addressCtx}
|
||||||
miner={address === txData?.confirmedData?.miner}
|
miner={address === txData?.confirmedData?.miner}
|
||||||
txFrom={address === txData?.from}
|
txFrom={address === txData?.from}
|
||||||
txTo={address === txData?.to || creation}
|
txTo={address === txData?.to || creation}
|
||||||
|
|
Loading…
Reference in New Issue