added wallet connect adapter

2021-03-19 13:34:53 -05:00 · 2021-03-19 13:34:53 -05:00 · 5eed226ed8
parent bf5ca53102
commit 5eed226ed8
9 changed files with 53 additions and 21 deletions
--- a/packages/bridge/public/blockchains/walletconnect.svg
+++ b/packages/bridge/public/blockchains/walletconnect.svg
@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="300px" height="185px" viewBox="0 0 300 185" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 49.3 (51167) - http://www.bohemiancoding.com/sketch -->
+    <title>WalletConnect</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="walletconnect-logo-alt" fill="#3B99FC" fill-rule="nonzero">
+            <path d="M61.4385429,36.2562612 C110.349767,-11.6319051 189.65053,-11.6319051 238.561752,36.2562612 L244.448297,42.0196786 C246.893858,44.4140867 246.893858,48.2961898 244.448297,50.690599 L224.311602,70.406102 C223.088821,71.6033071 221.106302,71.6033071 219.883521,70.406102 L211.782937,62.4749541 C177.661245,29.0669724 122.339051,29.0669724 88.2173582,62.4749541 L79.542302,70.9685592 C78.3195204,72.1657633 76.337001,72.1657633 75.1142214,70.9685592 L54.9775265,51.2530561 C52.5319653,48.8586469 52.5319653,44.9765439 54.9775265,42.5821357 L61.4385429,36.2562612 Z M280.206339,77.0300061 L298.128036,94.5769031 C300.573585,96.9713 300.573599,100.85338 298.128067,103.247793 L217.317896,182.368927 C214.872352,184.763353 210.907314,184.76338 208.461736,182.368989 C208.461726,182.368979 208.461714,182.368967 208.461704,182.368957 L151.107561,126.214385 C150.496171,125.615783 149.504911,125.615783 148.893521,126.214385 C148.893517,126.214389 148.893514,126.214393 148.89351,126.214396 L91.5405888,182.368927 C89.095052,184.763359 85.1300133,184.763399 82.6844276,182.369014 C82.6844133,182.369 82.684398,182.368986 82.6843827,182.36897 L1.87196327,103.246785 C-0.573596939,100.852377 -0.573596939,96.9702735 1.87196327,94.5758653 L19.7936929,77.028998 C22.2392531,74.6345898 26.2042918,74.6345898 28.6498531,77.028998 L86.0048306,133.184355 C86.6162214,133.782957 87.6074796,133.782957 88.2188704,133.184355 C88.2188796,133.184346 88.2188878,133.184338 88.2188969,133.184331 L145.571,77.028998 C148.016505,74.6345347 151.981544,74.6344449 154.427161,77.028798 C154.427195,77.0288316 154.427229,77.0288653 154.427262,77.028899 L211.782164,133.184331 C212.393554,133.782932 213.384814,133.782932 213.996204,133.184331 L271.350179,77.0300061 C273.79574,74.6355969 277.760778,74.6355969 280.206339,77.0300061 Z" id="WalletConnect"></path>
+        </g>
+    </g>
+</svg>
--- a/packages/bridge/src/assets/walletconnect.svg
+++ b/packages/bridge/src/assets/walletconnect.svg
@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="300px" height="185px" viewBox="0 0 300 185" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 49.3 (51167) - http://www.bohemiancoding.com/sketch -->
+    <title>WalletConnect</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="walletconnect-logo-alt" fill="#3B99FC" fill-rule="nonzero">
+            <path d="M61.4385429,36.2562612 C110.349767,-11.6319051 189.65053,-11.6319051 238.561752,36.2562612 L244.448297,42.0196786 C246.893858,44.4140867 246.893858,48.2961898 244.448297,50.690599 L224.311602,70.406102 C223.088821,71.6033071 221.106302,71.6033071 219.883521,70.406102 L211.782937,62.4749541 C177.661245,29.0669724 122.339051,29.0669724 88.2173582,62.4749541 L79.542302,70.9685592 C78.3195204,72.1657633 76.337001,72.1657633 75.1142214,70.9685592 L54.9775265,51.2530561 C52.5319653,48.8586469 52.5319653,44.9765439 54.9775265,42.5821357 L61.4385429,36.2562612 Z M280.206339,77.0300061 L298.128036,94.5769031 C300.573585,96.9713 300.573599,100.85338 298.128067,103.247793 L217.317896,182.368927 C214.872352,184.763353 210.907314,184.76338 208.461736,182.368989 C208.461726,182.368979 208.461714,182.368967 208.461704,182.368957 L151.107561,126.214385 C150.496171,125.615783 149.504911,125.615783 148.893521,126.214385 C148.893517,126.214389 148.893514,126.214393 148.89351,126.214396 L91.5405888,182.368927 C89.095052,184.763359 85.1300133,184.763399 82.6844276,182.369014 C82.6844133,182.369 82.684398,182.368986 82.6843827,182.36897 L1.87196327,103.246785 C-0.573596939,100.852377 -0.573596939,96.9702735 1.87196327,94.5758653 L19.7936929,77.028998 C22.2392531,74.6345898 26.2042918,74.6345898 28.6498531,77.028998 L86.0048306,133.184355 C86.6162214,133.782957 87.6074796,133.782957 88.2188704,133.184355 C88.2188796,133.184346 88.2188878,133.184338 88.2188969,133.184331 L145.571,77.028998 C148.016505,74.6345347 151.981544,74.6344449 154.427161,77.028798 C154.427195,77.0288316 154.427229,77.0288653 154.427262,77.028899 L211.782164,133.184331 C212.393554,133.782932 213.384814,133.782932 213.996204,133.184331 L271.350179,77.0300061 C273.79574,74.6355969 277.760778,74.6355969 280.206339,77.0300061 Z" id="WalletConnect"></path>
+        </g>
+    </g>
+</svg>
--- a/packages/bridge/src/components/EthereumConnect/index.tsx
+++ b/packages/bridge/src/components/EthereumConnect/index.tsx
@ -2,12 +2,11 @@ import React from 'react';
 import { Button } from 'antd';

 import { useCorrectNetwork } from '../../hooks/useCorrectNetwork';
