git.iko.soy/bridge
on 368f024 help sign in
bridge/src/views/Activate/ActivateCode.tsx
52 lines 1.7 kB history raw
1import { useCallback } from 'react';
3import View from 'components/View';
4import ActivateView from './ActivateView';
6import { useLocalRouter } from 'lib/LocalRouter';
7import useImpliedTicket from 'lib/useImpliedTicket';
8import useHasDisclaimed from 'lib/useHasDisclaimed';
10import { FadeablePointPresenter as PointPresenter } from './PointPresenter';
11import { Box, Text } from '@tlon/indigo-react';
12import { FadeableActivateHeader as ActivateHeader } from './ActivateHeader';
13import { FadeableActivateCodeForm as ActivateCodeForm } from './ActivateCodeForm';
14import useFadeIn from './useFadeIn';
16export default function ActivateCode() {
17 const { names, push } = useLocalRouter();
18 const { impliedPatp, impliedTicket } = useImpliedTicket();
19 const [hasDisclaimed] = useHasDisclaimed();
21 const goToMasterKey = useCallback(() => {
22 if (!hasDisclaimed) {
23 push(names.DISCLAIMER, { next: names.MASTER_KEY });
24 } else {
25 push(names.MASTER_KEY);
26 }
27 }, [hasDisclaimed, names.DISCLAIMER, names.MASTER_KEY, push]);
29 // Fade in on load
30 useFadeIn();
32 return (
33 <View centered={true}>
34 <ActivateView
35 header={<ActivateHeader content={'Welcome. This is your Urbit.'} />}
36 footer={<ActivateCodeForm afterSubmit={goToMasterKey} />}>
37 <Box
38 alignItems={'center'}
39 display={'flex'}
40 flexDirection={'column'}
41 flexWrap={'nowrap'}
42 height={'100%'}
43 justifyContent={'center'}>
44 {!impliedTicket && (
45 <Text className="mb2">Enter your activation code to continue.</Text>
46 )}
47 {impliedPatp && <PointPresenter patp={impliedPatp} />}
48 </Box>
49 </ActivateView>
50 </View>
51 );