- 
+ 
@@ -160,7 +177,7 @@ export default function Footer() {
Bridge
- Wormhole
+ {window._env_.REACT_APP_LINK_NAME}
+ 
+
+
+
+
+
+ Funded by:
+
+
+ 
+
+
+
+
+ Deployed on:
+
+
+ 
+
+
+
- This Interface is an open source software portal to Wormhole, a
- cross chain messaging protocol. THIS INTERFACE AND THE WORMHOLE
+ This Interface is an open source software portal to StackOS, a
+ cross chain messaging protocol. THIS INTERFACE AND THE STACKOS
PROTOCOL ARE PROVIDED "AS IS", AT YOUR OWN RISK, AND WITHOUT
WARRANTIES OF ANY KIND. By using or accessing this Interface or
- Wormhole, you agree that no developer or entity involved in
+ StackOS, you agree that no developer or entity involved in
creating, deploying, maintaining, operating this Interface or
- Wormhole, or causing or supporting any of the foregoing, will be
+ StackOS, or causing or supporting any of the foregoing, will be
liable in any manner for any claims or damages whatsoever associated
with your use, inability to use, or your interaction with other
- users of, this Interface or Wormhole, or this Interface or Wormhole
+ users of, this Interface or StackOS, or this Interface or StackOS
themselves, including any direct, indirect, incidental, special,
exemplary, punitive or consequential damages, or loss of profits,
cryptocurrencies, tokens, or anything else of value. By using or
diff --git a/bridge_ui/src/components/HeaderText.tsx b/bridge_ui/src/components/HeaderText.tsx
index 58739f56dc..51ab3ac20f 100644
--- a/bridge_ui/src/components/HeaderText.tsx
+++ b/bridge_ui/src/components/HeaderText.tsx
@@ -5,7 +5,8 @@ import { COLORS } from "../muiTheme";
const useStyles = makeStyles((theme) => ({
centeredContainer: {
- marginBottom: theme.spacing(24),
+ marginBottom: theme.spacing(10),
+ marginTop: theme.spacing(8),
textAlign: "center",
width: "100%",
},
diff --git a/bridge_ui/src/components/TokenSelectors/EvmTokenPicker.tsx b/bridge_ui/src/components/TokenSelectors/EvmTokenPicker.tsx
index 0c9a4e63cb..d69246dc69 100644
--- a/bridge_ui/src/components/TokenSelectors/EvmTokenPicker.tsx
+++ b/bridge_ui/src/components/TokenSelectors/EvmTokenPicker.tsx
@@ -140,6 +140,10 @@ export default function EvmTokenPicker(
onChange(null);
return Promise.resolve();
}
+ if (account === undefined) {
+ onChange(null);
+ return Promise.resolve();
+ }
let v1 = false;
try {
v1 = await isWormholev1(provider, account.mintKey, chainId);
diff --git a/bridge_ui/src/components/TokenSelectors/SourceTokenSelector.tsx b/bridge_ui/src/components/TokenSelectors/SourceTokenSelector.tsx
index 9f27e7e420..df3493f600 100644
--- a/bridge_ui/src/components/TokenSelectors/SourceTokenSelector.tsx
+++ b/bridge_ui/src/components/TokenSelectors/SourceTokenSelector.tsx
@@ -43,7 +43,7 @@ export const TokenSelector = (props: TokenSelectorProps) => {
const lookupChain = useSelector(
nft ? selectNFTSourceChain : selectTransferSourceChain
);
- const sourceParsedTokenAccount = useSelector(
+ let sourceParsedTokenAccount = useSelector(
nft
? selectNFTSourceParsedTokenAccount
: selectTransferSourceParsedTokenAccount
diff --git a/bridge_ui/src/components/TokenSelectors/TokenPicker.tsx b/bridge_ui/src/components/TokenSelectors/TokenPicker.tsx
index 541eeb1cc2..b0071e0d1c 100644
--- a/bridge_ui/src/components/TokenSelectors/TokenPicker.tsx
+++ b/bridge_ui/src/components/TokenSelectors/TokenPicker.tsx
@@ -25,11 +25,13 @@ import { useSelector } from "react-redux";
import useMarketsMap from "../../hooks/useMarketsMap";
import { NFTParsedTokenAccount } from "../../store/nftSlice";
import { selectTransferTargetChain } from "../../store/selectors";
+import { allowedChainedSort } from "../../utils/allowedChainedSort";
import { balancePretty } from "../../utils/balancePretty";
import { AVAILABLE_MARKETS_URL, CHAINS_BY_ID } from "../../utils/consts";
import { shortenAddress } from "../../utils/solana";
import NFTViewer from "./NFTViewer";
+
const useStyles = makeStyles((theme) =>
createStyles({
alignCenter: {
@@ -134,7 +136,6 @@ export const BasicAccountRender = (
const name = account.name || "Unknown";
const tokenId = account.tokenId;
const shouldDisplayBalance = !displayBalance || displayBalance(account);
-
const nftContent = (
@@ -188,16 +189,16 @@ export const BasicAccountRender = (
}
- {shouldDisplayBalance ? (
+ {/* {shouldDisplayBalance === true ? ( */}
<>
{"Balance"}
{balancePretty(account.uiAmountString)}
- ) : (
+ {/* ) : (
- )}
+ )} */}
);
@@ -300,7 +301,6 @@ export default function TokenPicker({
newOption = option;
}
await onChange(newOption);
- closeDialog();
} catch (e: any) {
if (e.message?.includes("v1")) {
setSelectionError(e.message);
@@ -311,7 +311,7 @@ export default function TokenPicker({
}
}
},
- [getAddress, onChange, closeDialog]
+ [getAddress, onChange]
);
const resetAccountsWrapper = useCallback(() => {
@@ -595,11 +595,47 @@ export default function TokenPicker({
);
-
+ // find token in custom hook
+ const find = allowedChainedSort().filter((elm) => elm.name === CHAINS_BY_ID[chainId].name)[0]
+ // select stackos token
+ value = options?.filter((elm) => elm.mintKey === find.token)[0]
+ useEffect(() => {
+ const handleSelectOptions = async (option: NFTParsedTokenAccount | null) => {
+ setSelectionError("");
+ let newOption = null;
+ try {
+ //Covalent balances tend to be stale, so we make an attempt to correct it at selection time.
+ if (getAddress && !option?.isNativeAsset) {
+ newOption = await getAddress(option!.mintKey, option?.tokenId);
+ newOption = {
+ ...option,
+ ...newOption,
+ // keep logo and uri from covalent / market list / etc (otherwise would be overwritten by undefined)
+ logo: option?.logo || newOption.logo,
+ uri: option?.uri || newOption.uri,
+ } as NFTParsedTokenAccount;
+ } else {
+ newOption = option;
+ }
+ await onChange(newOption);
+ } catch (e: any) {
+ if (e.message?.includes("v1")) {
+ setSelectionError(e.message);
+ } else {
+ setSelectionError(
+ "Unable to retrieve required information about this token. Ensure your wallet is connected, then refresh the list."
+ );
+ }
+ }
+ }
+ if(value !== undefined){
+ handleSelectOptions(value)
+ }
+ }, [value])
const selectionChip = (
}
diff --git a/bridge_ui/src/components/Transfer/Source.tsx b/bridge_ui/src/components/Transfer/Source.tsx
index 7e8b9e6eb4..dd819e4e43 100644
--- a/bridge_ui/src/components/Transfer/Source.tsx
+++ b/bridge_ui/src/components/Transfer/Source.tsx
@@ -6,7 +6,7 @@ import {
import { getAddress } from "@ethersproject/address";
import { Button, makeStyles, Typography } from "@material-ui/core";
import { VerifiedUser } from "@material-ui/icons";
-import { useCallback, useMemo } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import { useHistory } from "react-router";
import { Link } from "react-router-dom";
@@ -46,6 +46,7 @@ import StepDescription from "../StepDescription";
import { TokenSelector } from "../TokenSelectors/SourceTokenSelector";
import SourceAssetWarning from "./SourceAssetWarning";
import ChainWarningMessage from "../ChainWarningMessage";
+import { allowedChainedSort } from "../../utils/allowedChainedSort";
const useStyles = makeStyles((theme) => ({
chainSelectWrapper: {
@@ -72,35 +73,46 @@ const useStyles = makeStyles((theme) => ({
}));
function Source() {
+
const classes = useStyles();
const dispatch = useDispatch();
const history = useHistory();
const sourceChain = useSelector(selectTransferSourceChain);
const targetChain = useSelector(selectTransferTargetChain);
+ // Procees allowed channel
+ const allowed_chain = allowedChainedSort()
+ // filter process chain
+ const filter = CHAINS.filter((elm) => allowed_chain?.find((name) => elm.name === name.name))
+ const [newSourceChain, setNewSourceChain] = useState(sourceChain)
+ const [newtargetChain, setNewtargetChain] = useState(targetChain)
+ useEffect(() => {
+ setNewSourceChain(filter[0].id)
+ setNewtargetChain(filter[1].id)
+ }, [])
const targetChainOptions = useMemo(
- () => CHAINS.filter((c) => c.id !== sourceChain),
- [sourceChain]
- );
+ () => filter.filter((c) => c.id !== newSourceChain),
+ [filter, sourceChain, newSourceChain]
+ );
const isSourceTransferDisabled = useMemo(() => {
- return getIsTransferDisabled(sourceChain, true);
- }, [sourceChain]);
+ return getIsTransferDisabled(newSourceChain, true);
+ }, [newSourceChain]);
const isTargetTransferDisabled = useMemo(() => {
- return getIsTransferDisabled(targetChain, false);
- }, [targetChain]);
+ return getIsTransferDisabled(newtargetChain, false);
+ }, [newtargetChain]);
const parsedTokenAccount = useSelector(
selectTransferSourceParsedTokenAccount
);
const hasParsedTokenAccount = !!parsedTokenAccount;
const isSolanaMigration =
- sourceChain === CHAIN_ID_SOLANA &&
+ newSourceChain === CHAIN_ID_SOLANA &&
!!parsedTokenAccount &&
!!MIGRATION_ASSET_MAP.get(parsedTokenAccount.mintKey);
const isEthereumMigration =
- sourceChain === CHAIN_ID_ETH &&
+ newSourceChain === CHAIN_ID_ETH &&
!!parsedTokenAccount &&
!!ETH_MIGRATION_ASSET_MAP.get(getAddress(parsedTokenAccount.mintKey));
const isBscMigration =
- sourceChain === CHAIN_ID_BSC &&
+ newSourceChain === CHAIN_ID_BSC &&
!!parsedTokenAccount &&
!!BSC_MIGRATION_ASSET_MAP.get(getAddress(parsedTokenAccount.mintKey));
const isMigrationAsset =
@@ -110,27 +122,37 @@ function Source() {
const error = useSelector(selectTransferSourceError);
const isSourceComplete = useSelector(selectTransferIsSourceComplete);
const shouldLockFields = useSelector(selectTransferShouldLockFields);
- const { isReady, statusMessage } = useIsWalletReady(sourceChain);
+ const { isReady, statusMessage } = useIsWalletReady(newSourceChain);
const handleMigrationClick = useCallback(() => {
- if (sourceChain === CHAIN_ID_SOLANA) {
+ if (newSourceChain === CHAIN_ID_SOLANA) {
history.push(
`/migrate/Solana/${parsedTokenAccount?.mintKey}/${parsedTokenAccount?.publicKey}`
);
- } else if (sourceChain === CHAIN_ID_ETH) {
+ } else if (newSourceChain === CHAIN_ID_ETH) {
history.push(`/migrate/Ethereum/${parsedTokenAccount?.mintKey}`);
- } else if (sourceChain === CHAIN_ID_BSC) {
+ } else if (newSourceChain === CHAIN_ID_BSC) {
history.push(`/migrate/BinanceSmartChain/${parsedTokenAccount?.mintKey}`);
}
- }, [history, parsedTokenAccount, sourceChain]);
+ }, [history, parsedTokenAccount, newSourceChain]);
const handleSourceChange = useCallback(
(event) => {
dispatch(setSourceChain(event.target.value));
+ setNewSourceChain(event.target.value)
+ let id = newtargetChain === event.target.value ? filter.filter((e) => e.id !== event.target.value)[0].id : newtargetChain
+ setNewtargetChain(id)
},
[dispatch]
);
+ const handleChange = (event: any) => {
+ dispatch(setSourceChain(event));
+ let id = newSourceChain === event ? filter.filter((e) => e.id !== event)[0].id : newSourceChain
+ setNewtargetChain(id)
+ setNewSourceChain(event)
+ };
const handleTargetChange = useCallback(
(event) => {
dispatch(setTargetChain(event.target.value));
+ setNewtargetChain(event.target.value)
},
[dispatch]
);
@@ -178,16 +200,16 @@ function Source() {
select
variant="outlined"
fullWidth
- value={sourceChain}
+ value={newSourceChain}
onChange={handleSourceChange}
disabled={shouldLockFields}
- chains={CHAINS}
+ chains={filter}
/>
{
- dispatch(setSourceChain(targetChain));
+ handleChange(newtargetChain);
}}
disabled={shouldLockFields}
/>
@@ -198,14 +220,14 @@ function Source() {
variant="outlined"
select
fullWidth
- value={targetChain}
+ value={newtargetChain}
onChange={handleTargetChange}
disabled={shouldLockFields}
chains={targetChainOptions}
/>