Skip to content

multiChainAndAsset #91

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
sanchaymittal wants to merge 5 commits into
base: main
Choose a base branch
from
Draft

multiChainAndAsset #91

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
b422b1a
🏷️ update types
sanchaymittal Apr 1, 2021
46e5941
chg: getChain func for multiasset support
sanchaymittal Apr 1, 2021
d61ef52
add: example for sdk
sanchaymittal Apr 1, 2021
edd9389
multiasset support
sanchaymittal Apr 1, 2021
469eda6
Merge branch 'main' into multiChainAndAsset
sanchaymittal Apr 5, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
184 changes: 103 additions & 81 deletions example/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,116 +1,138 @@
import 'react-app-polyfill/ie11';
import 'regenerator-runtime/runtime';
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { Magic } from 'magic-sdk';
import { providers } from 'ethers';
import "react-app-polyfill/ie11";
import "regenerator-runtime/runtime";
import * as React from "react";
import * as ReactDOM from "react-dom";
import { Magic } from "magic-sdk";
import { providers } from "ethers";
import { ConnextSdk, ERC20Abi } from "@connext/vector-sdk";
import { ConnextModal } from "@connext/vector-modal";

const connextSdk = new ConnextSdk();
const webProvider = new providers.Web3Provider((window as any).ethereum);
// Test key defaults to "rinkeby", live key defaults to "mainnet"

import { ConnextModal } from '@connext/vector-modal';
async function init() {
const network = await webProvider.getNetwork();
console.log(network);
try {
await connextSdk.init({
routerPublicIdentifier: "vector7tbbTxQp8ppEQUgPsbGiTrVdapLdU5dH7zTbVuXRf1M4CEBU9Q", // Router Public Identifier
loginProvider: webProvider, // Web3/JsonRPCProvider
senderChainProvider: "https://goerli.infura.io/v3/af2f28bdb95d40edb06226a46106f5f9", // Rpc Provider Link
senderAssetId: "0xbd69fC70FA1c3AED524Bb4E82Adc5fcCFFcD79Fa", // Asset/Token Address on Sender Chain
recipientChainProvider: "https://rpc-mumbai.matic.today", // Rpc Provider Link
recipientAssetId: "0xfe4F5145f6e09952a5ba9e956ED0C25e3Fa4c7F1", // Asset/Token Address on Recipient Chain
});
} catch (e) {
const message = "Error initalizing";
console.log(e, message);
throw e;
}
}

