111 lines
3.3 KiB
JavaScript
111 lines
3.3 KiB
JavaScript
import "react-native-gesture-handler";
|
|
import { StatusBar } from "expo-status-bar";
|
|
import { Text, View } from "react-native";
|
|
import { createDrawerNavigator } from "@react-navigation/drawer";
|
|
import { NavigationContainer } from "@react-navigation/native";
|
|
import SideBar from "./src/Components/SideBar";
|
|
import {
|
|
AppContext,
|
|
AppProvider,
|
|
Constants,
|
|
GetDataFromList,
|
|
GetMultipleData,
|
|
} from "./src/utils";
|
|
import { Suspense, lazy, useContext, useEffect } from "react";
|
|
import { SafeAreaView } from "react-native-safe-area-context";
|
|
import "./i18n";
|
|
import DeviceScreen from "./src/Screens/Device";
|
|
import DeviceOldScreen from "./src/Screens/DeviceOld";
|
|
|
|
const Drawer = createDrawerNavigator();
|
|
|
|
const SettingsScreen = lazy(() => import("./src/Screens/Settings"));
|
|
const FaqScreen = lazy(() => import("./src/Screens/FAQ"));
|
|
const FeedbackScreen = lazy(() => import("./src/Screens/Feedback"));
|
|
|
|
export function MyApp() {
|
|
const appContext = useContext(AppContext);
|
|
|
|
useEffect(() => {
|
|
const loadData = async () => {
|
|
const data = await GetMultipleData([
|
|
"appLanguage",
|
|
"appColorScheme",
|
|
"userExpertMode",
|
|
"userDeveloperMode",
|
|
]);
|
|
|
|
const appLanguage = GetDataFromList(data, "appLanguage");
|
|
const appColorScheme = GetDataFromList(data, "appColorScheme");
|
|
const userExpertMode = GetDataFromList(data, "userExpertMode");
|
|
const userDeveloperMode = GetDataFromList(data, "userDeveloperMode");
|
|
|
|
appContext.setAppLanguage(
|
|
appLanguage === null ? Constants.defaultLanguage : appLanguage
|
|
);
|
|
appContext.setAppColorScheme(
|
|
appColorScheme === null ? "auto" : appColorScheme
|
|
);
|
|
|
|
appContext.setIsUserExpertModeEnabled(
|
|
userExpertMode == null ? false : userExpertMode
|
|
);
|
|
|
|
appContext.setUserIsDeveloperModeEnabled(
|
|
userDeveloperMode == null ? false : userDeveloperMode
|
|
);
|
|
};
|
|
|
|
loadData();
|
|
}, []);
|
|
|
|
return (
|
|
<SafeAreaView style={{ height: "100%" }}>
|
|
<NavigationContainer>
|
|
<Drawer.Navigator
|
|
screenOptions={{
|
|
headerShown: true,
|
|
headerStyle: {
|
|
backgroundColor: appContext.appTheme.backgroundColor,
|
|
},
|
|
headerTintColor: appContext.appTheme.text,
|
|
drawerStyle: {
|
|
backgroundColor: appContext.appTheme.drawer.backgroundColor,
|
|
},
|
|
}}
|
|
drawerContent={(props) => <SideBar {...props} />}
|
|
>
|
|
<Drawer.Screen name="Turtle" component={DeviceScreen} />
|
|
<Drawer.Screen name="Old Turtle" component={DeviceOldScreen} />
|
|
<Drawer.Screen name="FAQ" component={FaqScreen} />
|
|
<Drawer.Screen name="Feedback" component={FeedbackScreen} />
|
|
<Drawer.Screen name="Settings" component={SettingsScreen} />
|
|
</Drawer.Navigator>
|
|
</NavigationContainer>
|
|
|
|
<StatusBar
|
|
backgroundColor={appContext.appTheme.backgroundColor}
|
|
style={appContext.appColorScheme === "dark" ? "light" : "dark"}
|
|
/>
|
|
</SafeAreaView>
|
|
);
|
|
}
|
|
|
|
export default function App() {
|
|
return (
|
|
<Suspense
|
|
fallback={
|
|
<View
|
|
style={{ flex: 1, justifyContent: "center", alignItems: "center" }}
|
|
>
|
|
<Text>Loading...</Text>
|
|
</View>
|
|
}
|
|
>
|
|
<AppProvider>
|
|
<MyApp />
|
|
</AppProvider>
|
|
</Suspense>
|
|
);
|
|
}
|