d572598 · bridge · git.iko.soy

src/views/Activate/ActivateCode.js+20−6

compare with master

unifiedsplit

@@ -1,7 +1,7 @@

1import React, { useCallback, useMemo, useRef } from 'react';

2import { Just } from 'folktale/maybe';

3import * as azimuth from 'azimuth-js';

4−import { Grid, H4 } from 'indigo-react';

4+import { Grid, H4, CheckboxInput } from 'indigo-react';

5import { FORM_ERROR } from 'final-form';

6

7import View from 'components/View';

@@ -31,6 +31,7 @@ import {

31 composeValidator,

32 buildPatqValidator,

33 hasErrors,

34+ buildCheckboxValidator,

34} from 'form/validators';

35} from 'form/validators';

35import FormError from 'form/FormError';

36import FormError from 'form/FormError';

36

37

@@ -79,7 +80,11 @@ export default function ActivateCode() {

79 }, []);

80 }, []);

80

81

81 const validate = useMemo(

82 const validate = useMemo(

83+ () =>

82− () => composeValidator({ ticket: buildPatqValidator() }, validateForm),

84+ composeValidator(

85+ { ticket: buildPatqValidator(), showTicket: buildCheckboxValidator() },

86+ validateForm

87+ ),

83 [validateForm]

88 [validateForm]

84 );

89 );

85

90

@@ -132,9 +137,10 @@ export default function ActivateCode() {

132 [contracts, setDerivedPoint, setDerivedWallet, setInviteWallet]

137 [contracts, setDerivedPoint, setDerivedWallet, setInviteWallet]

133 );

138 );

134

139

135− const initialValues = useMemo(() => ({ ticket: impliedTicket || '' }), [

140+ const initialValues = useMemo(

141+ () => ({ ticket: impliedTicket || '', showTicket: true }),

136− impliedTicket,

142+ [impliedTicket]

137− ]);

143+ );

138

144

