86d702c · bridge · git.iko.soy

git.iko.soy/bridge

on master help sign in

api: use correct params with api

86d702ctomholford5 years ago

src/lib/useRoller.ts+11−9

compare with master

unifiedsplit

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

49 deriveNetworkSeedFromUrbitWallet,

50} from './keys';

51import { convertToInt } from './convertToInt';

52+import { ensureHexPrefix } from 'form/formatters';

53const spawn = async (

54const spawn = async (

54 api: any,

55 api: any,

@@ -486,17 +487,18 @@ export default function useRoller() {

486 point: Ship;

487 point: Ship;

487 to: EthAddress;

488 to: EthAddress;

488 ownerAddress: EthAddress;

489 ownerAddress: EthAddress;

490+ fromWallet: any; // TODO: wallet type

489− wallet: any; // TODO: wallet type

491+ toWallet: any; // TODO: wallet type

490 }

492 }

491

493

492 const transferPoint = async ({

494 const transferPoint = async ({

493 point,

495 point,

494 to,

496 to,

495 ownerAddress,

497 ownerAddress,

496− wallet,

498+ fromWallet,

499+ toWallet,

497 }: TransferPointParams) => {

500 }: TransferPointParams) => {

498 const patp = ob.patp(point);

501 const patp = ob.patp(point);

499− const signingKey = wallet.ownership.keys.private;

500 const azimuthPoint = await api.getPoint(point);

502 const azimuthPoint = await api.getPoint(point);

501

503

502 const { nonce } = getProxyAndNonce(azimuthPoint, ownerAddress);

504 const { nonce } = getProxyAndNonce(azimuthPoint, ownerAddress);

@@ -508,14 +510,13 @@ export default function useRoller() {

508 // TODO: extract this to a useRoller#configureKeys function?

510 // TODO: extract this to a useRoller#configureKeys function?

509 const networkRevision = convertToInt(azimuthPoint.network.keys.life, 10);

511 const networkRevision = convertToInt(azimuthPoint.network.keys.life, 10);

510 const nextRevision = networkRevision + 1;

512 const nextRevision = networkRevision + 1;

511− const seed = await deriveNetworkSeedFromUrbitWallet(wallet, nextRevision);

513+ const seed = await deriveNetworkSeedFromUrbitWallet(toWallet, nextRevision);

512 const keys = deriveNetworkKeys(seed.value);

514 const keys = deriveNetworkKeys(seed.value);

513 const keysData = {

515 const keysData = {

514− address: ownerAddress,

516+ auth: ensureHexPrefix(keys.auth.public),

515− encrypt: keys.crypt.public,

516 breach: false,

517 breach: false,

517− auth: keys.auth.public,

518 cryptoSuite: CRYPTO_SUITE_VERSION.toString(),

519+ encrypt: ensureHexPrefix(keys.crypt.public),

519 };

520 };

520 const keysFrom: From = {

521 const keysFrom: From = {

521 ship: patp,

522 ship: patp,

@@ -530,7 +531,7 @@ export default function useRoller() {

530 );

531 );

531

532

532 await api.configureKeys(

533 await api.configureKeys(

533− signTransactionHash(keysHash, Buffer.from(signingKey, 'hex')),

534+ signTransactionHash(keysHash, Buffer.from(keysSigningKey, 'hex')),

534 keysFrom,

535 keysFrom,

535 ownerAddress,

536 ownerAddress,

536 keysData

537 keysData

@@ -550,8 +551,9 @@ export default function useRoller() {

550 transferData

551 transferData

551 );

552 );

552

553

554+ const transferSigningKey = toWallet.ownership.keys.private;

553 const transferTxHash = await api.transferPoint(

555 const transferTxHash = await api.transferPoint(

554− signTransactionHash(transferHash, Buffer.from(signingKey, 'hex')),

556+ signTransactionHash(transferHash, Buffer.from(transferSigningKey, 'hex')),

555 transferFrom,

557 transferFrom,

556 to,

558 to,

557 transferData

559 transferData

src/views/Activate/ActivateButton.tsx+9−5

@@ -1,4 +1,4 @@

1−import { Box, Button } from '@tlon/indigo-react';

1+import { Button } from '@tlon/indigo-react';

2import { MouseEventHandler } from 'react';

3import withFadeable from './withFadeable';

@@ -16,7 +16,11 @@ const ActivateButton = ({

16 success = false,

17 ...rest

18}: ActivateButtonProps & React.ComponentPropsWithoutRef<'button'>) => {

19− const backgroundColor = success ? '#009F65' : 'black';

19+ const backgroundColor = disabled

20+ ? 'rgba(0,0,0,0.2)'

21+ : success

22+ ? '#009F65'

23+ : 'black';

21 return (

25 return (

22 <Button

26 <Button

@@ -25,11 +29,11 @@ const ActivateButton = ({

25 color={'white'}

29 color={'white'}

26 padding={'16px'}

30 padding={'16px'}

27 fontFamily="Inter"

31 fontFamily="Inter"

28− height={'50px'}

32+ height={'40px'}

29 fontWeight={'400'}

33 fontWeight={'400'}

30− fontSize={'18px'}

34+ fontSize={'14px'}

35+ borderRadius={'4px'}

31 disabled={disabled}

36 disabled={disabled}

32− opacity={disabled ? 0.2 : 1.0}

33 {...rest}>

37 {...rest}>

34 {children}

38 {children}

35 </Button>

39 </Button>

src/views/Activate/ActivateCodeForm.tsx+51−54

@@ -33,6 +33,7 @@ import { convertToInt } from 'lib/convertToInt';

33import { Box } from '@tlon/indigo-react';

34import { timeout } from 'lib/timeout';

35import withFadeable from './withFadeable';

36+import ActivateButton from './ActivateButton';

37interface ActivateCodeFormProps {

38interface ActivateCodeFormProps {

38 afterSubmit: VoidFunction;

39 afterSubmit: VoidFunction;

@@ -185,61 +186,57 @@ const ActivateCodeForm = ({ afterSubmit }: ActivateCodeFormProps) => {

185 flexWrap="nowrap"

186 flexWrap="nowrap"

186 height={'100%'}

187 height={'100%'}

187 justifyContent="flex-end">

188 justifyContent="flex-end">

188− <Grid>

189− <BridgeForm

189+ <BridgeForm

190− validate={validate}

190+ validate={validate}

191− onSubmit={onSubmit}

191+ onSubmit={onSubmit}

192− afterSubmit={afterSubmit}

192+ afterSubmit={afterSubmit}

193− initialValues={initialValues}>

193+ initialValues={initialValues}>

194− {({ validating, values, submitting, handleSubmit }) => (

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

195− <>

195+ <>

196− {!impliedTicket && (

196+ {!impliedTicket && (

197− <>

197+ <>

198− <Grid.Item

198+ <Grid.Item

199− full

199+ full

200− as={TicketInput}

200+ as={TicketInput}

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

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

202− name="ticket"

202+ name="ticket"

203− label="Activation Code"

203+ label="Activation Code"

204− disabled={!activationAllowed}

204+ disabled={!activationAllowed}

205− />

205+ />

206−

206+

207− <Grid.Item

207+ <Grid.Item

208− full

208+ full

209− as={CheckboxInput}

209+ as={CheckboxInput}

210− name="showTicket"

210+ name="showTicket"

211− label="Show"

211+ label="Show"

212− />

212+ />

213− </>

213+ </>

214− )}

214+ )}

215−

215+

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

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

217−

217+

218− <Grid.Item

218+ <Box

219− full

219+ display="flex"

220− as={SubmitButton}

220+ flexDirection="column"

221− className="mt4"

221+ flexWrap="nowrap"

222+ height={'100%'}

223+ width={'100%'}

224+ justifyContent="flex-end">

225+ <ActivateButton

226+ disabled={!valid || submitting}

222− handleSubmit={handleSubmit}>

227+ onClick={handleSubmit}>

223− {isWarning =>

224− validating

225− ? 'Deriving...'

226− : submitting

227− ? 'Generating...'

228+ {submitting ? 'Generating...' : 'Claim'}

228− : isWarning

229+ </ActivateButton>

229− ? 'Continue Activation'

230+ </Box>

230− : 'Claim'

231+

231− }

232+ {!activationAllowed && (

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

234+ For your security, please access Bridge on a desktop device.

232 </Grid.Item>

235 </Grid.Item>

233−

236+ )}

234− {!activationAllowed && (

235− <Grid.Item full as={WarningBox} className="mt4">

236− For your security, please access Bridge on a desktop device.

237− </Grid.Item>

238− )}

239− </>

237+ </>

240− )}

238+ )}

241− </BridgeForm>

239+ </BridgeForm>

242− </Grid>

243 </Box>

240 </Box>

244 );

241 );

245};

242};

src/views/Activate/MasterKeyDownload.tsx+11−11

@@ -35,7 +35,6 @@ const MasterKeyDownload = () => {

36 const [paper, setPaper] = useState(Nothing());

37 const [triggerAnimation, setTriggerAnimation] = useState<boolean>(false);

38− const [downloaded, setDownloaded] = useState<boolean>(false);

40 const pointAsString = derivedPoint.matchWith({

39 const pointAsString = derivedPoint.matchWith({

41 Nothing: () => '',

40 Nothing: () => '',

@@ -47,8 +46,7 @@ const MasterKeyDownload = () => {

47 //TODO could be deduplicated with useKeyfileGenerator's logic

46 //TODO could be deduplicated with useKeyfileGenerator's logic

48 const filename = ob.patp(point).slice(1) + '-1.key';

47 const filename = ob.patp(point).slice(1) + '-1.key';

49 await downloadWallet(paper.getOrElse([]), netkey, filename);

48 await downloadWallet(paper.getOrElse([]), netkey, filename);

50− setDownloaded(true);

51− }, [paper, wallet, point, setDownloaded]);

49+ }, [paper, wallet, point]);

53 // sync paper value to activation state

51 // sync paper value to activation state

54 useEffect(

52 useEffect(

@@ -70,7 +68,7 @@ const MasterKeyDownload = () => {

70 }, [download, setIsIn, push, names.CONFIRM]);

68 }, [download, setIsIn, push, names.CONFIRM]);

72 const header = useMemo(() => {

70 const header = useMemo(() => {

73− return triggerAnimation ? (

71+ return (

74 <Box>

72 <Box>

75 <ActivateHeader content={'Backup your Master Key.'} />

73 <ActivateHeader content={'Backup your Master Key.'} />

76 <ActivateParagraph

74 <ActivateParagraph

@@ -79,16 +77,16 @@ const MasterKeyDownload = () => {

79 }

77 }

80 />

78 />

81 </Box>

79 </Box>

82− ) : null;

80+ );

83− }, [triggerAnimation]);

81+ }, []);

85 const footer = useMemo(() => {

83 const footer = useMemo(() => {

86− return triggerAnimation ? (

84+ return (

87 <ActivateButton onClick={onDownloadClick}>

85 <ActivateButton onClick={onDownloadClick}>

88 {'Download Backup (Passport)'}

86 {'Download Backup (Passport)'}

89 </ActivateButton>

87 </ActivateButton>

90− ) : null;

88+ );

91− }, [onDownloadClick, triggerAnimation]);

89+ }, [onDownloadClick]);

93 const delayedReveal = useCallback(async () => {

91 const delayedReveal = useCallback(async () => {

94 setTimeout(() => {

92 setTimeout(() => {

@@ -107,7 +105,9 @@ const MasterKeyDownload = () => {

107

105

108 return (

106 return (

109 <>

107 <>

110− <ActivateView header={header} footer={footer}>

108+ <ActivateView

109+ header={triggerAnimation && header}

110+ footer={triggerAnimation && footer}>

111 <Box

112 alignItems={'center'}

113 display={'flex'}

@@ -119,7 +119,7 @@ const MasterKeyDownload = () => {

119 <DangerBox>Do not share this with anyone else!</DangerBox>

120 )}

121 {ticket && (

122− <MasterKeyPresenter overrideFadeIn={true} ticket={ticket} />

122+ <MasterKeyPresenter ticket={ticket} overrideFadeIn={true} />

123 )}

124 {triggerAnimation && <MasterKeyCopy text={ticket} />}

125 </Box>

src/views/Activate/MasterKeyReveal.tsx+11−8

@@ -22,13 +22,14 @@ const MasterKeyReveal = () => {

22 }, [names.DOWNLOAD, push]);

24 const onRevealClick = useCallback(async () => {

25+ setTriggerAnimation(false);

25 setIsIn(false);

26 setIsIn(false);

26 await timeout(DEFAULT_FADE_TIMEOUT); // Pause for UI fade animation

27 await timeout(DEFAULT_FADE_TIMEOUT); // Pause for UI fade animation

27 goToDownload();

28 goToDownload();

28 }, [goToDownload, setIsIn]);

29 }, [goToDownload, setIsIn]);

30 const header = useMemo(() => {

31 const header = useMemo(() => {

31− return triggerAnimation ? (

32+ return (

32 <Box>

33 <Box>

33 <ActivateHeader content={'Here is your Master Key.'} />

34 <ActivateHeader content={'Here is your Master Key.'} />

34 <ActivateParagraph

35 <ActivateParagraph

@@ -37,11 +38,11 @@ const MasterKeyReveal = () => {

37 }

38 }

38 />

39 />

39 </Box>

40 </Box>

40− ) : null;

41+ );

41− }, [triggerAnimation]);

42+ }, []);

43 const footer = useMemo(() => {

44 const footer = useMemo(() => {

44− return triggerAnimation ? (

45+ return (

45 <ActivateButton onClick={onRevealClick}>

46 <ActivateButton onClick={onRevealClick}>

46 <Icon

47 <Icon

47 display="inline-block"

48 display="inline-block"

@@ -51,8 +52,8 @@ const MasterKeyReveal = () => {

51 />

52 />

52   Reveal

53   Reveal

53 </ActivateButton>

54 </ActivateButton>

54− ) : null;

55+ );

55− }, [onRevealClick, triggerAnimation]);

56+ }, [onRevealClick]);

57 const delayedFadeIn = useCallback(async () => {

58 const delayedFadeIn = useCallback(async () => {

58 setTimeout(() => {

59 setTimeout(() => {

@@ -71,7 +72,9 @@ const MasterKeyReveal = () => {

72 return (

73 return (

73 <>

74 <>

74− <ActivateView header={header} footer={footer}>

75+ <ActivateView

76+ header={triggerAnimation && header}

77+ footer={triggerAnimation && footer}>

75 <Box

78 <Box

76 alignItems={'center'}

79 alignItems={'center'}

77 display={'flex'}

80 display={'flex'}

@@ -91,7 +94,7 @@ const MasterKeyReveal = () => {

91 </Box>

94 </Box>

92 </ActivateView>

95 </ActivateView>

93 {triggerAnimation && (

96 {triggerAnimation && (

94− <ActivateSteps currentStep={0} totalSteps={4} fadeIn={true} />

97+ <ActivateSteps currentStep={0} totalSteps={4} overrideFadeIn={true} />

95 )}

98 )}

96 </>

99 </>

97 );

100 );

src/views/Activate/MasterKeyTransfer.tsx+9−3

@@ -14,7 +14,12 @@ import DangerBox from './DangerBox';

15const MasterKeyTransfer = () => {

16 const { api, transferPoint } = useRoller();

17+ const {

18+ derivedPatp,

19+ derivedPoint,

20+ derivedWallet,

21+ inviteWallet,

17− const { derivedPatp, derivedPoint, derivedWallet } = useActivateFlow();

22+ } = useActivateFlow();

18 const [error, setError] = useState();

23 const [error, setError] = useState();

20 const claimPoint = useCallback(async () => {

25 const claimPoint = useCallback(async () => {

@@ -26,13 +31,14 @@ const MasterKeyTransfer = () => {

26 point: derivedPoint.value,

31 point: derivedPoint.value,

27 to: derivedWallet.value.ownership.address,

32 to: derivedWallet.value.ownership.address,

28 ownerAddress: l2point.ownership?.owner?.address!,

33 ownerAddress: l2point.ownership?.owner?.address!,

29− wallet: derivedWallet.value,

34+ toWallet: derivedWallet.value,

35+ fromWallet: inviteWallet.value,

30 });

36 });

31 } catch (error) {

37 } catch (error) {

32 console.error(error);

38 console.error(error);

33 setError(error);

39 setError(error);

34 }

40 }

35− }, [api, derivedPoint.value, derivedWallet.value, transferPoint]);

41+ }, [api, derivedPoint.value, derivedWallet, inviteWallet, transferPoint]);

37 useFadeIn();

43 useFadeIn();