-import metamaskIcon from '../../assets/metamask.svg';
 import { shortenAddress } from '@oyster/common';
 import { useEthereum } from '../../contexts';

 export const EthereumConnect = () => {
-  const { accounts, onConnectEthereum, connected } = useEthereum();
+  const { accounts, onConnectEthereum, connected, walletProvider } = useEthereum();
  const { hasCorrespondingNetworks } = useCorrectNetwork();

  return (
@ -16,11 +15,11 @@ export const EthereumConnect = () => {
        hasCorrespondingNetworks ? (
          <>
            <img
-              alt={'metamask-icon'}
+              alt={'ethereum-icon'}
              width={20}
              height={20}
              style={{ marginRight: 5 }}
-              src={metamaskIcon}
+              src={walletProvider.icon}
            />
            {shortenAddress(accounts[0], 4)}
          </>
@ -31,14 +30,7 @@ export const EthereumConnect = () => {
        )
      ) : (
        <Button onClick={() => onConnectEthereum && onConnectEthereum()}>
-          <img
-            alt={'metamask-icon'}
-            width={20}
-            height={20}
-            style={{ marginRight: 5 }}
-            src={metamaskIcon}
-          />
-          Connect Metamask
+          Connect Ethereum
        </Button>
      )}
    </div>
--- a/packages/bridge/src/components/TokenSelectModal/index.tsx
+++ b/packages/bridge/src/components/TokenSelectModal/index.tsx
@ -119,6 +119,7 @@ export const TokenSelectModal = (props: {
        visible={isModalVisible}
        onCancel={() => hideModal()}
        footer={null}
+        className={"token-select-modal"}
      >
        <Input
          autoFocus
--- a/packages/bridge/src/components/TokenSelectModal/style.less
+++ b/packages/bridge/src/components/TokenSelectModal/style.less
@ -9,7 +9,6 @@
  background-color: rgba(255, 255, 255, 0.08);
 }
 .ant-modal-body {
-  height: 80vh;
  ::-webkit-scrollbar-track {
 	border-radius: 5px;
 	background-color: transparent;
@ -26,6 +25,10 @@
  }
 }

+.token-select-modal .ant-modal-body {
+  height: 80vh;
+}
+
 .ReactVirtualized__Grid.ReactVirtualized__List:focus {
  outline: none !important;
 }
--- a/packages/bridge/src/components/Transfer/index.tsx
+++ b/packages/bridge/src/components/Transfer/index.tsx
@ -147,7 +147,7 @@ export const Transfer = () => {
          });
        } else {
          console.log('Asset: ', asset);
-          debugger;
+          //debugger;

          // get user address from asset
          //
--- a/packages/bridge/src/contexts/ethereum.tsx
+++ b/packages/bridge/src/contexts/ethereum.tsx
@ -14,7 +14,8 @@ import { useWallet as useEthereumWallet } from 'use-wallet';
 import WalletConnectProvider from '@walletconnect/web3-provider';
 // @ts-ignore
 import Fortmatic from 'fortmatic';
-import { useWallet, useLocalStorageState, WalletAdapter } from '@oyster/common';
+import { useWallet, useLocalStorageState} from '@oyster/common';
+import { WalletAdapter } from '@solana/wallet-base'
 import { TokenList, TokenInfo } from '@uniswap/token-lists';
 import { ethers } from 'ethers';
 import { MetamaskWalletAdapter } from '../wallet-adapters/metamask';
@ -31,9 +32,9 @@ export const ETH_WALLET_PROVIDERS = [
    adapter: MetamaskWalletAdapter,
  },
  {
-    name: 'Wallect Connect',
-    url: 'https://walletconnect.org/',
-    icon: `${ASSETS_URL}walletconnect.svg`,
+    name: 'Wallet Connect',
+    url: 'https://walletconnect.org',
+    icon: `/blockchains/walletconnect.svg`,
    adapter: WalletConnectWalletAdapter,
  },
 ];
@ -46,6 +47,7 @@ export interface EthereumContextState {
  accounts: string[];
  connected: boolean;
  chainId: number;
+  walletProvider: any;
  onConnectEthereum?: () => void;
 }

@ -55,6 +57,7 @@ export const EthereumContext = createContext<EthereumContextState>({
  accounts: [''],
  chainId: 0,
  connected: false,
+  walletProvider: null,
 });

 export const EthereumProvider: FunctionComponent = ({ children }) => {
@ -184,7 +187,7 @@ export const EthereumProvider: FunctionComponent = ({ children }) => {
    if (walletConnected && !connected) {
      onConnectEthereum();
    }
-  }, [walletConnected, connected]);
+  }, [walletConnected, connected, providerUrl]);

  return (
    <EthereumContext.Provider
@ -195,6 +198,7 @@ export const EthereumProvider: FunctionComponent = ({ children }) => {
        provider,
        connected,
        chainId,
+        walletProvider,
        onConnectEthereum: () => onConnectEthereum(),
      }}
    >