139 return (

145 return (

140 <View inset>

146 <View inset>

@@ -148,16 +154,24 @@ export default function ActivateCode() {

148 onSubmit={onSubmit}

154 onSubmit={onSubmit}

149 afterSubmit={goToPassport}

155 afterSubmit={goToPassport}

150 initialValues={initialValues}>

156 initialValues={initialValues}>

151− {({ validating, submitting, handleSubmit }) => (

157+ {({ validating, values, submitting, handleSubmit }) => (

152 <>

158 <>

153 <Grid.Item

159 <Grid.Item

154 full

160 full

155 as={TicketInput}

161 as={TicketInput}

162+ type={values.showTicket ? 'text' : 'password'}

156 name="ticket"

163 name="ticket"

157 label="Activation Code"

164 label="Activation Code"

158 disabled={!activationAllowed}

165 disabled={!activationAllowed}

159 />

166 />

160

167

168+ <Grid.Item

169+ full

170+ as={CheckboxInput}

171+ name="showTicket"

172+ label="Show"

173+ />

174+

161 <Grid.Item full as={FormError} />

175 <Grid.Item full as={FormError} />

162

176

163 <Grid.Item

177 <Grid.Item

src/views/Activate/PassportVerify.js+17−3

@@ -1,5 +1,5 @@

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

2−import { Grid, P } from 'indigo-react';

2+import { Grid, P, CheckboxInput } from 'indigo-react';

3

4import * as need from 'lib/need';

5import { useLocalRouter } from 'lib/LocalRouter';

@@ -8,7 +8,11 @@ import { isDevelopment } from 'lib/flags';

8

9import SubmitButton from 'form/SubmitButton';

10import { TicketInput } from 'form/Inputs';

11+import {

12+ composeValidator,

11−import { composeValidator, buildPatqValidator } from 'form/validators';

13+ buildPatqValidator,

14+ buildCheckboxValidator,

15+} from 'form/validators';

12import BridgeForm from 'form/BridgeForm';

16import BridgeForm from 'form/BridgeForm';

13

17

14import { useActivateFlow } from './ActivateFlow';

18import { useActivateFlow } from './ActivateFlow';

@@ -29,6 +33,7 @@ export default function PassportVerify({ className }) {

29 ticket: buildPatqValidator([

33 ticket: buildPatqValidator([

30 validateExactly(ticket, 'Does not match expected master ticket.'),

34 validateExactly(ticket, 'Does not match expected master ticket.'),

31 ]),

35 ]),

36+ showTicket: buildCheckboxValidator(),

32 }),

37 }),

33 [ticket]

38 [ticket]

34 );

39 );

@@ -36,6 +41,7 @@ export default function PassportVerify({ className }) {

36 const initialValues = useMemo(

41 const initialValues = useMemo(

37 () => ({

42 () => ({

38 ticket: STUB_VERIFY_TICKET ? ticket : undefined,

43 ticket: STUB_VERIFY_TICKET ? ticket : undefined,

44+ showTicket: true,

39 }),

45 }),

40 [ticket]

46 [ticket]

41 );

47 );

@@ -52,15 +58,23 @@ export default function PassportVerify({ className }) {

52 validate={validate}

58 validate={validate}

53 afterSubmit={goToTransfer}

59 afterSubmit={goToTransfer}

54 initialValues={initialValues}>

60 initialValues={initialValues}>

55− {({ handleSubmit }) => (

61+ {({ values, handleSubmit }) => (

56 <>

62 <>

57 <Grid.Item

63 <Grid.Item

58 full

64 full

59 as={TicketInput}

65 as={TicketInput}

66+ type={values.showTicket ? 'text' : 'password'}

60 name="ticket"

67 name="ticket"

61 label="Master Ticket"

68 label="Master Ticket"

62 />

69 />

63

70

71+ <Grid.Item

72+ full

73+ as={CheckboxInput}

74+ name="showTicket"

75+ label="Show"

76+ />

77+

64 <Grid.Item full as={FormError} />

78 <Grid.Item full as={FormError} />

65

79

66 <Grid.Item

80 <Grid.Item

src/views/Admin/Reticket/ReticketConfirm.js+3−2

@@ -65,12 +65,12 @@ export default function ReticketConfirm({ newWallet, setNewWallet }) {

65 });

66

67 return (

68− <Grid gap={4} className="mt4">

68+ <Grid className="mt4">

69 <Grid.Item full as={Text}>

70 Reticketing is the process of generating a completely fresh wallet and

71 transferring ownership of your point to that wallet.

72 </Grid.Item>

73− <Grid.Item full as={WarningBox}>

73+ <Grid.Item full as={WarningBox} className="mt4">

74 Beware, this resets your proxy addresses; if you're using smart

75 contracts, this might break them! It will also change your networking

76 keys!

@@ -79,6 +79,7 @@ export default function ReticketConfirm({ newWallet, setNewWallet }) {

79 full

80 as={ForwardButton}

81 solid

82+ className="mt4"

82 accessory={blinkIf(Nothing.hasInstance(newWallet))}

83 accessory={blinkIf(Nothing.hasInstance(newWallet))}

83 disabled={Nothing.hasInstance(newWallet)}

84 disabled={Nothing.hasInstance(newWallet)}

84 onClick={goDownload}>

85 onClick={goDownload}>

src/views/Admin/Reticket/ReticketDownload.js+2−1

@@ -20,13 +20,14 @@ export default function ReticketDownload({ newWallet }) {

20 const goVerify = useCallback(() => push(names.VERIFY), [push, names]);

21

22 return (

23− <Grid gap={4} className="mt4">

23+ <Grid className="mt4">

24 <Grid.Item full as={Text}>

25 Download the thing, and keep it somewhere safe!

26 </Grid.Item>

27 <Grid.Item

28 full

29 as={!downloaded ? DownloadButton : ForwardButton}

30+ className="mt4"

30 disabled={Nothing.hasInstance(newWallet)}

31 disabled={Nothing.hasInstance(newWallet)}

31 onClick={!downloaded ? download : goVerify}

32 onClick={!downloaded ? download : goVerify}

32 success={downloaded}

33 success={downloaded}

src/views/Admin/Reticket/ReticketExecute.js+11−12

@@ -110,12 +110,12 @@ export default function ReticketExecute({ newWallet, setNewWallet }) {

110 if (generalError) {

111 return (

112 <>

113− <Grid.Item full>

113+ <Grid.Item full className="mt4">

114 <ErrorText>{generalError.message.toString()}</ErrorText>

115 </Grid.Item>

116 <Grid.Item

117 full

118− className="mt3"

118+ className="mt4"

119 as={RestartButton}

120 solid

121 onClick={goToRestart}>

@@ -127,7 +127,7 @@ export default function ReticketExecute({ newWallet, setNewWallet }) {

127

128 if (needFunds) {

129 return (

130− <Grid.Item full>

130+ <Grid.Item full className="mt4">

131 <Highlighted warning>

132 The address {needFunds.address} needs at least{' '}

133 {fromWei(needFunds.minBalance)} ETH and currently has{' '}

@@ -139,21 +139,21 @@ export default function ReticketExecute({ newWallet, setNewWallet }) {

139 }

140

141 return (

142− <Grid.Item full as={WarningBox}>

142+ <Grid.Item full as={WarningBox} className="mt4">

143 Never give your Master Ticket to anyone

144 </Grid.Item>

145 );

146 };

147

148 return (

149− <Grid gap={4} className="mt4">

149+ <Grid className="mt4">

150 <Grid.Item full as={H4}>

151 {labelForProgress(progress)}

152 </Grid.Item>

153

154 {isDone ? (

155 <>

156− <Grid.Item full as={Text}>

156+ <Grid.Item full as={Text} className="mt4">

157 Your changes are now reflected on-chain and you can use the new

158 ticket to manage your point.

159 </Grid.Item>

@@ -161,6 +161,7 @@ export default function ReticketExecute({ newWallet, setNewWallet }) {

161 full

162 as={ForwardButton}

163 solid

164+ className="mt4"

164 accessory="↺"

165 accessory="↺"

165 onClick={loginAndGoHome}>

166 onClick={loginAndGoHome}>

166 Login with New Master Ticket

167 Login with New Master Ticket

@@ -168,13 +169,11 @@ export default function ReticketExecute({ newWallet, setNewWallet }) {

168 </>

169 </>

169 ) : (

170 ) : (

170 <>

171 <>

171− <Grid.Item full as={Grid} className="mt3" gap={3}>

172+ <Grid.Item full as={Grid} className="mt4" gap={3}>

172 <Grid.Item full as={LoadingBar} progress={progress} />

173 <Grid.Item full as={LoadingBar} progress={progress} />

173− <Grid.Item full>

174− <Text className="f5 green4">

174+ <Grid.Item full as={Text} className="f5 green4">

175− This process can take up to 5 minutes to complete. Don't close

175+ This process can take up to 5 minutes to complete. Don't close

176− this page until the process is complete.

176+ this page until the process is complete.

177− </Text>

178 </Grid.Item>

177 </Grid.Item>

179 </Grid.Item>

178 </Grid.Item>

180

179

src/views/Admin/Reticket/ReticketVerify.js+7−3

@@ -1,5 +1,5 @@

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

2−import { Text, Grid } from 'indigo-react';

2+import { Text, Grid, CheckboxInput } from 'indigo-react';

3

4import { useLocalRouter } from 'lib/LocalRouter';

5import { validateExactly } from 'lib/validators';

@@ -37,7 +37,7 @@ export default function ReticketVerify({ newWallet }) {

37 const goExecute = useCallback(() => push(names.EXECUTE), [push, names]);

38

39 return (

40− <Grid gap={4} className="mt4">

40+ <Grid className="mt4">

41 <Grid.Item full as={Text}>

42 Verify New Master Ticket

43 </Grid.Item>

@@ -45,15 +45,19 @@ export default function ReticketVerify({ newWallet }) {

45 validate={validate}

46 afterSubmit={goExecute}

47 initialValues={initialValues}>

48− {({ handleSubmit }) => (

48+ {({ handleSubmit, values }) => (

49 <>

50 <Grid.Item

51 full

52 as={TicketInput}

53+ className="mt4"

54+ type={values.showTicket ? 'text' : 'password'}

53 name="ticket"

55 name="ticket"

54 label="New master ticket"

56 label="New master ticket"

55 />

57 />

56

58

59+ <Grid.Item full as={CheckboxInput} name="showTicket" label="Show" />

60+

57 <Grid.Item full as={FormError} />

61 <Grid.Item full as={FormError} />

58

62

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

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

src/views/Login/Ticket.js+6−4

@@ -116,6 +116,7 @@ export default function Ticket({ className, goHome }) {

116 () =>

117 composeValidator(

118 {

119+ useAdvanced: buildCheckboxValidator(),

119 usePassphrase: buildCheckboxValidator(),

120 usePassphrase: buildCheckboxValidator(),

120 useShards: buildCheckboxValidator(),

121 useShards: buildCheckboxValidator(),

121 point: buildPointValidator(4),

122 point: buildPointValidator(4),

@@ -123,6 +124,7 @@ export default function Ticket({ className, goHome }) {

123 shard1: buildPatqValidator(),

124 shard1: buildPatqValidator(),

124 shard2: buildPatqValidator(),

125 shard2: buildPatqValidator(),

125 shard3: buildPatqValidator(),

126 shard3: buildPatqValidator(),

127+ showTicket: buildCheckboxValidator(),

126 passphrase: buildPassphraseValidator(),

128 passphrase: buildPassphraseValidator(),

127 },

129 },

128 validateForm

130 validateForm

@@ -156,9 +158,9 @@ export default function Ticket({ className, goHome }) {

156 <Grid.Item

158 <Grid.Item

157 full

159 full

158 as={TicketInput}

160 as={TicketInput}

161+ type={values.showTicket ? 'text' : 'password'}

159 name="ticket"

162 name="ticket"

160 label="Master Ticket"

163 label="Master Ticket"

161− type={values.showTicket ? 'text' : 'password'}

162 />

164 />

163 </Condition>

165 </Condition>

164

166

@@ -166,23 +168,23 @@ export default function Ticket({ className, goHome }) {

166 <Grid.Item

168 <Grid.Item

167 full

169 full

168 as={TicketInput}

170 as={TicketInput}

171+ type={values.showTicket ? 'text' : 'password'}

169 name="shard1"

172 name="shard1"

170 label="Shard 1"

173 label="Shard 1"

171− type={values.showTicket ? 'text' : 'password'}

172 />

174 />

173 <Grid.Item

175 <Grid.Item

174 full

176 full

175 as={TicketInput}

177 as={TicketInput}

178+ type={values.showTicket ? 'text' : 'password'}

176 name="shard2"

179 name="shard2"

177 label="Shard 2"

180 label="Shard 2"

178− type={values.showTicket ? 'text' : 'password'}

179 />

181 />

180 <Grid.Item

182 <Grid.Item

181 full

183 full

182 as={TicketInput}

184 as={TicketInput}

185+ type={values.showTicket ? 'text' : 'password'}

183 name="shard3"

186 name="shard3"

184 label="Shard 3"

187 label="Shard 3"

185− type={values.showTicket ? 'text' : 'password'}

186 />

188 />

187 </Condition>

189 </Condition>

188

190