git.iko.soy/bridge
on 9781501 help sign in
bridge/src/components/Inputs.js
182 lines 4.2 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 = [], deriving = false, ...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 const accessory = input.error ? (
109 <AccessoryIcon.Failure />
110 ) : deriving ? (
111 <AccessoryIcon.Pending />
112 ) : input.pass ? (
113 <AccessoryIcon.Success />
114 ) : null;
116 return {
117 ...input,
118 accessory,
119 };
122const kPointValidators = [validatePoint, validateNotEmpty];
123const kPointTransformers = [prependSig];
124export function usePointInput(rest) {
125 const [lastValidPoint, setLastValidPoint] = useState('');
126 const input = firstOf(
127 useForm([
128 {
129 type: 'text',
130 label: 'Point',
131 placeholder: 'e.g. ~zod',
132 validators: kPointValidators,
133 transformers: kPointTransformers,
134 mono: true,
135 onValue: setLastValidPoint,
136 ...rest,
137 },
138 ])
139 );
141 const { pass, focused, error } = input;
143 return {
144 ...input,
145 accessory: lastValidPoint && (
146 <InputSigil
147 patp={lastValidPoint}
148 size={68}
149 margin={8}
150 pass={pass}
151 focused={focused}
152 error={error}
153 />
154 ),
155 };
158export function useCheckboxInput({ initialValue, ...rest }) {
159 return firstOf(
160 useForm([
161 {
162 type: 'checkbox',
163 ...rest,
164 },
165 ])
166 );
169const kEmailValidators = [validateEmail, validateNotEmpty];
170export const buildEmailInputConfig = extra => ({
171 type: 'email',
172 autoComplete: 'off',
173 validators: kEmailValidators,
174 initialValue: '',
175 ...extra,
176});
178// const TicketInput = advancedInput({
179// WrappedComponent: Input,
180// validators: [validateTicket, validateNotEmpty],
181// transformers: [prependSig],
182// });