--- a/packages/bridge/src/wallet-adapters/metamask.tsx
+++ b/packages/bridge/src/wallet-adapters/metamask.tsx
@ -1,6 +1,7 @@
 import EventEmitter from 'eventemitter3';
 import { PublicKey, Transaction } from '@solana/web3.js';
-import { notify, WalletAdapter } from '@oyster/common';
+import { notify } from '@oyster/common';
+import { WalletAdapter } from '@solana/wallet-base'
 import { ethers } from 'ethers';

 export class MetamaskWalletAdapter
@ -37,6 +38,9 @@ export class MetamaskWalletAdapter
  async signTransaction(transaction: Transaction) {
    return (window as any).ethereum.signTransaction(transaction);
  }
+  async signMultipleTransaction(transactions: Transaction[]) {
+    return transactions;
+  }

  connect() {
    if (this._onProcess) {
--- a/packages/bridge/src/wallet-adapters/wallet-connect.tsx
+++ b/packages/bridge/src/wallet-adapters/wallet-connect.tsx
@ -1,6 +1,7 @@
 import EventEmitter from 'eventemitter3';
 import { PublicKey, Transaction } from '@solana/web3.js';
-import { notify, WalletAdapter } from '@oyster/common';
+import { notify } from '@oyster/common';
+import { WalletAdapter } from '@solana/wallet-base'
 import { ethers } from 'ethers';
 import WalletConnectProvider from "@walletconnect/web3-provider";

@ -39,6 +40,9 @@ export class WalletConnectWalletAdapter
  async signTransaction(transaction: Transaction) {
    return this._provider.signTransaction(transaction);
  }
+  async signMultipleTransaction(transactions: Transaction[]) {
+    return transactions;
+  }

  connect() {
    if (this._onProcess) {