otterscan/src/components/InternalSelfDestruct.tsx
2021-11-18 15:51:08 -03:00

82 lines
2.7 KiB
TypeScript

import React from "react";
import { formatEther } from "@ethersproject/units";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faAngleRight } from "@fortawesome/free-solid-svg-icons/faAngleRight";
import AddressHighlighter from "./AddressHighlighter";
import DecoratedAddressLink from "./DecoratedAddressLink";
import { TransactionData, InternalOperation } from "../types";
import { ResolvedAddresses } from "../api/address-resolver";
import TransactionAddress from "./TransactionAddress";
type InternalSelfDestructProps = {
txData: TransactionData;
internalOp: InternalOperation;
resolvedAddresses: ResolvedAddresses | undefined;
};
const InternalSelfDestruct: React.FC<InternalSelfDestructProps> = ({
txData,
internalOp,
resolvedAddresses,
}) => {
const toMiner =
txData.confirmedData?.miner !== undefined &&
internalOp.to === txData.confirmedData.miner;
return (
<>
<div className="flex items-baseline space-x-1 whitespace-nowrap">
<span className="text-gray-500">
<FontAwesomeIcon icon={faAngleRight} size="1x" /> SELF DESTRUCT
</span>
<span>Contract</span>
<div className="flex items-baseline">
<AddressHighlighter address={internalOp.from}>
<DecoratedAddressLink
address={internalOp.from}
selfDestruct
resolvedAddresses={resolvedAddresses}
/>
</AddressHighlighter>
</div>
{internalOp.value.isZero() && (
<div className="flex items-baseline text-gray-400">
(To:{" "}
<TransactionAddress
address={internalOp.to}
resolvedAddresses={resolvedAddresses}
/>
)
</div>
)}
</div>
{!internalOp.value.isZero() && (
<div className="ml-5 flex items-baseline space-x-1">
<span className="text-gray-500">
<FontAwesomeIcon icon={faAngleRight} size="1x" /> TRANSFER
</span>
<span>{formatEther(internalOp.value)} Ether</span>
<div className="flex items-baseline">
<span className="text-gray-500">To</span>
<AddressHighlighter address={internalOp.to}>
<div
className={`flex items-baseline space-x-1 ${
toMiner ? "rounded px-2 py-1 bg-yellow-100" : ""
}`}
>
<DecoratedAddressLink
address={internalOp.to}
miner={toMiner}
resolvedAddresses={resolvedAddresses}
/>
</div>
</AddressHighlighter>
</div>
</div>
)}
</>
);
};
export default InternalSelfDestruct;