Factor out FatalError component from App.tsx
This commit is contained in:
parent
50b3a2ef3d
commit
bdc648d811
24
App.tsx
24
App.tsx
|
@ -1,23 +1,22 @@
|
||||||
import {
|
import {
|
||||||
|
NavigationContainer,
|
||||||
DarkTheme as NavigationDarkTheme,
|
DarkTheme as NavigationDarkTheme,
|
||||||
DefaultTheme as NavigationDefaultTheme,
|
DefaultTheme as NavigationDefaultTheme,
|
||||||
NavigationContainer,
|
|
||||||
} from "@react-navigation/native";
|
} from "@react-navigation/native";
|
||||||
import React, { useEffect, useMemo, useState } from "react";
|
import React, { useEffect, useMemo, useState } from "react";
|
||||||
import { View, useColorScheme } from "react-native";
|
import { useColorScheme } from "react-native";
|
||||||
import {
|
import {
|
||||||
MD3DarkTheme as PaperDarkTheme,
|
MD3DarkTheme as PaperDarkTheme,
|
||||||
MD3LightTheme as PaperDefaultTheme,
|
MD3LightTheme as PaperDefaultTheme,
|
||||||
Provider as PaperProvider,
|
Provider as PaperProvider,
|
||||||
Text,
|
|
||||||
} from "react-native-paper";
|
} from "react-native-paper";
|
||||||
import MaterialIcon from "react-native-vector-icons/MaterialCommunityIcons";
|
import MaterialIcon from "react-native-vector-icons/MaterialCommunityIcons";
|
||||||
import AppSnack from "./AppSnack";
|
import AppSnack from "./AppSnack";
|
||||||
import AppStack from "./AppStack";
|
import AppStack from "./AppStack";
|
||||||
|
import FatalError from "./FatalError";
|
||||||
import { AppDataSource } from "./data-source";
|
import { AppDataSource } from "./data-source";
|
||||||
import { settingsRepo } from "./db";
|
import { settingsRepo } from "./db";
|
||||||
import { ThemeContext } from "./use-theme";
|
import { ThemeContext } from "./use-theme";
|
||||||
import { MARGIN } from "./constants";
|
|
||||||
|
|
||||||
export const CombinedDefaultTheme = {
|
export const CombinedDefaultTheme = {
|
||||||
...NavigationDefaultTheme,
|
...NavigationDefaultTheme,
|
||||||
|
@ -93,18 +92,11 @@ const App = () => {
|
||||||
>
|
>
|
||||||
<NavigationContainer theme={paperTheme}>
|
<NavigationContainer theme={paperTheme}>
|
||||||
{error && (
|
{error && (
|
||||||
<View
|
<FatalError
|
||||||
style={{ flex: 1, justifyContent: "center", alignItems: "center" }}
|
message={error}
|
||||||
>
|
setAppSettings={setAppSettings}
|
||||||
<Text
|
setError={setError}
|
||||||
style={{
|
/>
|
||||||
color: systemTheme === "dark" ? "white" : "black",
|
|
||||||
margin: MARGIN,
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Database failed to initialize: {error}
|
|
||||||
</Text>
|
|
||||||
</View>
|
|
||||||
)}
|
)}
|
||||||
{appSettings.startup !== undefined && (
|
{appSettings.startup !== undefined && (
|
||||||
<ThemeContext.Provider
|
<ThemeContext.Provider
|
||||||
|
|
|
@ -0,0 +1,55 @@
|
||||||
|
import { View, useColorScheme } from "react-native";
|
||||||
|
|
||||||
|
import { useCallback } from "react";
|
||||||
|
import { Dirs, FileSystem } from "react-native-file-access";
|
||||||
|
import { Button, Text } from "react-native-paper";
|
||||||
|
import { CombinedDarkTheme, CombinedDefaultTheme } from "./App";
|
||||||
|
import { MARGIN } from "./constants";
|
||||||
|
import { AppDataSource } from "./data-source";
|
||||||
|
import { settingsRepo } from "./db";
|
||||||
|
|
||||||
|
export default function FatalError({
|
||||||
|
message,
|
||||||
|
setAppSettings,
|
||||||
|
setError,
|
||||||
|
}: {
|
||||||
|
message: string;
|
||||||
|
setAppSettings: (settings: {
|
||||||
|
startup: any;
|
||||||
|
theme: string;
|
||||||
|
lightColor: string;
|
||||||
|
darkColor: string;
|
||||||
|
}) => void;
|
||||||
|
setError: (message: string) => void;
|
||||||
|
}) {
|
||||||
|
const systemTheme = useColorScheme();
|
||||||
|
|
||||||
|
const resetDatabase = useCallback(async () => {
|
||||||
|
await FileSystem.cp("/dev/null", Dirs.DatabaseDir + "/massive.db");
|
||||||
|
await AppDataSource.initialize();
|
||||||
|
const gotSettings = await settingsRepo.findOne({ where: {} });
|
||||||
|
setAppSettings({
|
||||||
|
startup: gotSettings.startup,
|
||||||
|
theme: gotSettings.theme,
|
||||||
|
lightColor: gotSettings.lightColor || CombinedDefaultTheme.colors.primary,
|
||||||
|
darkColor: gotSettings.darkColor || CombinedDarkTheme.colors.primary,
|
||||||
|
});
|
||||||
|
setError("");
|
||||||
|
}, [setAppSettings, setError]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
|
||||||
|
<Text
|
||||||
|
style={{
|
||||||
|
color: systemTheme === "dark" ? "white" : "black",
|
||||||
|
margin: MARGIN,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Database failed to initialize: {message}
|
||||||
|
</Text>
|
||||||
|
<Button mode="contained" onPress={resetDatabase}>
|
||||||
|
Reset database
|
||||||
|
</Button>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
}
|
Loading…
Reference in New Issue