git.iko.soy/bridge
on master help sign in
Reverted MM to previous screen
2c54548Will Galebach
src/views/Disclaimer.js+5−1
compare with master
unifiedsplit
@@ -96,7 +96,11 @@ export default function ActivateDisclaimer() {
96 label="I acknowledge and understand these rights"
96 label="I acknowledge and understand these rights"
97 />
97 />
98
98
99+ <Grid.Item
100+ center
101+ full
102+ as={SubmitButton}
99− <Grid.Item full as={SubmitButton} handleSubmit={handleSubmit}>
103+ handleSubmit={handleSubmit}>
100 Continue
104 Continue
101 </Grid.Item>
105 </Grid.Item>
102 </>
106 </>
src/views/Login/LoginSelector.tsx+10−65
@@ -1,25 +1,17 @@
1import React, { useCallback, useState } from 'react';
1import React, { useCallback, useState } from 'react';
2import cn from 'classnames';
2import cn from 'classnames';
3−import Web3 from 'web3';
4import { Grid } from 'indigo-react';
3import { Grid } from 'indigo-react';
5import { Box, Button, Icon, LoadingSpinner, Text } from '@tlon/indigo-react';
4import { Box, Button, Icon, LoadingSpinner, Text } from '@tlon/indigo-react';
6import { useHistory } from 'store/history';
5import { useHistory } from 'store/history';
7−import { Just, Nothing } from 'folktale/maybe';
8−import { FORM_ERROR } from 'final-form';
9−
10−import { useWallet } from 'store/wallet';
11−import { usePointCursor } from 'store/pointCursor';
12
6
13import { WALLET_TYPES } from 'lib/constants';
7import { WALLET_TYPES } from 'lib/constants';
14−import { MetamaskWallet } from 'lib/metamask';
15−import { getAuthToken } from 'lib/authToken';
16import { useWalletConnect } from 'lib/useWalletConnect';
8import { useWalletConnect } from 'lib/useWalletConnect';
17−import useLoginView from 'lib/useLoginView';
18
9
19import Modal from 'components/L2/Modal';
10import Modal from 'components/L2/Modal';
20import HeaderButton from 'components/L2/Headers/HeaderButton';
11import HeaderButton from 'components/L2/Headers/HeaderButton';
21import './LoginSelector.scss';
12import './LoginSelector.scss';
22import { NAMES } from './Other';
13import { NAMES } from './Other';
14+import useLoginView from 'lib/useLoginView';
23
15
24interface LoginSelectorProps {
16interface LoginSelectorProps {
25 className: string;
17 className: string;
@@ -51,77 +43,30 @@ export default function LoginSelector({
51 const [showModal, setShowModal] = useState(false);
43 const [showModal, setShowModal] = useState(false);
52 const [metamaskSelected, setMetamaskSelected] = useState(false);
44 const [metamaskSelected, setMetamaskSelected] = useState(false);
53
45
54− const {
55− setWallet,
56− setWalletType,
57− resetWallet,
58− setAuthToken,
59− }: any = useWallet();
60−
61 const { connect } = useWalletConnect();
46 const { connect } = useWalletConnect();
62
47
63− const { setPointCursor }: any = usePointCursor();
64−
65 const goToActivate = useCallback(() => push(names.ACTIVATE), [
48 const goToActivate = useCallback(() => push(names.ACTIVATE), [
66 push,
49 push,
67 names.ACTIVATE,
50 names.ACTIVATE,
68 ]);
51 ]);
69
52
70− const connectMetamask = useCallback(async () => {
71− try {
72− setMetamaskSelected(true);
73− resetWallet();
74− setWalletType(WALLET_TYPES.METAMASK);
75− setPointCursor(Nothing());
76−
77− const accounts = await (window as any).ethereum.send(
78− 'eth_requestAccounts'
79− );
80− const wallet = new MetamaskWallet(accounts.result[0]);
81−
82− const web3 = new Web3((window as any).ethereum);
83− const authToken = await getAuthToken({
84− address: wallet.address,
85− walletType: WALLET_TYPES.METAMASK,
86− web3,
87− });
88−
89− setAuthToken(Just(authToken));
90− setWallet(Just(wallet));
91− setWalletType(WALLET_TYPES.METAMASK);
92− goHome();
93− } catch (e) {
94− setMetamaskSelected(false);
95− console.error(e);
96− return { [FORM_ERROR]: (e as any).message };
97− }
98− }, [
99− setAuthToken,
100− setWallet,
101− setWalletType,
102− resetWallet,
103− setPointCursor,
104− setMetamaskSelected,
105− goHome,
106− ]);
107−
108− const selectOption = (value: string) => () => {
53+ const selectOption = (value: string) => async () => {
109− if (value === NAMES.METAMASK) {
110− connectMetamask();
111− } else {
112− if (value === NAMES.WALLET_CONNECT) {
54+ if (value === NAMES.WALLET_CONNECT) {
113− connect();
55+ connect();
114− }
115− setCurrentTab(value);
116 }
56 }
57+ setCurrentTab(value);
117 };
58 };
118
59
119 const loader = <LoadingSpinner background="#bce2ff" foreground="#219DFF" />;
60 const loader = <LoadingSpinner background="#bce2ff" foreground="#219DFF" />;
120
61
62+ const availableOptions = options.filter(
63+ ({ value }) => value !== NAMES.METAMASK || !!(window as any).ethereum
64+ );
65+
121 if (!currentTab) {
66 if (!currentTab) {
122 return (
67 return (
123 <Grid className={className}>
68 <Grid className={className}>
124− {options.map((option, i) => (
69+ {availableOptions.map((option, i) => (
125 <React.Fragment key={option.value}>
70 <React.Fragment key={option.value}>
126 <Grid.Item
71 <Grid.Item
127 full
72 full
src/views/Login/Metamask.js+31−20
@@ -15,6 +15,10 @@ import * as need from 'lib/need';
15
15
16import SubmitButton from 'form/SubmitButton';
16import SubmitButton from 'form/SubmitButton';
17import BridgeForm from 'form/BridgeForm';
17import BridgeForm from 'form/BridgeForm';
18+import Window from 'components/L2/Window/Window';
19+import HeaderPane from 'components/L2/Window/HeaderPane';
20+import BodyPane from 'components/L2/Window/BodyPane';
21+import { Row } from '@tlon/indigo-react';
18
22
19export default function Metamask({ className, goHome }) {
23export default function Metamask({ className, goHome }) {
20 useLoginView(WALLET_TYPES.METAMASK);
24 useLoginView(WALLET_TYPES.METAMASK);
@@ -67,26 +71,33 @@ function Unsupported() {
67}
71}
68function Login({ onSubmit, goHome }) {
72function Login({ onSubmit, goHome }) {
69 return (
73 return (
70− <>
74+ <Window className="master-ticket">
75+ <HeaderPane>
76+ <Row className="header-row">
77+ <h5>Metamask</h5>
78+ </Row>
79+ </HeaderPane>
80+ <BodyPane className="login-body-pane">
71− <Grid.Item full as={Text} className="f6 gray4 mb3">
81+ <Grid.Item full as={Text} className="f6 gray4 mb3">
72− If you wish to login with a different wallet, please change it in the
82+ If you wish to login with a different wallet, please change it in the
73− Metamask extension
83+ Metamask extension
74− </Grid.Item>
84+ </Grid.Item>
75− <BridgeForm onSubmit={onSubmit} afterSubmit={goHome}>
85+ <BridgeForm onSubmit={onSubmit} afterSubmit={goHome}>
76− {({ handleSubmit }) => (
86+ {({ handleSubmit }) => (
77− <Grid.Item full className="flex-col justify-end">
87+ <Grid.Item full className="flex-col justify-end w-full">
78− <Grid.Item
88+ <Grid.Item
79− center
89+ center
80− full
90+ full
81− as={SubmitButton}
91+ as={SubmitButton}
82− handleSubmit={handleSubmit}>
92+ handleSubmit={handleSubmit}>
83− Login
93+ Login
84− {window.ethereum.selectedAddress &&
94+ {window.ethereum.selectedAddress &&
85− ' as ' + abbreviateAddress(window.ethereum.selectedAddress)}
95+ ' as ' + abbreviateAddress(window.ethereum.selectedAddress)}
96+ </Grid.Item>
86 </Grid.Item>
97 </Grid.Item>
87− </Grid.Item>
88− )}
98+ )}
89− </BridgeForm>
99+ </BridgeForm>
90− </>
100+ </BodyPane>
101+ </Window>
91 );
102 );
92}
103}
src/views/Login/Other.tsx+1−1
@@ -34,7 +34,7 @@ const OPTIONS = [
34 headerIcon: settingsIcon,
34 headerIcon: settingsIcon,
35 },
35 },
36 {
36 {
37− text: 'Metamask',
37+ text: 'Metamask Browser Extension',
38 value: NAMES.METAMASK,
38 value: NAMES.METAMASK,
39 menuIcon: <MetamaskIcon className="logo-icon" />,
39 menuIcon: <MetamaskIcon className="logo-icon" />,
40 headerIcon: settingsIcon,
40 headerIcon: settingsIcon,