git.iko.soy/bridge
on 42e34eb help sign in
bridge/src/views/Activate/ActivateCode.tsx
59 lines 2.0 kB history raw
1import { useCallback, useMemo } 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 { ReactComponent as PlaceholderSigil } from 'assets/blank-planet-sigil.svg';
11import { FadeablePointPresenter as PointPresenter } from './PointPresenter';
12import { Box } from '@tlon/indigo-react';
13import { FadeableActivateHeader as ActivateHeader } from './ActivateHeader';
14import { FadeableActivateCodeForm as ActivateCodeForm } from './ActivateCodeForm';
15import useFadeIn from './useFadeIn';
17export default function ActivateCode() {
18 const { names, push }: any = useLocalRouter();
19 const { impliedPatp, impliedTicket } = useImpliedTicket();
20 const [hasDisclaimed] = useHasDisclaimed();
22 const goToMasterKey = useCallback(() => {
23 if (!hasDisclaimed) {
24 push(names.DISCLAIMER, { next: names.MASTER_KEY });
25 } else {
26 push(names.MASTER_KEY);
27 }
28 }, [hasDisclaimed, names.DISCLAIMER, names.MASTER_KEY, push]);
30 // Fade in on load
31 useFadeIn();
33 const hasInitialValues = useMemo(
34 () => Boolean(impliedTicket && impliedPatp),
35 [impliedTicket, impliedPatp]
36 );
38 return (
39 <View inset>
40 <ActivateView
41 hideBack={hasInitialValues}
42 header={<ActivateHeader content={'Planet Code'} />}
43 footer={<ActivateCodeForm afterSubmit={goToMasterKey} />}>
44 <Box className="flex-col align-center justify-center w-full h-full">
45 {!hasInitialValues && (
46 <Box className="mb2 sans gray5" fontSize={14}>
47 Enter your planet code below
48 </Box>
49 )}
50 {impliedPatp ? (
51 <PointPresenter patp={impliedPatp} className="mb6 mt7" />
52 ) : (
53 <PlaceholderSigil className="mv9" style={{ marginTop: 78 }} />
54 )}
55 </Box>
56 </ActivateView>
57 </View>
58 );