on master help sign in
Merge pull request #560 from urbit/m/some-fixes

Prevent "Cannot read property 'map' of null" jank

commita74bc16c5111047e91e776054988d7556944b781 authorfang <github@fang.io> dateTue 30 Mar 2021, 17:45 (6 years ago) parent0bd92f5067deb9
3 files changed+64−12
src/Bridge.js+9 src/store/lib/useControlledPointsStore.js+23−11 src/views/Points.js+32−1
src/Bridge.js+9
@@ -1,4 +1,5 @@
11import React from 'react';
2+import { useEffect } from 'react';
23import { hot } from 'react-hot-loader/root';
34import { Just, Nothing } from 'folktale/maybe';
45import { IndigoApp } from 'indigo-react';
@@ -66,6 +67,14 @@ function useInitialRoutes() {
6667function Bridge() {
6768 const initialRoutes = useInitialRoutes();
6869
70+ // full reload if the user changes their selected network in Metamask
71+ //
72+ useEffect(() => {
73+ window.ethereum.on('chainChanged', () => {
74+ document.location.reload();
75+ });
76+ }, []);
77+
6978 return (
7079 <WithErrorBoundary render={error => <GlobalErrorBoundary error={error} />}>
7180 <Provider
src/store/lib/useControlledPointsStore.js+23−11
@@ -37,17 +37,29 @@ export default function useControlledPointsStore() {
3737 azimuth.azimuth.getSpawningFor(_contracts, address),
3838 ]);
3939
40− _setControlledPoints(
41− Just(
42− Result.Ok({
43− ownedPoints,
44− incomingPoints,
45− managingPoints,
46− votingPoints,
47− spawningPoints,
48− })
49− )
50− );
40+ if (
41+ ownedPoints === null &&
42+ incomingPoints === null &&
43+ managingPoints === null &&
44+ votingPoints === null &&
45+ spawningPoints === null
46+ ) {
47+ _setControlledPoints(
48+ Just(Result.Error('Failed to read the blockchain.'))
49+ );
50+ } else {
51+ _setControlledPoints(
52+ Just(
53+ Result.Ok({
54+ ownedPoints,
55+ incomingPoints,
56+ managingPoints,
57+ votingPoints,
58+ spawningPoints,
59+ })
60+ )
61+ );
62+ }
5163 } catch (error) {
5264 _setControlledPoints(Just(Result.Error(error)));
5365 }
src/views/Points.js+32−1
@@ -1,5 +1,5 @@
11import React, { useCallback, useEffect, useMemo } from 'react';
2−import { Just, Nothing } from 'folktale/maybe';
2+import { Just, Nothing, Result } from 'folktale/maybe';
33import { Grid, H5, HelpText, LinkButton, Flex } from 'indigo-react';
44import { get } from 'lodash';
55
@@ -15,6 +15,7 @@ import useIsEclipticOwner from 'lib/useIsEclipticOwner';
1515import { useSyncKnownPoints, useSyncOwnedPoints } from 'lib/useSyncPoints';
1616import useRejectedIncomingPointTransfers from 'lib/useRejectedIncomingPointTransfers';
1717import pluralize from 'lib/pluralize';
18+import newGithubIssueUrl from 'new-github-issue-url';
1819
1920import View from 'components/View';
2021import Blinky from 'components/Blinky';
@@ -223,6 +224,36 @@ export default function Points() {
223224 push,
224225 ]);
225226
227+ // if we got an error result, we should display it, instead of showing
228+ // a potentially inaccurately empty point list.
229+ //
230+ if (
231+ Just.hasInstance(controlledPoints) &&
232+ controlledPoints.value.matchWith({
233+ Error: e => true,
234+ Ok: v => false,
235+ })
236+ ) {
237+ const url = newGithubIssueUrl({
238+ user: 'urbit',
239+ repo: 'bridge',
240+ title: controlledPoints.value.value,
241+ body: `<!-- Please provide some context. Do you have Metamask installed? What login method did you use? -->`,
242+ });
243+ return (
244+ <View inset>
245+ <Grid>
246+ <Grid.Item full as={HelpText} className="mt8 t-center">
247+ {controlledPoints.value.value}
248+ <br />
249+ Try reloading the page. If this problem persists, please{' '}
250+ <a href={url}>file an issue on GitHub</a>.
251+ </Grid.Item>
252+ </Grid>
253+ </View>
254+ );
255+ }
256+
226257 if (
227258 loading ||
228259 (allPoints.length === 1 &&