git.iko.soy/bridge
on e012203 help sign in
bridge/src/components/Inputs.js
171 lines 4.0 kB history raw
1import React, { useState, useMemo } from 'react';
2import * as bip39 from 'bip39';
4import InputSigil from 'components/InputSigil';
6import { DEFAULT_HD_PATH } from 'lib/wallet';
7import {
8 validateNotEmpty,
9 validateMnemonic,
10 validatePoint,
11 validateTicket,
12 validateEmail,
13} from 'lib/validators';
14import { prependSig } from 'lib/transformers';
15import useForm from 'indigo-react/lib/useForm';
16import { AccessoryIcon } from 'indigo-react';
18// const RequiredInput = advancedInput({
19// WrappedComponent: Input,
20// validators: [validateNotEmpty],
21// });
23// const NetworkKeyInput = advancedInput({
24// WrappedComponent: Input,
25// validators: [validateNotEmpty, validateNetworkKey],
26// });
28// const NetworkSeedInput = advancedInput({
29// WrappedComponent: Input,
30// validators: [validateNotEmpty, validateNetworkSeed],
31// });
33// const AddressInput = advancedInput({
34// WrappedComponent: Input,
35// validators: [validateEthereumAddress, validateNotEmpty],
36// });
38const firstOf = state => state.inputs[0];
40export function usePassphraseInput(props) {
41 return firstOf(
42 useForm([
43 {
44 type: 'password',
45 autoComplete: 'off',
46 placeholder: 'Passphrase',
47 ...props,
48 },
49 ])
50 );
53const kExampleMnemonic = bip39.generateMnemonic();
54const kMnemonicValidators = [validateMnemonic, validateNotEmpty];
55export function useMnemonicInput(props) {
56 return firstOf(
57 useForm([
58 {
59 type: 'text',
60 autoComplete: 'off',
61 placeholder: `e.g. ${kExampleMnemonic}`,
62 validators: kMnemonicValidators,
63 ...props,
64 },
65 ])
66 );
69export function useHdPathInput(props) {
70 return firstOf(
71 useForm([
72 {
73 type: 'text',
74 autoComplete: 'off',
75 placeholder: `e.g. ${DEFAULT_HD_PATH}`,
76 ...props,
77 },
78 ])
79 );
82// const GalaxyInput = advancedInput({
83// WrappedComponent: Input,
84// validators: [validateGalaxy, validateNotEmpty],
85// transformers: [prependSig],
86// });
88const kTicketValidators = [validateTicket, validateNotEmpty];
89const kTicketTransformers = [prependSig];
90//TODO needs to be fancier, displaying sig and dashes instead of •ing all
91export function useTicketInput({ validators = [], ...rest }) {
92 const input = firstOf(
93 useForm([
94 {
95 type: 'password',
96 label: 'Ticket',
97 placeholder: '~ragtyd-modwen-bostec-hinsep',
98 validators: useMemo(() => [...validators, ...kTicketValidators], [
99 validators,
100 ]),
101 transformers: kTicketTransformers,
102 mono: true,
103 ...rest,
104 },
105 ])
106 );
108 return { ...input, accessory: input.pass ? <AccessoryIcon.Success /> : null };
111const kPointValidators = [validatePoint, validateNotEmpty];
112const kPointTransformers = [prependSig];
113export function usePointInput(rest) {
114 const [lastValidPoint, setLastValidPoint] = useState('');
115 const input = firstOf(
116 useForm([
117 {
118 type: 'text',
119 label: 'Point',
120 placeholder: 'e.g. ~zod',
121 validators: kPointValidators,
122 transformers: kPointTransformers,
123 mono: true,
124 onValue: setLastValidPoint,
125 ...rest,
126 },
127 ])
128 );
130 const { pass, focused, error } = input;
132 return {
133 ...input,
134 accessory: lastValidPoint && (
135 <InputSigil
136 patp={lastValidPoint}
137 size={68}
138 margin={8}
139 pass={pass}
140 focused={focused}
141 error={error}
142 />
143 ),
144 };
147export function useCheckboxInput({ initialValue, ...rest }) {
148 return firstOf(
149 useForm([
150 {
151 type: 'checkbox',
152 ...rest,
153 },
154 ])
155 );
158const kEmailValidators = [validateEmail, validateNotEmpty];
159export const buildEmailInputConfig = extra => ({
160 type: 'email',
161 autoComplete: 'off',
162 validators: kEmailValidators,
163 initialValue: '',
164 ...extra,
165});
167// const TicketInput = advancedInput({
168// WrappedComponent: Input,
169// validators: [validateTicket, validateNotEmpty],
170// transformers: [prependSig],
171// });