forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Wrap Button children in an error boundary (#3340)
* Wrap Button children in an error boundary
* Check for Trans component
authored by
Eric Bailey
and committed by
GitHub
5b44aa96
f0493214
+49
-14
+49
-14
src/components/Button.tsx
+49
-14
src/components/Button.tsx
···
1
1
import React from 'react'
2
2
import {
3
+
AccessibilityProps,
3
4
Pressable,
4
-
Text,
5
5
PressableProps,
6
+
StyleProp,
7
+
StyleSheet,
8
+
Text,
6
9
TextProps,
7
-
ViewStyle,
8
-
AccessibilityProps,
9
-
View,
10
10
TextStyle,
11
-
StyleSheet,
12
-
StyleProp,
11
+
View,
12
+
ViewStyle,
13
13
} from 'react-native'
14
14
import LinearGradient from 'react-native-linear-gradient'
15
+
import {Trans} from '@lingui/macro'
15
16
16
-
import {useTheme, atoms as a, tokens, android, flatten} from '#/alf'
17
+
import {logger} from '#/logger'
18
+
import {android, atoms as a, flatten, tokens, useTheme} from '#/alf'
17
19
import {Props as SVGIconProps} from '#/components/icons/common'
18
20
import {normalizeTextStyles} from '#/components/Typography'
19
21
···
403
405
</View>
404
406
)}
405
407
<Context.Provider value={context}>
406
-
{typeof children === 'string' ? (
407
-
<ButtonText>{children}</ButtonText>
408
-
) : typeof children === 'function' ? (
409
-
children(context)
410
-
) : (
411
-
children
412
-
)}
408
+
<ButtonTextErrorBoundary>
409
+
{/* @ts-ignore */}
410
+
{typeof children === 'string' || children?.type === Trans ? (
411
+
/* @ts-ignore */
412
+
<ButtonText>{children}</ButtonText>
413
+
) : typeof children === 'function' ? (
414
+
children(context)
415
+
) : (
416
+
children
417
+
)}
418
+
</ButtonTextErrorBoundary>
413
419
</Context.Provider>
414
420
</Pressable>
415
421
)
422
+
}
423
+
424
+
export class ButtonTextErrorBoundary extends React.Component<
425
+
React.PropsWithChildren<{}>,
426
+
{hasError: boolean; error: Error | undefined}
427
+
> {
428
+
public state = {
429
+
hasError: false,
430
+
error: undefined,
431
+
}
432
+
433
+
public static getDerivedStateFromError(error: Error) {
434
+
return {hasError: true, error}
435
+
}
436
+
437
+
public componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
438
+
logger.error('ButtonTextErrorBoundary caught an error', {
439
+
message: error.message,
440
+
errorInfo,
441
+
})
442
+
}
443
+
444
+
public render() {
445
+
if (this.state.hasError) {
446
+
return <ButtonText>ERROR</ButtonText>
447
+
}
448
+
449
+
return this.props.children
450
+
}
416
451
}
417
452
418
453
export function useSharedButtonTextStyles() {