git.iko.soy/bridge
on 41620df help sign in
bridge/src/views/Invite.js
91 lines 2.7 kB history raw
1import React from 'react';
2import * as need from 'lib/need';
3import { Grid, Text } from 'indigo-react';
5import { usePointCursor } from 'store/pointCursor';
6import { useHistory } from 'store/history';
8import View from 'components/View';
9import Crumbs from 'components/Crumbs';
10import Highlighted from 'components/Highlighted';
11import { matchBlinky } from 'components/Blinky';
13import useInvites from 'lib/useInvites';
14import { useSyncOwnedPoints } from 'lib/useSyncPoints';
15import useCurrentPointName from 'lib/useCurrentPointName';
16import useRouter from 'lib/useRouter';
17import { LocalRouterProvider } from 'lib/LocalRouter';
19import InviteUrl from './Invite/InviteUrl';
20import InviteEmail from './Invite/InviteEmail';
21import ViewHeader from 'components/ViewHeader';
22import MiniBackButton from 'components/MiniBackButton';
24const NAMES = {
25 URL: 'URL',
26 EMAIL: 'EMAIL',
27};
29const VIEWS = {
30 URL: InviteUrl,
31 EMAIL: InviteEmail,
32};
34export default function Invite() {
35 const history = useHistory();
36 const { Route, ...router } = useRouter({
37 names: NAMES,
38 views: VIEWS,
39 initialRoutes: [{ key: NAMES.URL }],
40 });
41 const { pointCursor } = usePointCursor();
42 const point = need.point(pointCursor);
43 const name = useCurrentPointName();
45 // sync the current point
46 useSyncOwnedPoints([point]);
48 // get the invites for the current point
49 const { availableInvites, sentInvites, acceptedInvites } = useInvites(point);
51 // number or loading character
52 const availableInvitesText = matchBlinky(availableInvites);
53 const sentInvitesText = matchBlinky(sentInvites);
54 const acceptedInvitesText = matchBlinky(acceptedInvites);
56 return (
57 <View inset>
58 <LocalRouterProvider value={router}>
59 <Grid className="mb4">
60 <Grid.Item
61 full
62 as={Crumbs}
63 routes={[
64 {
65 text: name,
66 action: () => history.pop(),
67 },
68 {
69 text: 'Invite',
70 },
71 ]}
72 className="mb4"
73 />
74 <Grid.Item full as={MiniBackButton} onClick={() => history.pop()} />
75 <Grid.Item full as={ViewHeader}>
76 Invite
77 </Grid.Item>
78 <Grid.Item as={Text} className="f5" full>
79 You currently have{' '}
80 <Highlighted>{availableInvitesText} invitations</Highlighted> left.
81 <br />
82 Out of the <Highlighted>{sentInvitesText}</Highlighted> invites you
83 sent, <Highlighted>{acceptedInvitesText}</Highlighted> have been
84 accepted.
85 </Grid.Item>
86 </Grid>
87 <Route />
88 </LocalRouterProvider>
89 </View>
90 );