- Network:{" "}
+
+ Network:{' '}
- {connected && }
+ {connected && (
+
+ )}
>
);
diff --git a/packages/bridge/src/components/TokenDisplay/index.tsx b/packages/bridge/src/components/TokenDisplay/index.tsx
index 3d13d2e..4afcd66 100644
--- a/packages/bridge/src/components/TokenDisplay/index.tsx
+++ b/packages/bridge/src/components/TokenDisplay/index.tsx
@@ -3,12 +3,32 @@ import { TokenInfo } from '@solana/spl-token-registry';
import { debug } from 'console';
import React from 'react';
import { useEthereum } from '../../contexts';
-import { ASSET_CHAIN } from "../../models/bridge/constants";
+import { ASSET_CHAIN } from '../../models/bridge/constants';
import './style.less';
-export const TokenDisplay = ({ asset, chain, token, logo }: { asset?: string, chain?: ASSET_CHAIN, token?: TokenInfo, logo?: string }) => {
- return
+export const TokenDisplay = ({
+ asset,
+ chain,
+ token,
+ logo,
+}: {
+ asset?: string;
+ chain?: ASSET_CHAIN;
+ token?: TokenInfo;
+ logo?: string;
+}) => {
+ return (
+
-
-
;
-}
+
+
+ );
+};
diff --git a/packages/bridge/src/components/Transfer/index.tsx b/packages/bridge/src/components/Transfer/index.tsx
index 9f72ce4..c20ea68 100644
--- a/packages/bridge/src/components/Transfer/index.tsx
+++ b/packages/bridge/src/components/Transfer/index.tsx
@@ -3,13 +3,19 @@ import { Card, notification, Spin, Button } from 'antd';
import { TokenInfo } from '@uniswap/token-lists';
import { LAMPORTS_PER_SOL } from '@solana/web3.js';
import { LABELS } from '../../constants';
-import { contexts, utils, ConnectButton, programIds, formatAmount } from '@oyster/common';
-import { useHistory, useLocation } from "react-router-dom";
-import { SolanaInput, EthereumInput } from "./../Input";
+import {
+ contexts,
+ utils,
+ ConnectButton,
+ programIds,
+ formatAmount,
+} from '@oyster/common';
+import { useHistory, useLocation } from 'react-router-dom';
+import { EthereumInput } from './../Input';
import './style.less';
import { ethers } from 'ethers';
-import { ASSET_CHAIN } from '../../utils/assets';
+import { ASSET_CHAIN, chainToName } from '../../utils/assets';
import { BigNumber } from 'ethers/utils';
import { Erc20Factory } from '../../contracts/Erc20Factory';
import { ProgressUpdate, transfer, TransferRequest } from '../../models/bridge';
@@ -18,132 +24,208 @@ import { TokenDisplay } from './../TokenDisplay';
const { useConnection } = contexts.Connection;
const { useWallet } = contexts.Wallet;
-const { notify } = utils;
export const typeToIcon = (type: string, isLast: boolean) => {
- const style: React.CSSProperties = { marginRight: 5 }
- switch(type) {
- case "user": return
🪓 ;
- case "done": return
✅ ;
- case "error": return
❌ ;
- case "wait": return isLast ?
:
✅ ;
- default: return null;
+ const style: React.CSSProperties = { marginRight: 5 };
+ switch (type) {
+ case 'user':
+ return
🪓 ;
+ case 'done':
+ return
✅ ;
+ case 'error':
+ return
❌ ;
+ case 'wait':
+ return isLast ?
:
✅ ;
+ default:
+ return null;
}
-}
+};
export const Transfer = () => {
const connection = useConnection();
const { wallet } = useWallet();
- const { provider, tokenMap } = useEthereum();
+ const { provider, tokenMap, tokens } = useEthereum();
const [request, setRequest] = useState
({
- // TODO: update based on selected asset
+ asset: tokens?.[0]?.address,
from: ASSET_CHAIN.Ethereum,
toChain: ASSET_CHAIN.Solana,
});
- const [toToken, setToToken] = useState()
- const setAssetInformation = (asset:string) => {
- request.asset = asset;
- setRequest(request)
-
- setToToken(tokenMap.get(request?.asset || ""))
- }
+ const setAssetInformation = (asset: string) => {
+ setRequest({
+ ...request,
+ asset,
+ });
+ };
return (
<>
-
-
+ { request.info = info }}
- asset={request.asset}
- setAsset={(asset) => setAssetInformation(asset)}
- amount={request.amount}
- onInputChange={(amount) => {
- request.amount = amount || 0;
+ setInfo={info => {
+ request.info = info;
+ }}
+ asset={request.asset}
+ chain={request.from}
+ setAsset={asset => setAssetInformation(asset)}
+ amount={request.amount}
+ onInputChange={amount => {
+ setRequest({
+ ...request,
+ amount: amount || 0,
+ });
}}
- />
-
- {}}
/>
-
- {
- if(!wallet || !provider) {
- return;
- }
+
+ {
+ request.info = info;
+ }}
+ asset={request.asset}
+ chain={request.toChain}
+ hideBalance={true}
+ setAsset={asset => setAssetInformation(asset)}
+ amount={request.amount}
+ onInputChange={amount => {
+ setRequest({
+ ...request,
+ amount: amount || 0,
+ });
+ }}
+ />
+
+