Extract ABI parent component

This commit is contained in:
Willian Mitsuda 2021-10-24 23:04:04 -03:00
parent e9712b18a5
commit d7ba5f09fd
3 changed files with 24 additions and 12 deletions

View File

@ -0,0 +1,19 @@
import React from "react";
import Copy from "../components/Copy";
import RawABI from "./RawABI";
type ContractABIProps = {
abi: any[];
};
const ContractABI: React.FC<ContractABIProps> = ({ abi }) => (
<div className="mb-3">
<div className="flex space-x-2 text-sm border-l border-r border-t rounded-t px-2 py-1">
<span>ABI</span>
<Copy value={JSON.stringify(abi)} />
</div>
<RawABI abi={abi} />
</div>
);
export default React.memo(ContractABI);

View File

@ -5,13 +5,12 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faChevronDown } from "@fortawesome/free-solid-svg-icons/faChevronDown";
import ContentFrame from "../ContentFrame";
import InfoRow from "../components/InfoRow";
import Copy from "../components/Copy";
import ABI from "./ABI";
import Contract from "./Contract";
import { RuntimeContext } from "../useRuntime";
import { Metadata } from "../useSourcify";
import ExternalLink from "../components/ExternalLink";
import { openInRemixURL } from "../url";
import ContractABI from "./ContractABI";
type ContractsProps = {
checksummedAddress: string;
@ -70,13 +69,7 @@ const Contracts: React.FC<ContractsProps> = ({
{rawMetadata !== undefined && rawMetadata !== null && (
<>
{rawMetadata.output.abi && (
<div className="mb-3">
<div className="flex space-x-2 text-sm border-l border-r border-t rounded-t px-2 py-1">
<span>ABI</span>
<Copy value={JSON.stringify(rawMetadata.output.abi)} />
</div>
<ABI abi={rawMetadata.output.abi} />
</div>
<ContractABI abi={rawMetadata.output.abi} />
)}
<div>
<Menu>

View File

@ -1,11 +1,11 @@
import React from "react";
import { SyntaxHighlighter, docco } from "../highlight-init";
type ABIProps = {
type RawABIProps = {
abi: any[];
};
const ABI: React.FC<ABIProps> = ({ abi }) => (
const RawABI: React.FC<RawABIProps> = ({ abi }) => (
<SyntaxHighlighter
className="w-full h-60 border font-code text-base"
language="json"
@ -16,4 +16,4 @@ const ABI: React.FC<ABIProps> = ({ abi }) => (
</SyntaxHighlighter>
);
export default React.memo(ABI);
export default React.memo(RawABI);