git.iko.soy/bridge
on df1910f help sign in
bridge/src/views/ViewPoint.js
61 lines 1.7 kB history raw
1import React, { useCallback, useState } from 'react';
2import Maybe from 'folktale/maybe';
3import * as ob from 'urbit-ob';
5import { H1, P } from '../components/old/Base';
7import { useHistory } from 'store/history';
8import { usePointCursor } from 'store/pointCursor';
10import { ROUTE_NAMES } from 'lib/routeNames';
12import View from 'components/View';
13import { ForwardButton } from 'components/Buttons';
14import { PointInput } from 'components/Inputs';
16export default function ViewPoint() {
17 const history = useHistory();
18 const { setPointCursor } = usePointCursor();
19 const [pointName, setPointName] = useState('');
20 const [pass, setPass] = useState(false);
21 const [error, setError] = useState();
22 const [focused, setFocused] = useState(true);
24 const disabled = !pass;
25 const goForward = useCallback(() => {
26 setPointCursor(Maybe.Just(parseInt(ob.patp2dec(pointName), 10)));
27 // ^ pointCursor expects native number type, not string
28 history.popAndPush(ROUTE_NAMES.POINT);
29 }, [setPointCursor, history, pointName]);
31 return (
32 <View>
33 <H1>View a Point</H1>
35 <P>Enter a point name to view its public information.</P>
37 <PointInput
38 name="point"
39 label="Point Name"
40 initialValue={pointName}
41 onValue={setPointName}
42 pass={pass}
43 onPass={setPass}
44 error={error}
45 onError={setError}
46 focused={focused}
47 onFocus={setFocused}
48 onEnter={goForward}
49 autoFocus
50 />
52 <ForwardButton
53 className="mt3"
54 disabled={disabled}
55 onClick={goForward}
56 solid>
57 Continue
58 </ForwardButton>
59 </View>
60 );