45e69c2 · bridge · git.iko.soy

src/components/Buttons.js+4−1

compare with master

unifiedsplit

@@ -25,7 +25,10 @@ export const OfflineButton = props => (

25);

26

27export const BootArvoButton = props => (

28+ <OutButton

28− <OutButton href="https://urbit.org/docs/getting-started" detail="Boot your computer" {...props}>

29+ href="https://urbit.org/docs/getting-started"

30+ detail="Boot your computer"

31+ {...props}>

29 Boot Arvo

32 Boot Arvo

30 </OutButton>

33 </OutButton>

31);

34);

src/lib/metamask.jsnew file+27

@@ -0,0 +1,27 @@

1+export function MetamaskWallet(address) {

2+ this.address = address;

3+}

4+

5+export function FakeMetamaskTransaction(txnData) {

6+ this.txnData = txnData;

7+

8+ this.serialize = function() {

9+ return '0';

10+ };

11+}

12+

13+// Cheat a bit and pretend to sign transaction

14+// Sign it actually when sending

15+export const metamaskSignTransaction = async (txn, from) => {

16+ const metamaskFormattedTxn = {

17+ to: txn.to.toString('hex'),

18+ value: txn.value.toString('hex'),

19+ data: txn.data.toString('hex'),

20+ gasLimit: txn.gasLimit.toString('hex'),

21+ gasPrice: txn.gasPrice.toString('hex'),

22+ nonce: txn.nonce.length === 0 ? '00' : txn.nonce.toString('hex'),

23+ from: from,

24+ };

25+

26+ return new FakeMetamaskTransaction(metamaskFormattedTxn);

27+};

src/lib/txn.js+17

@@ -5,6 +5,7 @@ import retry from 'async-retry';

5import { NETWORK_TYPES } from './network';

6import { ledgerSignTransaction } from './ledger';

7import { trezorSignTransaction } from './trezor';

8+import { metamaskSignTransaction, FakeMetamaskTransaction } from './metamask';

8import { WALLET_TYPES, addHexPrefix } from './wallet';

9import { WALLET_TYPES, addHexPrefix } from './wallet';

9import { CHECK_BLOCK_EVERY_MS } from './constants';

10import { CHECK_BLOCK_EVERY_MS } from './constants';

10import patp2dec from './patp2dec';

11import patp2dec from './patp2dec';

@@ -89,6 +90,8 @@ const signTransaction = async ({

89 await ledgerSignTransaction(stx, walletHdPath);

90 await ledgerSignTransaction(stx, walletHdPath);

90 } else if (walletType === WALLET_TYPES.TREZOR) {

91 } else if (walletType === WALLET_TYPES.TREZOR) {

91 await trezorSignTransaction(stx, walletHdPath);

92 await trezorSignTransaction(stx, walletHdPath);

93+ } else if (walletType === WALLET_TYPES.METAMASK) {

94+ return metamaskSignTransaction(stx, wallet.address);

92 } else {

95 } else {

93 stx.sign(wallet.privateKey);

96 stx.sign(wallet.privateKey);

94 }

97 }

@@ -97,6 +100,20 @@ const signTransaction = async ({

97};

100};

98

101

