@@ -1,5 +1,4 @@
1−import React, { useCallback, useEffect, useState } from 'react';
2−import cn from 'classnames';
1+import { useCallback, useEffect, useMemo, useState } from 'react';
32import { azimuth } from 'azimuth-js';
43import { Just } from 'folktale/maybe';
54import { Grid, Flex } from 'indigo-react';
@@ -13,9 +12,6 @@ import View from 'components/View';
1312import Greeting from 'components/Greeting';
1413import Passport from 'components/Passport';
1514import Blinky from 'components/Blinky';
16−import BarGraph from 'components/BarGraph';
17−import Chip from 'components/Chip';
18−import InviteSigilList from 'components/InviteSigilList';
1915import { ForwardButton } from 'components/Buttons';
2016import L2PointHeader from 'components/L2/Headers/L2PointHeader';
2117import LayerIndicator from 'components/L2/LayerIndicator';
@@ -23,185 +19,67 @@ import Card from 'components/L2/Card';
2319
2420import * as need from 'lib/need';
2521import useInvites from 'lib/useInvites';
26−import { useSyncExtras } from 'lib/useSyncPoints';
2722import useCurrentPermissions from 'lib/useCurrentPermissions';
2823import { useLocalRouter } from 'lib/LocalRouter';
29−import Inviter from 'views/Invite/Inviter';
3024import useRoller from 'lib/useRoller';
3125
3226import './Point.scss';
3327import { isL2 } from 'lib/utils/roller';
3428import { isDevelopment } from 'lib/flags';
35−import { convertToInt } from 'lib/convertToInt';
3629import { usePointCache } from 'store/pointCache';
3730import Modal from 'components/L2/Modal';
3831import { isPlanet } from 'lib/utils/point';
39−
40−function InviteForm({
41− showInviteForm,
42− setShowInviteForm,
43− acceptedInvites,
44− acceptedPoints,
45− availableInvites,
46− goCohort,
47− pendingPoints,
48− sentInvites,
49− showInvites,
50−}) {
51− const _totalInvites =
52− sentInvites.getOrElse(0) + availableInvites.getOrElse(0);
53− const _pendingInvites = pendingPoints.getOrElse([]).length;
54−
55− return (
56− <>
57− <Grid.Item cols={[1, 11]}>
58− Invite Group
59− <br />
60− </Grid.Item>
61−
62− <Grid.Item
63− className={cn('t-right underline pointer-hover', {
64− gray4: sentInvites.getOrElse(0) === 0,
65− })}
66− onClick={goCohort}
67− cols={[11, 13]}>
68− View
69− </Grid.Item>
70− <Grid.Item full>
71− <Flex align="center">
72− <Flex.Item>
73− {acceptedInvites.getOrElse(0)} / {_totalInvites}
74− </Flex.Item>
75− {_pendingInvites > 0 && (
76− <Flex.Item as={Chip} className="bg-yellow1 yellow4">
77− {_pendingInvites} pending
78− </Flex.Item>
79− )}
80− </Flex>
81− </Grid.Item>
82−
83− {showInvites && (
84− <>
85− <Grid.Item
86− full
87− as={BarGraph}
88− available={availableInvites}
89− sent={sentInvites}
90− accepted={acceptedInvites}
91− />
92− <Grid.Item
93− full
94− as={InviteSigilList}
95− pendingPoints={pendingPoints}
96− acceptedPoints={acceptedPoints}
97− />
98− </>
99− )}
100− {!showInvites && (
101− <>
102− <Grid.Item full className="b-gray4 b-dotted b1 self-center">
103− <div className="p4 pv8 t-center gray4">
104− Start your invite group by adding members
105− </div>
106− </Grid.Item>
107− </>
108− )}
109− {!showInviteForm && availableInvites.getOrElse(0) > 0 && (
110− <Grid.Item
111− full
112− solid
113− as={Button}
114− center
115− onClick={() => setShowInviteForm(true)}>
116− Add Members
117− </Grid.Item>
118− )}
119− {showInviteForm && <Inviter />}
120− <Grid.Item full className="mb2" />
121− </>
122− );
123−}
32+import { useHasNetworkKeysSet } from 'lib/useHasNetworkKeysSet';
33+import { InviteForm } from './InviteForm';
12434
12535export default function Point() {
12636 const { pop, push, names } = useLocalRouter();
127− const { wallet, authToken } = useWallet();
37+ const { wallet } = useWallet();
12838 const { pointCursor } = usePointCursor();
12939 const point = need.point(pointCursor);
130− const { getDetails } = usePointCache();
131− // sync the current cursor
132− useSyncExtras([point]);
133−
40+ const { syncExtras } = usePointCache();
13441 const { api, getInvites } = useRoller();
13542 const {
13643 pendingTransactions,
13744 nextRoll,
13845 invites,
13946 setCurrentPoint,
140− setPendingTransactions,
141− currentL2,
14247 setNonces,
14348 increaseNonce,
144− nonces,
14549 } = useRollerStore();
146−
147− // const pointSize = azimuth.getPointSize(point);
148− // const details = need.details(getDetails(point));
149− // const details = getDetails(point);
150− // console.log(details);
151− // const isStarOrGalaxy = pointSize !== azimuth.PointSize.Planet;
152− // const networkRevision =
153− // Just.hasInstance(details) &&
154− // convertToInt(need.details(details).keyRevisionNumber, 10);
155− // console.log(networkRevision);
156− const networkKeysNotSet = false;
157− // networkRevision && !currentL2 && isStarOrGalaxy && networkRevision === 0;
158−
159− const [showModal, setShowModal] = useState(networkKeysNotSet);
160−
161− // useEffect(() => {
162− // if (networkKeysNotSet) {
163− // setShowModal(true);
164− // }
165− // }, [networkKeysNotSet]);
166−
167− useEffect(
168− () => {
169− const loadL2Info = async () => {
170− const getTransactions = async () => {
171− const pointInfo = await api.getPoint(Number(point));
172− const pendingTxs = await api.getPendingByShip(Number(point));
173− if (isDevelopment) {
174− console.log('POINT INFO', pointInfo);
175− }
176− setNonces(point, pointInfo.ownership);
177−
178− for (let index = 0; index < pendingTxs.length; index++) {
179− const proxy = pendingTxs[index].rawTx?.from?.proxy;
180− console.log(pointInfo.ownership, proxy);
181− increaseNonce(point, proxy);
182− }
183− setCurrentPoint(pointInfo);
184− getInvites(isL2(pointInfo.dominion));
185− };
186−
187− getTransactions();
188− };
189−
190− loadL2Info();
191− },
192− [
193− // TODO: adding this causes the effect to be called constantly...
194− // api,
195− // point,
196− // authToken,
197− // setPendingTransactions,
198− // nonces,
199− // setCurrentPoint,
200− // increaseNonce,
201− // getInvites,
202− // setNonces,
203− ]
204− );
50+ const networkKeysSet = useHasNetworkKeysSet();
51+ const [showModal, setShowModal] = useState(!networkKeysSet);
52+
53+ const loadL1Info = useCallback(async () => {
54+ await syncExtras(point);
55+ }, [point, syncExtras]);
56+
57+ const loadL2Info = useCallback(async () => {
58+ const getTransactions = async () => {
59+ const pointInfo = await api.getPoint(Number(point));
60+ const pendingTxs = await api.getPendingByShip(Number(point));
61+ if (isDevelopment) {
62+ console.log('POINT INFO', pointInfo);
63+ }
64+ setNonces(point, pointInfo.ownership);
65+
66+ for (let index = 0; index < pendingTxs.length; index++) {
67+ const proxy = pendingTxs[index].rawTx?.from?.proxy;
68+ console.log(pointInfo.ownership, proxy);
69+ increaseNonce(point, proxy);
70+ }
71+ setCurrentPoint(pointInfo);
72+ await getInvites(isL2(pointInfo.dominion));
73+ };
74+
75+ await getTransactions();
76+ }, [api, point, setCurrentPoint, increaseNonce, getInvites, setNonces]);
77+
78+ useEffect(() => {
79+ loadL1Info();
80+ loadL2Info();
81+ // eslint-disable-next-line react-hooks/exhaustive-deps
82+ }, [point]);
20583
20684 const { isParent, canManage, canSpawn, canVote } = useCurrentPermissions();
20785
@@ -222,8 +100,6 @@ export default function Point() {
222100 const hasInvites = showInvites || availableInvites.getOrElse(0) !== 0;
223101
224102 const loadedInvites = Just.hasInstance(availableInvites);
225− //
226− // availableInvites.getOrElse(0) === 0
227103
228104 const goSenate = useCallback(() => push(names.SENATE), [push, names]);
229105
@@ -262,13 +138,13 @@ export default function Point() {
262138 );
263139 })();
264140
265− // sync the current cursor
266− useSyncExtras([point]);
267−
268141 const address = need.addressFromWallet(wallet);
269− const numPending = pendingTransactions.filter(
270− ({ rawTx }) => rawTx?.tx?.type === 'spawn'
271− ).length;
142+
143+ const numPending = useMemo(() => {
144+ return pendingTransactions.filter(
145+ ({ rawTx }) => rawTx?.tx?.type === 'spawn'
146+ ).length;
147+ }, [pendingTransactions]);
272148
273149 return (
274150 <View
@@ -280,7 +156,7 @@ export default function Point() {
280156 <L2PointHeader
281157 hideTimer={!!numPending}
282158 numInvites={invites.length}
283− hideInvites={networkKeysNotSet}
159+ hideInvites={!networkKeysSet}
284160 />
285161 }>
286162 <Greeting point={point} />