a
/
otterscan
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Retrofit useMultipleMetadata into AddressTransactions page

This commit is contained in:
Willian Mitsuda 2021-11-10 05:00:27 -03:00
parent 8d259dacc8
commit fe8be2ee21
2 changed files with 19 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/AddressTransactions.tsx
View File

@ -31,7 +31,7 @@ import { useFeeToggler } from "./search/useFeeToggler";
import { SelectionContext, useSelection } from "./useSelection"; import { SelectionContext, useSelection } from "./useSelection";
import { useMultipleETHUSDOracle } from "./usePriceOracle"; import { useMultipleETHUSDOracle } from "./usePriceOracle";
import { useAppConfigContext } from "./useAppConfig"; import { useAppConfigContext } from "./useAppConfig";
import { useSourcify } from "./useSourcify"; import { useMultipleMetadata } from "./useSourcify";
import SourcifyLogo from "./sourcify.svg"; import SourcifyLogo from "./sourcify.svg";
type BlockParams = { type BlockParams = {
@ -181,12 +181,18 @@ const AddressTransactions: React.FC = () => {
const [feeDisplay, feeDisplayToggler] = useFeeToggler(); const [feeDisplay, feeDisplayToggler] = useFeeToggler();
const selectionCtx = useSelection(); const selectionCtx = useSelection();
const addresses = useMemo(() => [checksummedAddress], [checksummedAddress]);
const { sourcifySource } = useAppConfigContext(); const { sourcifySource } = useAppConfigContext();
const rawMetadata = useSourcify( const metadatas = useMultipleMetadata(
checksummedAddress, undefined,
addresses,
provider?.network.chainId, provider?.network.chainId,
sourcifySource sourcifySource
); );
const addressMetadata =
checksummedAddress !== undefined
? metadatas[checksummedAddress]
: undefined;
return ( return (
<StandardFrame> <StandardFrame>
@ -224,18 +230,18 @@ const AddressTransactions: React.FC = () => {
<NavTab href={`/address/${checksummedAddress}/contract`}> <NavTab href={`/address/${checksummedAddress}/contract`}>
<span <span
className={`flex items-baseline space-x-2 ${ className={`flex items-baseline space-x-2 ${
rawMetadata === undefined ? "italic opacity-50" : "" addressMetadata === undefined ? "italic opacity-50" : ""
}`} }`}
> >
<span>Contract</span> <span>Contract</span>
{rawMetadata === undefined ? ( {addressMetadata === undefined ? (
<span className="self-center"> <span className="self-center">
<FontAwesomeIcon <FontAwesomeIcon
className="animate-spin" className="animate-spin"
icon={faCircleNotch} icon={faCircleNotch}
/> />
</span> </span>
) : rawMetadata === null ? ( ) : addressMetadata === null ? (
<span className="self-center text-red-500"> <span className="self-center text-red-500">
<FontAwesomeIcon icon={faQuestionCircle} /> <FontAwesomeIcon icon={faQuestionCircle} />
</span> </span>
@ -316,7 +322,7 @@ const AddressTransactions: React.FC = () => {
<Route path="/address/:addressOrName/contract" exact> <Route path="/address/:addressOrName/contract" exact>
<Contracts <Contracts
checksummedAddress={checksummedAddress} checksummedAddress={checksummedAddress}
rawMetadata={rawMetadata} rawMetadata={addressMetadata}
/> />
</Route> </Route>
</Switch> </Switch>

9
src/useSourcify.ts
View File

@ -87,6 +87,7 @@ const fetchSourcifyMetadata = async (
} }
}; };
// TODO: replace every occurrence with the multiple version one
export const useSourcify = ( export const useSourcify = (
address: ChecksummedAddress | undefined, address: ChecksummedAddress | undefined,
chainId: number | undefined, chainId: number | undefined,
@ -121,7 +122,7 @@ export const useSourcify = (
}; };
export const useMultipleMetadata = ( export const useMultipleMetadata = (
baseMetadatas: Record<string, Metadata | null>, baseMetadatas: Record<string, Metadata | null> | undefined,
addresses: (ChecksummedAddress | undefined)[], addresses: (ChecksummedAddress | undefined)[],
chainId: number | undefined, chainId: number | undefined,
source: SourcifySource source: SourcifySource
@ -146,7 +147,9 @@ export const useMultipleMetadata = (
} }
const results = await Promise.all(promises); const results = await Promise.all(promises);
const metadatas: Record<string, Metadata | null> = { ...baseMetadatas }; const metadatas: Record<string, Metadata | null> = baseMetadatas
? { ...baseMetadatas }
: {};
for (let i = 0; i < results.length; i++) { for (let i = 0; i < results.length; i++) {
metadatas[dedupedAddresses[i]] = results[i]; metadatas[dedupedAddresses[i]] = results[i];
} }
@ -156,7 +159,7 @@ export const useMultipleMetadata = (
const deduped = new Set( const deduped = new Set(
addresses.filter( addresses.filter(
(a): a is ChecksummedAddress => (a): a is ChecksummedAddress =>
a !== undefined && baseMetadatas[a] === undefined a !== undefined && baseMetadatas?.[a] === undefined
) )
); );
fetchMetadata(Array.from(deduped)); fetchMetadata(Array.from(deduped));