99const sendSignedTransaction = (web3, stx, doubtNonceError) => {

102const sendSignedTransaction = (web3, stx, doubtNonceError) => {

103+ // Handle fake metamask transaction

104+ if (stx instanceof FakeMetamaskTransaction) {

105+ const { ethereum } = window;

106+ const sendTxs = {

107+ method: 'eth_sendTransaction',

108+ params: [stx.txnData],

109+ from: stx.txnData.from,

110+ };

111+ return new Promise((resolve, reject) =>

112+ ethereum.sendAsync(sendTxs, (err, data) =>

113+ err ? reject(err) : resolve(data.result)

114+ )

115+ );

116+ }

100 const rawTx = hexify(stx.serialize());

117 const rawTx = hexify(stx.serialize());

101

118

102 return new Promise(async (resolve, reject) => {

119 return new Promise(async (resolve, reject) => {

src/lib/wallet.js+1

@@ -19,6 +19,7 @@ export const WALLET_TYPES = {

19 TREZOR: Symbol('TREZOR'),

20 PRIVATE_KEY: Symbol('PRIVATE_KEY'),

21 KEYSTORE: Symbol('KEYSTORE'),

22+ METAMASK: Symbol('METAMASK'),

22};

23};

23

24

24export function EthereumWallet(privateKey) {

25export function EthereumWallet(privateKey) {

src/views/Login.js+4

@@ -16,12 +16,14 @@ import Ticket from './Login/Ticket';

16import Mnemonic from './Login/Mnemonic';

17import Advanced from './Login/Advanced';

18import Hardware from './Login/Hardware';

19+import Metamask from './Login/Metamask';

19

20

20const NAMES = {

21const NAMES = {

21 TICKET: 'TICKET',

22 TICKET: 'TICKET',

22 MNEMONIC: 'MNEMONIC',

23 MNEMONIC: 'MNEMONIC',

23 HARDWARE: 'HARDWARE',

24 HARDWARE: 'HARDWARE',

24 ADVANCED: 'ADVANCED',

25 ADVANCED: 'ADVANCED',

26+ METAMASK: 'METAMASK',

25};

27};

26

28

27const VIEWS = {

29const VIEWS = {

@@ -29,6 +31,7 @@ const VIEWS = {

29 [NAMES.MNEMONIC]: Mnemonic,

31 [NAMES.MNEMONIC]: Mnemonic,

30 [NAMES.HARDWARE]: Hardware,

32 [NAMES.HARDWARE]: Hardware,

31 [NAMES.ADVANCED]: Advanced,

33 [NAMES.ADVANCED]: Advanced,

34+ [NAMES.METAMASK]: Metamask,

32};

35};

33

36

34const OPTIONS = [

37const OPTIONS = [

@@ -36,6 +39,7 @@ const OPTIONS = [

36 { text: 'Mnemonic', value: NAMES.MNEMONIC },

39 { text: 'Mnemonic', value: NAMES.MNEMONIC },

37 { text: 'Hardware', value: NAMES.HARDWARE },

40 { text: 'Hardware', value: NAMES.HARDWARE },

38 { text: 'Advanced', value: NAMES.ADVANCED },

41 { text: 'Advanced', value: NAMES.ADVANCED },

42+ { text: 'Metamask', value: NAMES.METAMASK },

39];

43];

40

44

41const walletTypeToViewName = walletType => {

45const walletTypeToViewName = walletType => {

src/views/Login/Metamask.jsnew file+65

@@ -0,0 +1,65 @@

1+import React, { useCallback } from 'react';

2+import cn from 'classnames';

3+import { Grid, Text, LinkButton, H5 } from 'indigo-react';

4+import { Just } from 'folktale/maybe';

5+

6+import { useWallet } from 'store/wallet';

7+

8+import { WALLET_TYPES } from 'lib/wallet';

9+import { MetamaskWallet } from 'lib/metamask';

10+

11+import SubmitButton from 'form/SubmitButton';

12+import BridgeForm from 'form/BridgeForm';

13+

14+export default function Metamask({ className, goHome }) {

15+ const { setWallet, setWalletType } = useWallet();

16+

17+ const onSubmit = useCallback(async () => {

18+ const accounts = await window.ethereum.enable();

19+ const wallet = new MetamaskWallet(accounts[0]);

20+ setWallet(Just(wallet));

21+ setWalletType(WALLET_TYPES.METAMASK);

22+ }, [setWallet]);

23+

24+ const login = () => (

25+ <>

26+ <Grid.Item full as={H5}>

27+ Authenticate with Metamask

28+ </Grid.Item>

29+ <Grid.Item full as={Text} className="f6 mb3">

30+ If you wish to login with a different wallet, please change it in the

31+ Metamask extension

32+ </Grid.Item>

33+ <BridgeForm onSubmit={onSubmit} afterSubmit={goHome}>

34+ {({ handleSubmit }) => (

35+ <Grid.Item full as={SubmitButton} handleSubmit={handleSubmit}>

36+ Login

37+ {window.ethereum.selectedAddress &&

38+ ' as ' + window.ethereum.selectedAddress}

39+ </Grid.Item>

40+ )}

41+ </BridgeForm>

42+ </>

43+ );

44+ return (

45+ <Grid className={cn('mt4', className)}>

46+ {(window.ethereum && login()) || MetamaskUnsupported()}

47+ </Grid>

48+ );

49+}

50+

51+function MetamaskUnsupported() {

52+ return (

53+ <>

54+ <Grid.Item full as={H5}>

55+ Metamask unsupported

56+ </Grid.Item>

57+ <Grid.Item full as={Text} className="f6 mb3">

58+ Metamask is not installed on this browser.

59+ <LinkButton href="https://metamask.io" as={LinkButton}>

60+ Get Metamask

61+ </LinkButton>

62+ </Grid.Item>

63+ </>

64+ );

65+}