git.iko.soy/bridge
on 97de700 help sign in
bridge/src/views/Point.js
283 lines 7.9 kB history raw
1import React, { useCallback, useState } from 'react';
2import cn from 'classnames';
3import { Just } from 'folktale/maybe';
4import { Grid, Flex, Button } from 'indigo-react';
5import { azimuth } from 'azimuth-js';
7import { usePointCursor } from 'store/pointCursor';
8import { useWallet } from 'store/wallet';
10import View from 'components/View';
11import Greeting from 'components/Greeting';
12import Passport from 'components/Passport';
13import Blinky from 'components/Blinky';
14import BarGraph from 'components/BarGraph';
15import Chip from 'components/Chip';
16import InviteSigilList from 'components/InviteSigilList';
17import { ForwardButton, HostingButton } from 'components/Buttons';
18import CopyButton from 'components/CopyButton';
19import { matchBlinky } from 'components/Blinky';
20import DownloadSigilButton from 'components/DownloadSigilButton';
22import * as need from 'lib/need';
23import useInvites from 'lib/useInvites';
24import { useSyncOwnedPoints } from 'lib/useSyncPoints';
25import useCurrentPermissions from 'lib/useCurrentPermissions';
26import { useLocalRouter } from 'lib/LocalRouter';
28import Inviter from 'views/Invite/Inviter';
30export default function Point() {
31 const { pop, push, names } = useLocalRouter();
32 const { pointCursor } = usePointCursor();
34 const { wallet } = useWallet();
35 const point = need.point(pointCursor);
37 const {
38 isParent,
39 isActiveOwner,
40 canManage,
41 canSpawn,
42 canVote,
43 } = useCurrentPermissions();
45 // fetch the invites for the current cursor
46 const invites = useInvites(point);
47 const {
48 availableInvites,
49 sentInvites,
50 acceptedInvites,
51 pendingPoints,
52 acceptedPoints,
53 } = invites;
55 const showInvites = !(
56 acceptedInvites.getOrElse(0) === 0 && sentInvites.getOrElse(0) === 0
57 );
59 const hasInvites = showInvites || availableInvites.getOrElse(0) !== 0;
61 const _totalInvites =
62 sentInvites.getOrElse(0) + availableInvites.getOrElse(0);
63 const _pendingInvites = pendingPoints.getOrElse([]).length;
65 const loadedInvites = Just.hasInstance(availableInvites);
66 //
67 // availableInvites.getOrElse(0) === 0
69 const goAdmin = useCallback(() => push(names.ADMIN), [push, names]);
71 const goSenate = useCallback(() => push(names.SENATE), [push, names]);
73 const goSigil = useCallback(() => push(names.SIGIL_GENERATOR), [push, names]);
75 const goCohort = useCallback(() => push(names.INVITE_COHORT), [push, names]);
77 const goUrbitOS = useCallback(() => push(names.URBIT_OS), [push, names]);
79 const goPartiesSetPoolSize = useCallback(
80 () => push(names.PARTY_SET_POOL_SIZE),
81 [push, names]
82 );
84 const goIssuePoint = useCallback(() => push(names.ISSUE_CHILD), [
85 names.ISSUE_CHILD,
86 push,
87 ]);
89 const isPlanet = azimuth.getPointSize(point) === azimuth.PointSize.Planet;
91 const [showInviteForm, setShowInviteForm] = useState(false);
93 const goBoot = useCallback(() => push(names.BOOT), [push, names]);
94 const goHosting = useCallback(() => push(names.HOSTING), [push, names]);
96 const inviteButton = (() => {
97 if (azimuth.getPointSize(point) === azimuth.PointSize.Star) {
98 return (
99 <>
100 <Grid.Item
101 full
102 as={ForwardButton}
103 disabled={!isActiveOwner}
104 onClick={goPartiesSetPoolSize}>
105 Manage Invite Pools
106 </Grid.Item>
107 <Grid.Divider />
108 </>
109 );
110 }
112 return null;
113 })();
115 const senateButton = (() => {
116 if (azimuth.getPointSize(point) !== azimuth.PointSize.Galaxy) {
117 return null;
118 }
119 return (
120 <>
121 <Grid.Item
122 full
123 as={ForwardButton}
124 disabled={!canVote}
125 onClick={goSenate}>
126 Senate
127 </Grid.Item>
128 <Grid.Divider />
129 </>
130 );
131 })();
133 // sync the current cursor
134 useSyncOwnedPoints([point]);
136 const address = need.addressFromWallet(wallet);
138 return (
139 <View pop={pop} inset>
140 <Greeting point={point} />
141 <Passport
142 point={Just(point)}
143 address={Just(address)}
144 animationMode={'slide'}
145 />
146 <Grid gap={3}>
147 {isPlanet && hasInvites && (
148 <>
149 <Grid.Item cols={[1, 11]}>
150 Invite Group
151 <br />
152 </Grid.Item>
154 <Grid.Item
155 className={cn('t-right underline pointer-hover', {
156 gray4: sentInvites.getOrElse(0) === 0,
157 })}
158 onClick={goCohort}
159 cols={[11, 13]}>
160 View
161 </Grid.Item>
162 <Grid.Item full>
163 <Flex align="center">
164 <Flex.Item>
165 {acceptedInvites.getOrElse(0)} / {_totalInvites}
166 </Flex.Item>
167 {_pendingInvites > 0 && (
168 <Flex.Item as={Chip} className="bg-yellow1 yellow4">
169 {_pendingInvites} pending
170 </Flex.Item>
171 )}
172 </Flex>
173 </Grid.Item>
175 {showInvites && (
176 <>
177 <Grid.Item
178 full
179 as={BarGraph}
180 available={availableInvites}
181 sent={sentInvites}
182 accepted={acceptedInvites}
183 />
184 <Grid.Item
185 full
186 as={InviteSigilList}
187 pendingPoints={pendingPoints}
188 acceptedPoints={acceptedPoints}
189 />
190 </>
191 )}
192 {!showInvites && (
193 <>
194 <Grid.Item full className="b-gray4 b-dotted b1 self-center">
195 <div className="p4 pv8 t-center gray4">
196 Start your invite group by adding members
197 </div>
198 </Grid.Item>
199 </>
200 )}
201 {!showInviteForm && availableInvites.getOrElse(0) > 0 && (
202 <Grid.Item
203 full
204 solid
205 as={Button}
206 center
207 onClick={() => setShowInviteForm(true)}>
208 Add Members
209 </Grid.Item>
210 )}
211 {showInviteForm && <Inviter />}
212 <Grid.Item full className="mb2" />
213 </>
214 )}
215 {!loadedInvites && isPlanet && (
216 <Grid.Item className="mv2" full>
217 Invite Group <Blinky />
218 </Grid.Item>
219 )}
220 </Grid>
221 <Grid className="pt2">
222 {inviteButton}
223 <Grid.Item full as={ForwardButton} onClick={goSigil}>
224 Sigil
225 </Grid.Item>
226 <Grid.Divider />
227 <Grid.Item
228 full
229 as={ForwardButton}
230 disabled={!canManage}
231 onClick={goUrbitOS}>
232 Urbit OS
233 </Grid.Item>
234 <Grid.Divider />
235 <Grid.Item
236 full
237 as={ForwardButton}
238 disabled={!canManage}
239 onClick={goAdmin}>
240 Admin
241 </Grid.Item>
242 <Grid.Divider />
244 {isParent && (
245 <>
246 <Grid.Item
247 full
248 as={ForwardButton}
249 disabled={!canSpawn}
250 onClick={goIssuePoint}>
251 Issue Point
252 </Grid.Item>
253 <Grid.Divider />
254 </>
255 )}
256 {senateButton}
257 <Grid.Item
258 full
259 as={ForwardButton}
260 detail="Boot your computer"
261 onClick={goBoot}>
262 Boot Urbit OS
263 </Grid.Item>
265 <Grid.Item full as={HostingButton} onClick={goHosting} />
266 <Grid.Divider />
268 <Grid.Item
269 full
270 as={ForwardButton}
271 accessory={code && <CopyButton text={code} />}
272 detail={code || notice}
273 disabled={!code}
274 detailClassName="mono">
275 Login Code
276 </Grid.Item>
277 <Grid.Divider />
278 <Grid.Item full as={DownloadSigilButton} point={point} />
279 <Grid.Divider />
280 </Grid>
281 </View>
282 );