fix: wrap ErrorBoundaryScreen with SafeAreaProvider
This commit is contained in:
parent
99d3e45d8f
commit
5e3f9b7236
2 changed files with 21 additions and 19 deletions
|
|
@ -5,7 +5,7 @@ import { settings } from "@lib/api/settings";
|
|||
import { Codeblock, ErrorBoundary } from "@lib/ui/components";
|
||||
import { createStyles } from "@lib/ui/styles";
|
||||
import { tokens } from "@metro/common";
|
||||
import { Button, Card, SafeAreaView, Text } from "@metro/common/components";
|
||||
import { Button, Card, SafeAreaProvider, SafeAreaView, Text } from "@metro/common/components";
|
||||
import { ScrollView, View } from "react-native";
|
||||
|
||||
import ErrorComponentStackCard from "./ErrorComponentStackCard";
|
||||
|
|
@ -31,22 +31,24 @@ export default function ErrorBoundaryScreen(props: {
|
|||
const debugInfo = getDebugInfo();
|
||||
|
||||
return <ErrorBoundary>
|
||||
<SafeAreaView style={styles.container}>
|
||||
<View style={{ gap: 4 }}>
|
||||
<Text variant="display-lg">Uh oh.</Text>
|
||||
<Text variant="text-md/normal">A crash occurred while rendering a component. This could be caused by a plugin, Bunny or Discord itself.</Text>
|
||||
<Text variant="text-sm/normal" color="text-muted">{debugInfo.os.name}; {debugInfo.discord.build} ({debugInfo.discord.version}); {debugInfo.bunny.version}</Text>
|
||||
</View>
|
||||
<ScrollView fadingEdgeLength={64} contentContainerStyle={{ gap: 12 }}>
|
||||
<Codeblock selectable={true}>{props.error.message}</Codeblock>
|
||||
{hasStack(props.error) && <ErrorStackCard error={props.error} />}
|
||||
{isComponentStack(props.error) ? <ErrorComponentStackCard componentStack={props.error.componentStack} /> : null}
|
||||
</ScrollView>
|
||||
<Card style={{ gap: 6 }}>
|
||||
<Button text="Reload Discord" onPress={() => BundleUpdaterManager.reload()} />
|
||||
{!settings.safeMode?.enabled && <Button text="Reload in Safe Mode" onPress={() => toggleSafeMode()} />}
|
||||
<Button variant="destructive" text="Retry Render" onPress={() => props.rerender()} />
|
||||
</Card>
|
||||
</SafeAreaView>
|
||||
<SafeAreaProvider> {/* for iOS */}
|
||||
<SafeAreaView style={styles.container}>
|
||||
<View style={{ gap: 4 }}>
|
||||
<Text variant="display-lg">Uh oh.</Text>
|
||||
<Text variant="text-md/normal">A crash occurred while rendering a component. This could be caused by a plugin, Bunny or Discord itself.</Text>
|
||||
<Text variant="text-sm/normal" color="text-muted">{debugInfo.os.name}; {debugInfo.discord.build} ({debugInfo.discord.version}); {debugInfo.bunny.version}</Text>
|
||||
</View>
|
||||
<ScrollView fadingEdgeLength={64} contentContainerStyle={{ gap: 12 }}>
|
||||
<Codeblock selectable={true}>{props.error.message}</Codeblock>
|
||||
{hasStack(props.error) && <ErrorStackCard error={props.error} />}
|
||||
{isComponentStack(props.error) ? <ErrorComponentStackCard componentStack={props.error.componentStack} /> : null}
|
||||
</ScrollView>
|
||||
<Card style={{ gap: 6 }}>
|
||||
<Button text="Reload Discord" onPress={() => BundleUpdaterManager.reload()} />
|
||||
{!settings.safeMode?.enabled && <Button text="Reload in Safe Mode" onPress={() => toggleSafeMode()} />}
|
||||
<Button variant="destructive" text="Retry Render" onPress={() => props.rerender()} />
|
||||
</Card>
|
||||
</SafeAreaView>
|
||||
</SafeAreaProvider>
|
||||
</ErrorBoundary>;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ export const CompatButton = findByPropsLazy("Looks", "Colors", "Sizes");
|
|||
export const HelpMessage = findByNameLazy("HelpMessage");
|
||||
|
||||
// React Native's included SafeAreaView only adds padding on iOS.
|
||||
export const SafeAreaView = proxyLazy(() => findByProps("useSafeAreaInsets").SafeAreaView);
|
||||
export const { SafeAreaView, SafeAreaProvider } = lazyDestructure(() => findByProps("useSafeAreaInsets"));
|
||||
|
||||
// ActionSheet
|
||||
export const ActionSheetRow = findProp("ActionSheetRow");
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue