8906361 · bridge · git.iko.soy

src/Bridge.js → src/Bridge.tsxrenamed+24−14

compare with master

unifiedsplit

@@ -1,4 +1,3 @@

1−import React from 'react';

2import { useEffect } from 'react';

1import { useEffect } from 'react';

3import { Just, Nothing } from 'folktale/maybe';

2import { Just, Nothing } from 'folktale/maybe';

4import { IndigoApp } from 'indigo-react';

3import { IndigoApp } from 'indigo-react';

@@ -26,6 +25,8 @@ import { useRollerStore } from 'store/rollerStore';

26import { Box } from '@tlon/indigo-react';

25import { Box } from '@tlon/indigo-react';

27import LoadingOverlay from 'components/L2/LoadingOverlay';

26import LoadingOverlay from 'components/L2/LoadingOverlay';

28import { useRollerPoller } from 'lib/useRollerPoller';

27import { useRollerPoller } from 'lib/useRollerPoller';

28+import { BrowserRouter, Route, Routes } from 'react-router-dom';

29+import InviteCohort from 'views/Invite/Cohort';

29

30

30const INITIAL_NETWORK_TYPE = isRopsten

31const INITIAL_NETWORK_TYPE = isRopsten

31 ? NETWORK_TYPES.ROPSTEN

32 ? NETWORK_TYPES.ROPSTEN

@@ -39,8 +40,8 @@ const IS_STUBBED = isDevelopment && SHOULD_STUB_LOCAL;

39

40

40const INITIAL_WALLET = IS_STUBBED

41const INITIAL_WALLET = IS_STUBBED

41 ? walletFromMnemonic(

42 ? walletFromMnemonic(

42− process.env.REACT_APP_DEV_MNEMONIC,

43+ process.env.REACT_APP_DEV_MNEMONIC as string,

43− process.env.REACT_APP_HD_PATH

44+ process.env.REACT_APP_HD_PATH as string

44 )

45 )

45 : undefined;

46 : undefined;

46const INITIAL_MNEMONIC = IS_STUBBED

47const INITIAL_MNEMONIC = IS_STUBBED

@@ -94,7 +95,8 @@ function Bridge() {

94 }, []);

95 }, []);

95

96

