Added icons and implemented navigation

App.js

@@ -1,111 +1,17 @@
-/**
- * Sample React Native App
- * https://github.com/facebook/react-native
- *
- * @format
- * @flow strict-local
- */
-
 import React from 'react';
-import type {Node} from 'react';
-import {
-  SafeAreaView,
-  ScrollView,
-  StatusBar,
-  StyleSheet,
-  Text,
-  useColorScheme,
-  View,
-} from 'react-native';
-
-import {
-  Colors,
-  DebugInstructions,
-  Header,
-  LearnMoreLinks,
-  ReloadInstructions,
-} from 'react-native/Libraries/NewAppScreen';
-
-const Section = ({children, title}): Node => {
-  const isDarkMode = useColorScheme() === 'dark';
-  return (
-    <View style={styles.sectionContainer}>
-      <Text
-        style={[
-          styles.sectionTitle,
-          {
-            color: isDarkMode ? Colors.white : Colors.black,
-          },
-        ]}>
-        {title}
-      </Text>
-      <Text
-        style={[
-          styles.sectionDescription,
-          {
-            color: isDarkMode ? Colors.light : Colors.dark,
-          },
-        ]}>
-        {children}
-      </Text>
-    </View>
-  );
-};
-
-const App: () => Node = () => {
-  const isDarkMode = useColorScheme() === 'dark';
-
-  const backgroundStyle = {
-    backgroundColor: isDarkMode ? Colors.darker : Colors.lighter,
-  };
-
+import {SafeAreaView, StyleSheet, Text} from 'react-native';
+import Navigation from './src/navigation/Navigation';
+const App = () => {
   return (
-    <SafeAreaView style={backgroundStyle}>
-      <StatusBar barStyle={isDarkMode ? 'light-content' : 'dark-content'} />
-      <ScrollView
-        contentInsetAdjustmentBehavior="automatic"
-        style={backgroundStyle}>
-        <Header />
-        <View
-          style={{
-            backgroundColor: isDarkMode ? Colors.black : Colors.white,
-          }}>
-          <Section title="Step One">
-            Edit <Text style={styles.highlight}>App.js</Text> to change this
-            screen and then come back to see your edits.
-          </Section>
-          <Section title="See Your Changes">
-            <ReloadInstructions />
-          </Section>
-          <Section title="Debug">
-            <DebugInstructions />
-          </Section>
-          <Section title="Learn More">
-            Read the docs to discover what to do next:
-          </Section>
-          <LearnMoreLinks />
-        </View>
-      </ScrollView>
+    <SafeAreaView style={styles.main}>
+      <Navigation />
     </SafeAreaView>
   );
 };
 
 const styles = StyleSheet.create({
-  sectionContainer: {
-    marginTop: 32,
-    paddingHorizontal: 24,
-  },
-  sectionTitle: {
-    fontSize: 24,
-    fontWeight: '600',
-  },
-  sectionDescription: {
-    marginTop: 8,
-    fontSize: 18,
-    fontWeight: '400',
-  },
-  highlight: {
-    fontWeight: '700',
+  main: {
+    flex: 1,
   },
 });
 

android/app/build.gradle

@@ -1,4 +1,5 @@
 apply plugin: "com.android.application"
+apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"
 
 import com.android.build.OutputFile
 

android/app/src/main/java/com/parsemobiledashboard/MainApplication.java

@@ -4,6 +4,7 @@
 import android.content.Context;
 import com.facebook.react.PackageList;
 import com.facebook.react.ReactApplication;
+import com.oblador.vectoricons.VectorIconsPackage;
 import com.facebook.react.ReactInstanceManager;
 import com.facebook.react.ReactNativeHost;
 import com.facebook.react.ReactPackage;

android/settings.gradle

@@ -1,3 +1,5 @@
 rootProject.name = 'ParseMobileDashboard'
+include ':react-native-vector-icons'
+project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')
 apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
 include ':app'

ios/ParseMobileDashboard.xcodeproj/project.pbxproj

@@ -12,6 +12,22 @@
 		13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
 		13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
 		81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; };
+		00DEE5AE37974A90A18BB020 /* AntDesign.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 4CDCF6041B77444D9026B372 /* AntDesign.ttf */; };
+		F72D701A84254F7B870DB02C /* Entypo.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 8BF60588AD7348DDAB4C5591 /* Entypo.ttf */; };
+		7AFFAC18759349BDB0D8CAFE /* EvilIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 81DAED0BEA704E02AE646095 /* EvilIcons.ttf */; };
+		BFF7848D16E14F55A5C9DA69 /* Feather.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 1B44871B1A5E4C2FAEC878CC /* Feather.ttf */; };
+		66ED46FD55CC4374B1C38450 /* FontAwesome.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 02417A333CDD4331A7ED6E06 /* FontAwesome.ttf */; };
+		1F9B484AF85B44E7AE9A41AB /* FontAwesome5_Brands.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 63F10831B9064A7896980B5B /* FontAwesome5_Brands.ttf */; };
+		654F548C00784384A50622E3 /* FontAwesome5_Regular.ttf in Resources */ = {isa = PBXBuildFile; fileRef = D932DF74D8894BAD88EF5555 /* FontAwesome5_Regular.ttf */; };
+		ED8953EB1732461F860A3B4F /* FontAwesome5_Solid.ttf in Resources */ = {isa = PBXBuildFile; fileRef = EF1ABB734FCA4B6EBA705DB9 /* FontAwesome5_Solid.ttf */; };
+		C94C768C65334B2E85F42E8B /* Fontisto.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 85B21B570D35451E86EFC91F /* Fontisto.ttf */; };
+		64730C0546AD4762A80956C3 /* Foundation.ttf in Resources */ = {isa = PBXBuildFile; fileRef = EF3B321B74D7408186B04413 /* Foundation.ttf */; };
+		3BFEAD12959A4B18A4E2EBEF /* Ionicons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 6F1B0F8354EE4EE8890ACF7B /* Ionicons.ttf */; };
+		894A74974001420D8C55E61E /* MaterialCommunityIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 4F2AFA14516C450DA7093F02 /* MaterialCommunityIcons.ttf */; };
+		4E7BBB8FE827426891DBF2DB /* MaterialIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 76E2613004BF4CAEA6CF7289 /* MaterialIcons.ttf */; };
+		C95B1429D3DE4095B9800E50 /* Octicons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = C452D2E683404565AA57E75B /* Octicons.ttf */; };
+		018486254F194C7EA121E9B3 /* SimpleLineIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 57004CB8606548E7BD73E0D0 /* SimpleLineIcons.ttf */; };
+		2479A796CA3847E6BF4A2AE0 /* Zocial.ttf in Resources */ = {isa = PBXBuildFile; fileRef = D49B8064A5464789B2DB05B6 /* Zocial.ttf */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXContainerItemProxy section */
@@ -36,6 +52,22 @@
 		13B07FB71A68108700A75B9A /* main.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; name = main.m; path = ParseMobileDashboard/main.m; sourceTree = "<group>"; };
 		81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.storyboard; name = LaunchScreen.storyboard; path = ParseMobileDashboard/LaunchScreen.storyboard; sourceTree = "<group>"; };
 		ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };
+		4CDCF6041B77444D9026B372 /* AntDesign.ttf */ = {isa = PBXFileReference; name = "AntDesign.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/AntDesign.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		8BF60588AD7348DDAB4C5591 /* Entypo.ttf */ = {isa = PBXFileReference; name = "Entypo.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Entypo.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		81DAED0BEA704E02AE646095 /* EvilIcons.ttf */ = {isa = PBXFileReference; name = "EvilIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/EvilIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		1B44871B1A5E4C2FAEC878CC /* Feather.ttf */ = {isa = PBXFileReference; name = "Feather.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Feather.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		02417A333CDD4331A7ED6E06 /* FontAwesome.ttf */ = {isa = PBXFileReference; name = "FontAwesome.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/FontAwesome.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		63F10831B9064A7896980B5B /* FontAwesome5_Brands.ttf */ = {isa = PBXFileReference; name = "FontAwesome5_Brands.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/FontAwesome5_Brands.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		D932DF74D8894BAD88EF5555 /* FontAwesome5_Regular.ttf */ = {isa = PBXFileReference; name = "FontAwesome5_Regular.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/FontAwesome5_Regular.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		EF1ABB734FCA4B6EBA705DB9 /* FontAwesome5_Solid.ttf */ = {isa = PBXFileReference; name = "FontAwesome5_Solid.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/FontAwesome5_Solid.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		85B21B570D35451E86EFC91F /* Fontisto.ttf */ = {isa = PBXFileReference; name = "Fontisto.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Fontisto.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		EF3B321B74D7408186B04413 /* Foundation.ttf */ = {isa = PBXFileReference; name = "Foundation.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Foundation.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		6F1B0F8354EE4EE8890ACF7B /* Ionicons.ttf */ = {isa = PBXFileReference; name = "Ionicons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Ionicons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		4F2AFA14516C450DA7093F02 /* MaterialCommunityIcons.ttf */ = {isa = PBXFileReference; name = "MaterialCommunityIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/MaterialCommunityIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		76E2613004BF4CAEA6CF7289 /* MaterialIcons.ttf */ = {isa = PBXFileReference; name = "MaterialIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/MaterialIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		C452D2E683404565AA57E75B /* Octicons.ttf */ = {isa = PBXFileReference; name = "Octicons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Octicons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		57004CB8606548E7BD73E0D0 /* SimpleLineIcons.ttf */ = {isa = PBXFileReference; name = "SimpleLineIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/SimpleLineIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
+		D49B8064A5464789B2DB05B6 /* Zocial.ttf */ = {isa = PBXFileReference; name = "Zocial.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Zocial.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -109,6 +141,7 @@
 				00E356EF1AD99517003FC87E /* ParseMobileDashboardTests */,
 				83CBBA001A601CBA00E9B192 /* Products */,
 				2D16E6871FA4F8E400B85C8A /* Frameworks */,
+				AFA300C32CA7407F9E2A04AC /* Resources */,
 			);
 			indentWidth = 2;
 			sourceTree = "<group>";
@@ -124,6 +157,30 @@
 			name = Products;
 			sourceTree = "<group>";
 		};
+		AFA300C32CA7407F9E2A04AC /* Resources */ = {
+			isa = "PBXGroup";
+			children = (
+				4CDCF6041B77444D9026B372 /* AntDesign.ttf */,
+				8BF60588AD7348DDAB4C5591 /* Entypo.ttf */,
+				81DAED0BEA704E02AE646095 /* EvilIcons.ttf */,
+				1B44871B1A5E4C2FAEC878CC /* Feather.ttf */,
+				02417A333CDD4331A7ED6E06 /* FontAwesome.ttf */,
+				63F10831B9064A7896980B5B /* FontAwesome5_Brands.ttf */,
+				D932DF74D8894BAD88EF5555 /* FontAwesome5_Regular.ttf */,
+				EF1ABB734FCA4B6EBA705DB9 /* FontAwesome5_Solid.ttf */,
+				85B21B570D35451E86EFC91F /* Fontisto.ttf */,
+				EF3B321B74D7408186B04413 /* Foundation.ttf */,
+				6F1B0F8354EE4EE8890ACF7B /* Ionicons.ttf */,
+				4F2AFA14516C450DA7093F02 /* MaterialCommunityIcons.ttf */,
+				76E2613004BF4CAEA6CF7289 /* MaterialIcons.ttf */,
+				C452D2E683404565AA57E75B /* Octicons.ttf */,
+				57004CB8606548E7BD73E0D0 /* SimpleLineIcons.ttf */,
+				D49B8064A5464789B2DB05B6 /* Zocial.ttf */,
+			);
+			name = Resources;
+			sourceTree = "<group>";
+			path = "";
+		};
 /* End PBXGroup section */
 
 /* Begin PBXNativeTarget section */
@@ -214,6 +271,22 @@
 			files = (
 				81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */,
 				13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,
+				00DEE5AE37974A90A18BB020 /* AntDesign.ttf in Resources */,
+				F72D701A84254F7B870DB02C /* Entypo.ttf in Resources */,
+				7AFFAC18759349BDB0D8CAFE /* EvilIcons.ttf in Resources */,
+				BFF7848D16E14F55A5C9DA69 /* Feather.ttf in Resources */,
+				66ED46FD55CC4374B1C38450 /* FontAwesome.ttf in Resources */,
+				1F9B484AF85B44E7AE9A41AB /* FontAwesome5_Brands.ttf in Resources */,
+				654F548C00784384A50622E3 /* FontAwesome5_Regular.ttf in Resources */,
+				ED8953EB1732461F860A3B4F /* FontAwesome5_Solid.ttf in Resources */,
+				C94C768C65334B2E85F42E8B /* Fontisto.ttf in Resources */,
+				64730C0546AD4762A80956C3 /* Foundation.ttf in Resources */,
+				3BFEAD12959A4B18A4E2EBEF /* Ionicons.ttf in Resources */,
+				894A74974001420D8C55E61E /* MaterialCommunityIcons.ttf in Resources */,
+				4E7BBB8FE827426891DBF2DB /* MaterialIcons.ttf in Resources */,
+				C95B1429D3DE4095B9800E50 /* Octicons.ttf in Resources */,
+				018486254F194C7EA121E9B3 /* SimpleLineIcons.ttf in Resources */,
+				2479A796CA3847E6BF4A2AE0 /* Zocial.ttf in Resources */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};

ios/ParseMobileDashboard/Info.plist

@@ -36,7 +36,7 @@
 		</dict>
 	</dict>
 	<key>NSLocationWhenInUseUsageDescription</key>
-	<string></string>
+	<string/>
 	<key>UILaunchStoryboardName</key>
 	<string>LaunchScreen</string>
 	<key>UIRequiredDeviceCapabilities</key>
@@ -51,5 +51,24 @@
 	</array>
 	<key>UIViewControllerBasedStatusBarAppearance</key>
 	<false/>
+	<key>UIAppFonts</key>
+	<array>
+		<string>AntDesign.ttf</string>
+		<string>Entypo.ttf</string>
+		<string>EvilIcons.ttf</string>
+		<string>Feather.ttf</string>
+		<string>FontAwesome.ttf</string>
+		<string>FontAwesome5_Brands.ttf</string>
+		<string>FontAwesome5_Regular.ttf</string>
+		<string>FontAwesome5_Solid.ttf</string>
+		<string>Fontisto.ttf</string>
+		<string>Foundation.ttf</string>
+		<string>Ionicons.ttf</string>
+		<string>MaterialCommunityIcons.ttf</string>
+		<string>MaterialIcons.ttf</string>
+		<string>Octicons.ttf</string>
+		<string>SimpleLineIcons.ttf</string>
+		<string>Zocial.ttf</string>
+	</array>
 </dict>
 </plist>

ios/Podfile

@@ -12,6 +12,8 @@ target 'ParseMobileDashboard' do
     :hermes_enabled => false
   )
 
+  pod 'RNVectorIcons', :path => '../node_modules/react-native-vector-icons'
+
   target 'ParseMobileDashboardTests' do
     inherit! :complete
     # Pods for testing