bridge_ui: add supported terra tokens, fix refresh
Change-Id: I3f7ff93927482422d9afc7e1943ccb5cc07d140f
This commit is contained in:
parent
71dbe80aae
commit
e8b51439fe
|
@ -13,14 +13,12 @@ import {
|
||||||
useConnectedWallet,
|
useConnectedWallet,
|
||||||
} from "@terra-money/wallet-provider";
|
} from "@terra-money/wallet-provider";
|
||||||
import { formatUnits } from "ethers/lib/utils";
|
import { formatUnits } from "ethers/lib/utils";
|
||||||
import React, { useCallback, useMemo, useState } from "react";
|
import React, { useCallback, useMemo, useRef, useState } from "react";
|
||||||
import { createParsedTokenAccount } from "../../hooks/useGetSourceParsedTokenAccounts";
|
import { createParsedTokenAccount } from "../../hooks/useGetSourceParsedTokenAccounts";
|
||||||
import useTerraNativeBalances from "../../hooks/useTerraNativeBalances";
|
import useTerraNativeBalances from "../../hooks/useTerraNativeBalances";
|
||||||
import useTerraTokenMap, {
|
import { TerraTokenMetadata } from "../../hooks/useTerraTokenMap";
|
||||||
TerraTokenMetadata,
|
|
||||||
} from "../../hooks/useTerraTokenMap";
|
|
||||||
import { ParsedTokenAccount } from "../../store/transferSlice";
|
import { ParsedTokenAccount } from "../../store/transferSlice";
|
||||||
import { TERRA_HOST } from "../../utils/consts";
|
import { SUPPORTED_TERRA_TOKENS, TERRA_HOST } from "../../utils/consts";
|
||||||
import { shortenAddress } from "../../utils/solana";
|
import { shortenAddress } from "../../utils/solana";
|
||||||
import {
|
import {
|
||||||
formatNativeDenom,
|
formatNativeDenom,
|
||||||
|
@ -110,7 +108,7 @@ export default function TerraSourceTokenSelector(
|
||||||
) {
|
) {
|
||||||
const classes = useStyles();
|
const classes = useStyles();
|
||||||
const { onChange, value, disabled, resetAccounts } = props;
|
const { onChange, value, disabled, resetAccounts } = props;
|
||||||
const tokenMap = useTerraTokenMap();
|
// const tokenMap = useTerraTokenMap();
|
||||||
const [advancedMode, setAdvancedMode] = useState(false);
|
const [advancedMode, setAdvancedMode] = useState(false);
|
||||||
const [advancedModeHolderString, setAdvancedModeHolderString] = useState("");
|
const [advancedModeHolderString, setAdvancedModeHolderString] = useState("");
|
||||||
const [advancedModeError, setAdvancedModeError] = useState("");
|
const [advancedModeError, setAdvancedModeError] = useState("");
|
||||||
|
@ -125,16 +123,22 @@ export default function TerraSourceTokenSelector(
|
||||||
[setAutocompleteString]
|
[setAutocompleteString]
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const nativeRefresh = useRef<() => void>(() => {});
|
||||||
|
|
||||||
|
const { balances, isLoading: nativeIsLoading } = useTerraNativeBalances(
|
||||||
|
terraWallet?.walletAddress,
|
||||||
|
nativeRefresh
|
||||||
|
);
|
||||||
|
|
||||||
const resetAccountWrapper = useCallback(() => {
|
const resetAccountWrapper = useCallback(() => {
|
||||||
setAdvancedModeHolderString("");
|
setAdvancedModeHolderString("");
|
||||||
setAdvancedModeError("");
|
setAdvancedModeError("");
|
||||||
setAutocompleteString("");
|
setAutocompleteString("");
|
||||||
resetAccounts && resetAccounts();
|
resetAccounts && resetAccounts();
|
||||||
|
nativeRefresh.current();
|
||||||
}, [resetAccounts]);
|
}, [resetAccounts]);
|
||||||
|
|
||||||
const isLoading = tokenMap?.isFetching || false;
|
const isLoading = nativeIsLoading; // || (tokenMap?.isFetching || false);
|
||||||
|
|
||||||
const { balances } = useTerraNativeBalances(terraWallet?.walletAddress);
|
|
||||||
|
|
||||||
const terraTokenArray = useMemo(() => {
|
const terraTokenArray = useMemo(() => {
|
||||||
const balancesItems = balances
|
const balancesItems = balances
|
||||||
|
@ -149,10 +153,16 @@ export default function TerraSourceTokenSelector(
|
||||||
} as TerraTokenMetadata)
|
} as TerraTokenMetadata)
|
||||||
)
|
)
|
||||||
: [];
|
: [];
|
||||||
const values = tokenMap.data?.mainnet;
|
return balancesItems.filter((metadata) =>
|
||||||
const tokenMapItems = Object.values(values || {}) || [];
|
SUPPORTED_TERRA_TOKENS.includes(metadata.token)
|
||||||
return [...balancesItems, ...tokenMapItems];
|
);
|
||||||
}, [balances, tokenMap]);
|
// const values = tokenMap.data?.mainnet;
|
||||||
|
// const tokenMapItems = Object.values(values || {}) || [];
|
||||||
|
// return [...balancesItems, ...tokenMapItems];
|
||||||
|
}, [
|
||||||
|
balances,
|
||||||
|
// tokenMap
|
||||||
|
]);
|
||||||
|
|
||||||
const valueToOption = (fromProps: ParsedTokenAccount | undefined | null) => {
|
const valueToOption = (fromProps: ParsedTokenAccount | undefined | null) => {
|
||||||
if (!fromProps) return null;
|
if (!fromProps) return null;
|
||||||
|
@ -323,8 +333,11 @@ export default function TerraSourceTokenSelector(
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<React.Fragment>
|
<React.Fragment>
|
||||||
{isLoading && <CircularProgress />}
|
{isLoading && !value && !advancedMode ? (
|
||||||
{wrappedContent}
|
<CircularProgress />
|
||||||
|
) : (
|
||||||
|
wrappedContent
|
||||||
|
)}
|
||||||
{advancedModeError && (
|
{advancedModeError && (
|
||||||
<Typography color="error">{advancedModeError}</Typography>
|
<Typography color="error">{advancedModeError}</Typography>
|
||||||
)}
|
)}
|
||||||
|
|
|
@ -1,15 +1,27 @@
|
||||||
import { LCDClient } from "@terra-money/terra.js";
|
import { LCDClient } from "@terra-money/terra.js";
|
||||||
import { useEffect, useMemo, useState } from "react";
|
import { MutableRefObject, useEffect, useMemo, useState } from "react";
|
||||||
import { TERRA_HOST } from "../utils/consts";
|
import { TERRA_HOST } from "../utils/consts";
|
||||||
|
|
||||||
export interface TerraNativeBalances {
|
export interface TerraNativeBalances {
|
||||||
[index: string]: string;
|
[index: string]: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function useTerraNativeBalances(walletAddress?: string) {
|
export default function useTerraNativeBalances(
|
||||||
|
walletAddress?: string,
|
||||||
|
refreshRef?: MutableRefObject<() => void>
|
||||||
|
) {
|
||||||
const [isLoading, setIsLoading] = useState(true);
|
const [isLoading, setIsLoading] = useState(true);
|
||||||
const [balances, setBalances] = useState<TerraNativeBalances | undefined>({});
|
const [balances, setBalances] = useState<TerraNativeBalances | undefined>({});
|
||||||
|
const [refresh, setRefresh] = useState(false);
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
if (refreshRef) {
|
||||||
|
refreshRef.current = () => {
|
||||||
|
setRefresh(true);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}, [refreshRef]);
|
||||||
|
useEffect(() => {
|
||||||
|
setRefresh(false);
|
||||||
if (walletAddress) {
|
if (walletAddress) {
|
||||||
setIsLoading(true);
|
setIsLoading(true);
|
||||||
setBalances(undefined);
|
setBalances(undefined);
|
||||||
|
@ -37,7 +49,7 @@ export default function useTerraNativeBalances(walletAddress?: string) {
|
||||||
setIsLoading(false);
|
setIsLoading(false);
|
||||||
setBalances(undefined);
|
setBalances(undefined);
|
||||||
}
|
}
|
||||||
}, [walletAddress]);
|
}, [walletAddress, refresh]);
|
||||||
const value = useMemo(() => ({ isLoading, balances }), [isLoading, balances]);
|
const value = useMemo(() => ({ isLoading, balances }), [isLoading, balances]);
|
||||||
return value;
|
return value;
|
||||||
}
|
}
|
||||||
|
|
|
@ -463,3 +463,5 @@ export const ETH_MIGRATION_ASSET_MAP = new Map<string, string>(
|
||||||
// ],
|
// ],
|
||||||
]
|
]
|
||||||
);
|
);
|
||||||
|
|
||||||
|
export const SUPPORTED_TERRA_TOKENS = ["uluna", "uusd"];
|
||||||
|
|
Loading…
Reference in New Issue