96 return (

97 return (

98+ <WithErrorBoundary

97− <WithErrorBoundary render={error => <GlobalErrorBoundary error={error} />}>

99+ render={(error: Error) => <GlobalErrorBoundary error={error} />}>

98 <Provider

100 <Provider

99 views={ROUTES}

101 views={ROUTES}

100 names={ROUTE_NAMES}

102 names={ROUTE_NAMES}

@@ -103,16 +105,24 @@ function Bridge() {

103 initialWallet={INITIAL_WALLET}

105 initialWallet={INITIAL_WALLET}

104 initialMnemonic={INITIAL_MNEMONIC}

106 initialMnemonic={INITIAL_MNEMONIC}

105 initialPointCursor={INITIAL_POINT_CURSOR}>

107 initialPointCursor={INITIAL_POINT_CURSOR}>

106− <IndigoApp>

108+ <BrowserRouter>

109+ <IndigoApp>

107− <ThemeProvider theme={light}>

110+ <ThemeProvider theme={light}>

108− <Router />

111+ <Router />

112+ <Routes>

113+ <Route path="/" element={null} />

114+ <Route path="/point/:point">

115+ <Route path="invites" element={<InviteCohort />} />

116+ </Route>

117+ </Routes>

109− </ThemeProvider>

118+ </ThemeProvider>

110− </IndigoApp>

119+ </IndigoApp>

111− <Modal show={modalText !== undefined} hide={() => setModalText()}>

120+ <Modal show={modalText !== undefined} hide={() => setModalText('')}>

112− <Box width="280px">{modalText}</Box>

121+ <Box width="280px">{modalText}</Box>

113− </Modal>

122+ </Modal>

114− <LoadingOverlay loading={loading} />

123+ <LoadingOverlay loading={loading} />

115− <Poller />

124+ <Poller />

125+ </BrowserRouter>

116 </Provider>

126 </Provider>

117 </WithErrorBoundary>

127 </WithErrorBoundary>

118 );

128 );

src/components/GlobalErrorBoundary.js → src/components/GlobalErrorBoundary.tsxrenamed+11−4

@@ -1,11 +1,11 @@

1−import React, { useMemo } from 'react';

1+import { useMemo } from 'react';

2import newGithubIssueUrl from 'new-github-issue-url';

3import { OutButton, RestartButton } from './Buttons';

4import { versionLabel } from 'lib/flags';

5

6−const buildTitle = error => `Error Report: ${error.message}`;

6+const buildTitle = (error: Error) => `Error Report: ${error.message}`;

7

8−const buildBody = error => `\n

8+const buildBody = (error: Error) => `\n

9

10\n

11## Context

@@ -27,7 +27,14 @@ In Bridge version ${versionLabel}.\n

27 * error might have originated from within those components, making this

28 * whole error boundary useless.

29 */

30+

31+interface GlobalErrorBoundaryProps {

32+ error: Error;

33+}

34+

30−export default function GlobalErrorBoundary({ error }) {

35+export default function GlobalErrorBoundary({

36+ error,

37+}: GlobalErrorBoundaryProps) {

31 const url = useMemo(

38 const url = useMemo(

32 () =>

39 () =>

33 newGithubIssueUrl({

40 newGithubIssueUrl({

src/index.js → src/index.tsxrenamed

The content is the same.

src/lib/useInvites.jsdeleted−7

@@ -1,7 +0,0 @@

1−import { usePointCache } from 'store/pointCache';

2−

3−export default function useInvites(point) {

4− const { getInvites } = usePointCache();

5−

6− return getInvites(point);

7−}

src/store/lib/useInvitesStore.jsdeleted−71

@@ -1,71 +0,0 @@

1−import { useCallback } from 'react';

2−import { Just, Nothing } from 'folktale/maybe';

3−import * as azimuth from 'azimuth-js';

4−import { chain } from 'lodash';

5−

6−import { useNetwork } from '../network';

7−import useSetState from 'lib/useSetState';

8−

9−// the default value of a point's invites

10−const EMPTY_INVITES = {

11− availableInvites: Nothing(),

12− sentInvites: Nothing(),

13− acceptedInvites: Nothing(),

14− acceptedPoints: Nothing(),

15− pendingPoints: Nothing(),

16−};

17−

18−export default function useInvitesStore() {

19− const { contracts } = useNetwork();

20− const [invitesCache, addToInvitesCache] = useSetState({});

21−

22− const getInvites = useCallback(

23− point => invitesCache[point] || EMPTY_INVITES,

24− [invitesCache]

25− );

26−

27− const syncInvites = useCallback(

28− async point => {

29− const _contracts = contracts.getOrElse(null);

30− if (!_contracts) {

31− return;

32− }

33−

34− const [availableInvites, invitedPoints] = await Promise.all([

35− azimuth.delegatedSending.getTotalUsableInvites(_contracts, point),

36− azimuth.delegatedSending.getInvited(_contracts, point),

37− ]);

38−

39− const activity = await Promise.all(

40− invitedPoints.map(invitedPoint =>

41− azimuth.azimuth.isActive(_contracts, invitedPoint)

42− )

43− );

44−

45− const sentInvites = invitedPoints.length;

46− const acceptedInvites = activity.filter(i => !!i).length;

47−

48− const [acceptedPoints, pendingPoints] = chain(invitedPoints)

49− .zipWith(activity, (point, active) => ({

50− point,

51− active: !!active,

52− }))

53− .partition('active')

54− .map(arr => arr.map(x => x.point))

55− .value();

56−

57− addToInvitesCache({

58− [point]: {

59− availableInvites: Just(availableInvites),

60− sentInvites: Just(sentInvites),

61− acceptedInvites: Just(acceptedInvites),

62− pendingPoints: Just(pendingPoints),

63− acceptedPoints: Just(acceptedPoints),

64− },

65− });

66− },

67− [contracts, addToInvitesCache]

68− );

69−

70− return { getInvites, syncInvites };

71−}

src/store/lib/usePointStore.js+1−7

@@ -2,7 +2,6 @@ import { useCallback } from 'react';

2

3import useDetailsStore from './useDetailsStore';

4import useRekeyDateStore from './useRekeyDateStore';

5−import useInvitesStore from './useInvitesStore';

6import useControlledPointsStore from './useControlledPointsStore';

5import useControlledPointsStore from './useControlledPointsStore';

7import useEclipticOwnerStore from './useEclipticOwnerStore';

6import useEclipticOwnerStore from './useEclipticOwnerStore';

8import useResidents from './useResidentsStore';

7import useResidents from './useResidentsStore';

@@ -10,7 +9,6 @@ import useResidents from './useResidentsStore';

10export default function usePointStore() {

9export default function usePointStore() {

11 const { syncDetails, ...details } = useDetailsStore();

10 const { syncDetails, ...details } = useDetailsStore();

12 const { syncRekeyDate, ...rekeyDates } = useRekeyDateStore();

11 const { syncRekeyDate, ...rekeyDates } = useRekeyDateStore();

13− const { syncInvites, ...invites } = useInvitesStore();

14 const {

12 const {

15 syncControlledPoints,

13 syncControlledPoints,

16 ...controlledPoints

14 ...controlledPoints

@@ -27,24 +25,20 @@ export default function usePointStore() {

27 async point =>

25 async point =>

28 Promise.all([

26 Promise.all([

29 syncDetails(point),

27 syncDetails(point),

30− //

31 syncDates(point),

28 syncDates(point),

32 syncResidentCount(point),

29 syncResidentCount(point),

33− syncInvites(point),

34 ]),

30 ]),

35− [syncDates, syncDetails, syncInvites, syncResidentCount]

31+ [syncDates, syncDetails, syncResidentCount]

36 );

32 );

37

33

38 return {

34 return {

39 ...details,

35 ...details,

40 ...rekeyDates,

36 ...rekeyDates,

41− ...invites,

42 ...controlledPoints,

37 ...controlledPoints,

43 ...ecliptic,

38 ...ecliptic,

44 ...residents,

39 ...residents,

45 syncDetails,

40 syncDetails,

46 syncRekeyDate,

41 syncRekeyDate,

47− syncInvites,

48 syncControlledPoints,

42 syncControlledPoints,

49 syncDates,

43 syncDates,

50 syncResidents,

44 syncResidents,