Refactorings

This commit is contained in:
Willian Mitsuda 2021-09-06 03:43:20 -03:00
parent a76a2d71a2
commit fe336c5c43
5 changed files with 53 additions and 53 deletions

View File

@ -216,16 +216,12 @@ const AddressTransactions: React.FC = () => {
</StandardSubtitle>
<Tab.Group>
<Tab.List className="flex space-x-2 border-l border-r border-t rounded-t-lg bg-white">
<Tab as={Fragment}>
<NavTab href={`/address/${checksummedAddress}`}>
Overview
</NavTab>
</Tab>
<Tab as={Fragment}>
<NavTab href={`/address/${checksummedAddress}/contract`}>
Contract
</NavTab>
</Tab>
<NavTab href={`/address/${checksummedAddress}`}>
Overview
</NavTab>
<NavTab href={`/address/${checksummedAddress}/contract`}>
Contract
</NavTab>
</Tab.List>
<Tab.Panels>
<Switch>

View File

@ -1,9 +1,9 @@
import React, { useMemo, useContext } from "react";
import { Route, Switch, useParams } from "react-router-dom";
import { Tab } from "@headlessui/react";
import StandardFrame from "./StandardFrame";
import StandardSubtitle from "./StandardSubtitle";
import ContentFrame from "./ContentFrame";
import TabGroup from "./components/TabGroup";
import NavTab from "./components/NavTab";
import Details from "./transaction/Details";
import Logs from "./transaction/Logs";
@ -56,14 +56,17 @@ const Transaction: React.FC = () => {
)}
{txData && (
<SelectionContext.Provider value={selectionCtx}>
<TabGroup>
<NavTab href={`/tx/${txhash}`}>Overview</NavTab>
{txData.confirmedData?.blockNumber !== undefined && (
<NavTab href={`/tx/${txhash}/logs`}>
Logs{txData && ` (${txData.confirmedData?.logs?.length ?? 0})`}
</NavTab>
)}
</TabGroup>
<Tab.Group>
<Tab.List className="flex space-x-2 border-l border-r border-t rounded-t-lg bg-white">
<NavTab href={`/tx/${txhash}`}>Overview</NavTab>
{txData.confirmedData?.blockNumber !== undefined && (
<NavTab href={`/tx/${txhash}/logs`}>
Logs
{txData && ` (${txData.confirmedData?.logs?.length ?? 0})`}
</NavTab>
)}
</Tab.List>
</Tab.Group>
<Switch>
<Route path="/tx/:txhash/" exact>
<Details

View File

@ -1,5 +1,6 @@
import React, { useState, useEffect, useContext } from "react";
import { ethers } from "ethers";
import React, { useState, useEffect, useContext, Fragment } from "react";
import { commify } from "@ethersproject/units";
import { Tab } from "@headlessui/react";
import ContentFrame from "../ContentFrame";
import InfoRow from "../components/InfoRow";
import Contract from "./Contract";
@ -40,7 +41,7 @@ const Contracts: React.FC<ContractsProps> = ({
<span>
<span className="font-bold text-green-600">Yes</span> with{" "}
<span className="font-bold text-green-600">
{ethers.utils.commify(optimizer?.runs)}
{commify(optimizer?.runs)}
</span>{" "}
runs
</span>
@ -56,20 +57,24 @@ const Contracts: React.FC<ContractsProps> = ({
)}
{rawMetadata !== undefined && rawMetadata !== null && (
<div>
<div className="flex truncate">
{Object.entries(rawMetadata.sources).map(([k]) => (
<button
className={`border-b-2 border-transparent rounded-t text-sm px-2 py-1 ${
selected === k
? "border-orange-300 font-bold bg-gray-200 text-gray-500"
: "hover:border-orange-200 bg-gray-100 hover:text-gray-500 text-gray-400 transition-transform transition-colors duration-75 transform origin-bottom scale-95 hover:scale-100"
}`}
onClick={() => setSelected(k)}
>
{k}
</button>
))}
</div>
<Tab.Group>
<Tab.List className="flex truncate">
{Object.entries(rawMetadata.sources).map(([k]) => (
<Tab key={k} as={Fragment}>
<button
className={`border-b-2 border-transparent rounded-t text-sm px-2 py-1 ${
selected === k
? "border-orange-300 font-bold bg-gray-200 text-gray-500"
: "hover:border-orange-200 bg-gray-100 hover:text-gray-500 text-gray-400 transition-transform transition-colors duration-75 transform origin-bottom scale-95 hover:scale-100"
}`}
onClick={() => setSelected(k)}
>
{k}
</button>
</Tab>
))}
</Tab.List>
</Tab.Group>
{selected && (
<Contract
checksummedAddress={checksummedAddress}

View File

@ -1,20 +1,23 @@
import React from "react";
import React, { Fragment } from "react";
import { NavLink } from "react-router-dom";
import { Tab } from "@headlessui/react";
type NavTabProps = {
href: string;
};
const NavTab: React.FC<NavTabProps> = ({ href, children }) => (
<NavLink
className="text-gray-500 border-transparent hover:text-link-blue text-sm font-bold px-3 py-3 border-b-2"
activeClassName="text-link-blue border-link-blue"
to={href}
exact
replace
>
{children}
</NavLink>
<Tab as={Fragment}>
<NavLink
className="text-gray-500 border-transparent hover:text-link-blue text-sm font-bold px-3 py-3 border-b-2"
activeClassName="text-link-blue border-link-blue"
to={href}
exact
replace
>
{children}
</NavLink>
</Tab>
);
export default NavTab;

View File

@ -1,7 +0,0 @@
const TabGroup: React.FC = ({ children }) => (
<div className="flex space-x-2 border-l border-r border-t rounded-t-lg bg-white">
{children}
</div>
);
export default TabGroup;