on c19b2a8 help sign in
bridge/src/views/Login/Other.js
67 lines 1.7 kB history raw
1import React, { useState, useMemo } from 'react';
3import useBreakpoints from 'lib/useBreakpoints';
5import Accordion from 'components/Accordion';
7import PrivateKey from './PrivateKey';
8import Keystore from './Keystore';
9import Ledger from './Ledger';
10import Metamask from './Metamask';
11import Trezor from './Trezor';
12import Mnemonic from './Mnemonic';
14const NAMES = {
15 PRIVATE_KEY: 'PRIVATE_KEY',
16 KEYSTORE: 'KEYSTORE',
17 LEDGER: 'LEDGER',
18 TREZOR: 'TREZOR',
19 METAMASK: 'METAMASK',
20 MNEMONIC: 'MNEMONIC',
21};
23const VIEWS = {
24 [NAMES.PRIVATE_KEY]: PrivateKey,
25 [NAMES.KEYSTORE]: Keystore,
26 [NAMES.LEDGER]: Ledger,
27 [NAMES.TREZOR]: Trezor,
28 [NAMES.METAMASK]: Metamask,
29 [NAMES.MNEMONIC]: Mnemonic,
30};
32const OPTIONS = [
33 { text: 'Mnemonic (BIP 39)', value: NAMES.MNEMONIC },
34 { text: 'Ledger', value: NAMES.LEDGER },
35 { text: 'Trezor', value: NAMES.TREZOR },
36 { text: 'Metamask', value: NAMES.METAMASK },
37 { text: 'Ethereum Private Key', value: NAMES.PRIVATE_KEY },
38 { text: 'Ethereum Keystore', value: NAMES.KEYSTORE },
39];
41const isHardware = name => !![NAMES.TREZOR, NAMES.LEDGER].find(n => n === name);
43export default function Other({ className, ...rest }) {
44 const [currentTab, setCurrentTab] = useState(undefined);
46 const hardwareAllowed = useBreakpoints([false, true, true]);
47 const options = useMemo(
48 () =>
49 OPTIONS.map(o =>
50 !isHardware(o.value)
51 ? o
52 : { ...o, disabled: !hardwareAllowed && ' not available on mobile' }
53 ),
54 [hardwareAllowed]
55 );
56 return (
57 <Accordion
58 className={className}
59 views={VIEWS}
60 options={options}
61 currentTab={currentTab}
62 onTabChange={setCurrentTab}
63 //
64 {...rest}
65 />
66 );