type LoginType = 'none' | 'metamask' | 'magic';
const magic = new Magic('pk_test_D646A81EA4676AB2', {
network: 'rinkeby', // Supports "rinkeby", "ropsten", "kovan"
type LoginType = "none" | "metamask" | "magic";
const magic = new Magic("pk_test_D646A81EA4676AB2", {
network: "rinkeby", // Supports "rinkeby", "ropsten", "kovan"
});

function App() {
const [showModal, setShowModal] = React.useState(false);
const [
loginProvider,
_setLoginProvider,
] = React.useState<providers.Web3Provider>();
const [loginType, setLoginType] = React.useState<LoginType>('none');
const [loginProvider, _setLoginProvider] = React.useState<providers.Web3Provider>();
const [loginType, setLoginType] = React.useState<LoginType>("none");
const [transferAmount, setTransferAmount] = React.useState<string>();

const setLoginProvider = async (loginType: LoginType) => {
let provider: providers.Web3Provider | undefined;
if (loginType === 'metamask') {
if (loginType === "metamask") {
if (!(window as any).ethereum) {
throw new Error('Web3 not available');
throw new Error("Web3 not available");
}
provider = (window as any).ethereum;
} else if (loginType === 'magic') {
} else if (loginType === "magic") {
provider = magic.rpcProvider as any;
}
_setLoginProvider(provider);
};

const handleLoginProvider = async () => {
if (loginType === 'metamask') {
if (loginType === "metamask") {
const provider = new providers.Web3Provider(loginProvider as any);
const accounts = await provider.send('eth_requestAccounts', []);
console.log('accounts: ', accounts);
} else if (loginType === 'magic') {
await magic.auth.loginWithMagicLink({ email: 'rksethuram9@gmail.com' });
const accounts = await provider.send("eth_requestAccounts", []);
console.log("accounts: ", accounts);
} else if (loginType === "magic") {
await magic.auth.loginWithMagicLink({ email: "rksethuram9@gmail.com" });
const provider = new providers.Web3Provider(loginProvider as any);
const signer = provider.getSigner();
const address = await signer.getAddress();
console.log('address: ', address);
console.log("address: ", address);
}
};

return (
<>
<div
onChange={async (event) => {
console.log('event: ', event.target);
setLoginType((event.target as any).value);
await setLoginProvider((event.target as any).value);
}}
>
<input type="radio" value="metamask" name="loginType" /> Metamask
<input type="radio" value="magic" name="loginType" /> Magic
<input type="radio" value="none" name="loginType" defaultChecked /> None
<div>
<h1>Modal</h1>
<div
onChange={async (event) => {
console.log("event: ", event.target);
setLoginType((event.target as any).value);
await setLoginProvider((event.target as any).value);
}}
>
<input type="radio" value="metamask" name="loginType" /> Metamask
<input type="radio" value="magic" name="loginType" /> Magic
<input type="radio" value="none" name="loginType" defaultChecked /> None
</div>
<input type="number" defaultChecked onChange={(event) => setTransferAmount(event.target.value)} /> Transfer
Amount
<br />
<button
onClick={async () => {
try {
await handleLoginProvider();
} catch (e) {
console.error("Error logging in: ", e);
return;
}
setShowModal(true);
}}
>
Show Modal
</button>
<ConnextModal
showModal={showModal}
onClose={() => setShowModal(false)}
onReady={(params) => console.log("MODAL IS READY =======>", params)}
onFinished={(params) => console.log("On finish ==>", params)}
// onSwap={(params) => {
// console.log('onSwap params: ', params);
// throw new Error(params);
// }}
transferAmount={transferAmount}
withdrawalAddress={"0x75e4DD0587663Fce5B2D9aF7fbED3AC54342d3dB"}
loginProvider={loginProvider}
injectedProvider={loginProvider}
// prod config
routerPublicIdentifier="vector7tbbTxQp8ppEQUgPsbGiTrVdapLdU5dH7zTbVuXRf1M4CEBU9Q"
depositAssetId={"0xbd69fC70FA1c3AED524Bb4E82Adc5fcCFFcD79Fa"}
depositChainProvider="https://goerli.infura.io/v3/af2f28bdb95d40edb06226a46106f5f9"
withdrawAssetId={"0xfe4F5145f6e09952a5ba9e956ED0C25e3Fa4c7F1"}
withdrawChainProvider="https://rpc-mumbai.matic.today"
// local config
// routerPublicIdentifier="vector8Uz1BdpA9hV5uTm6QUv5jj1PsUyCH8m8ciA94voCzsxVmrBRor"
// depositAssetId={'0x9FBDa871d559710256a2502A2517b794B482Db40'}
// depositChainProvider="http://localhost:8545"
// withdrawAssetId={'0x9FBDa871d559710256a2502A2517b794B482Db40'}
// withdrawChainProvider="http://localhost:8546"
/>
</div>

<div>
<h1>SDK</h1>
<button onClick={init}>Init</button>
</div>
<input
type="number"
defaultChecked
onChange={(event) => setTransferAmount(event.target.value)}
/>{' '}
Transfer Amount
<br />
<button
onClick={async () => {
try {
await handleLoginProvider();
} catch (e) {
console.error('Error logging in: ', e);
return;
}
setShowModal(true);
}}
>
Show Modal
</button>
<ConnextModal
showModal={showModal}
onClose={() => setShowModal(false)}
onReady={(params) => console.log('MODAL IS READY =======>', params)}
onFinished={(params) => console.log('On finish ==>', params)}
// onSwap={(params) => {
// console.log('onSwap params: ', params);
// throw new Error(params);
// }}
transferAmount={transferAmount}
withdrawalAddress={'0x75e4DD0587663Fce5B2D9aF7fbED3AC54342d3dB'}
loginProvider={loginProvider}
injectedProvider={loginProvider}
// prod config
routerPublicIdentifier="vector7tbbTxQp8ppEQUgPsbGiTrVdapLdU5dH7zTbVuXRf1M4CEBU9Q"
depositAssetId={'0xbd69fC70FA1c3AED524Bb4E82Adc5fcCFFcD79Fa'}
depositChainProvider="https://goerli.infura.io/v3/af2f28bdb95d40edb06226a46106f5f9"
withdrawAssetId={'0xfe4F5145f6e09952a5ba9e956ED0C25e3Fa4c7F1'}
withdrawChainProvider="https://rpc-mumbai.matic.today"
// local config
// routerPublicIdentifier="vector8Uz1BdpA9hV5uTm6QUv5jj1PsUyCH8m8ciA94voCzsxVmrBRor"
// depositAssetId={'0x9FBDa871d559710256a2502A2517b794B482Db40'}
// depositChainProvider="http://localhost:8545"
// withdrawAssetId={'0x9FBDa871d559710256a2502A2517b794B482Db40'}
// withdrawChainProvider="http://localhost:8546"
/>
</>
);
}

ReactDOM.render(<App />, document.getElementById('root'));
ReactDOM.render(<App />, document.getElementById("root"));
24 changes: 19 additions & 5 deletions modules/sdk/src/constants/types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,26 +20,33 @@ export interface CHAIN_DETAIL {
chainId: number;
chainProvider: string;
rpcProvider: providers.JsonRpcProvider;
assetName: string;
assetId: string;
assetDecimals: number;
chainParams: AddEthereumChainParameter;
}

export interface ASSET_DETAIL {
name: string;
assetId: string;
decimals: number;
}

export type SetupParamsSchema = {
routerPublicIdentifier: string; // "vectorA876de..."
loginProvider: any;
senderChainProvider: string;
senderAssetId: string;
recipientChainProvider: string;
recipientAssetId: string;
senderChainId?: number;
recipientChainId?: number;
iframeSrcOverride?: string;
};

export type InitParamsSchema = SetupParamsSchema;

export type preTransferCheckParamsSchema = {
transferAmount: string;
senderAssetId: string;
recipientAssetId: string;
};

export type CheckPendingTransferResponseSchema = {
offChainSenderChainAssetBalanceBn: BigNumber;
offChainRecipientChainAssetBalanceBn: BigNumber;
Expand All @@ -48,6 +55,8 @@ export type CheckPendingTransferResponseSchema = {
export type InitResponseSchema = CheckPendingTransferResponseSchema;
export type EstimateFeeParamsSchema = {
transferAmount: string | undefined;
senderAssetId: string;
recipientAssetId: string;
isRecipientAssetInput?: boolean;
userBalanceWei?: string;
};
Expand All @@ -63,13 +72,16 @@ export type EstimateFeeResponseSchema = {
export type DepositParamsSchema = {
transferAmount: string;
webProvider: providers.Web3Provider;
senderAssetId: string;
recipientAssetId: string;
preTransferCheck?: boolean;
// callback
onDeposited?: (txHash: string) => void;
};

export type WithdrawParamsSchema = {
recipientAddress: string;
recipientAssetId: string;
onFinished?: (txHash: string, amountUi?: string, amountBn?: BigNumber) => void;
withdrawalCallTo?: string;
withdrawalCallData?: string;
Expand All @@ -78,6 +90,8 @@ export type WithdrawParamsSchema = {

export type TransferParamsSchema = {
transferQuote?: TransferQuote;
senderAssetId: string;
recipientAssetId: string;
// Callbacks
onTransferred?: () => void;
};
Expand Down
Loading