-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathApp.tsx
126 lines (118 loc) · 3.63 KB
/
App.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
import React, { useEffect, useState } from "react";
import { PaperProvider } from "react-native-paper";
import { NavigationContainer } from "@react-navigation/native";
import { SafeAreaProvider } from "react-native-safe-area-context";
import { GestureHandlerRootView } from "react-native-gesture-handler";
import {
Home,
RecipeBook,
RecipeForm,
RecipeView,
Stack,
AppContext,
DefaultTheme,
DarkModeTheme,
AppAlert,
Preferences,
defaultPreferences,
} from "./src";
import { fetchData, saveData, storage } from "./src/core/storage";
export default function App() {
const [recipeBook, setRecipeBook] = useState<RecipeBook>({});
const [preferences, setPreferences] =
useState<Preferences>(defaultPreferences);
const [alerts, setAlerts] = useState<AppAlert[]>([]);
const theme = preferences.darkMode ? DarkModeTheme : DefaultTheme;
// two functions that simultaneously take care of:
// 1. updating the AppContext
// 2. persisting it to storage
// 3. posting an alert if something goes wrong
const saveRecipes = async (recipes: RecipeBook): Promise<void> => {
setRecipeBook(recipes);
try {
await saveData(storage.RECIPES, recipes);
} catch (err) {
const alert: AppAlert = {
status: "error",
title: "Failed to save recipe changes to storage",
description: `${err}`,
};
setAlerts([...alerts, alert]);
}
};
const togglePreference = async (
pref: keyof Preferences,
mode: boolean
): Promise<void> => {
setPreferences({ ...preferences, [pref]: mode });
try {
await saveData(storage.PREFS, preferences);
} catch (err) {
const alert: AppAlert = {
status: "error",
title: "Failed to save preferences to storage",
description: `${err}`,
};
setAlerts([...alerts, alert]);
}
};
// Fetch recipe book and preferences from storage the first time the app loads
useEffect(() => {
(async () => {
try {
const recipes: RecipeBook | null = await fetchData(storage.RECIPES);
if (recipes) {
setRecipeBook(recipes);
}
} catch (err) {
const alert: AppAlert = {
status: "error",
title: "Failed to fetch recipes from storage",
description: `${err}`,
};
setAlerts([...alerts, alert]);
}
try {
const prefs: Preferences | null = await fetchData(storage.PREFS);
if (prefs) {
setPreferences(prefs);
}
} catch (err) {
const alert: AppAlert = {
status: "error",
title: "Failed to fetch preferences from storage",
description: `${err}`,
};
setAlerts([...alerts, alert]);
}
})();
}, []);
return (
<GestureHandlerRootView style={{ flex: 1 }}>
<SafeAreaProvider>
<AppContext.Provider
value={{
recipes: recipeBook,
saveRecipes: saveRecipes,
prefs: preferences,
togglePreference,
alerts: alerts,
setAlerts: setAlerts,
}}
>
<PaperProvider theme={theme}>
<NavigationContainer theme={theme}>
<Stack.Navigator
screenOptions={{ headerShown: false, animation: "none" }}
>
<Stack.Screen name="Home" component={Home} />
<Stack.Screen name="Form" component={RecipeForm} />
<Stack.Screen name="Recipe" component={RecipeView} />
</Stack.Navigator>
</NavigationContainer>
</PaperProvider>
</AppContext.Provider>
</SafeAreaProvider>
</GestureHandlerRootView>
);
}