Merge pull request #39 from MGT-Limited/test_view

Test view

app/(tabs)/_layout.tsx

@@ -1,37 +1,46 @@
-import React from "react";
-import FontAwesome from "@expo/vector-icons/FontAwesome";
-import { Tabs } from "expo-router";
+import React from 'react';
+import FontAwesome from '@expo/vector-icons/FontAwesome';
+import { Tabs } from 'expo-router';
 
 export default function TabLayout() {
-  return (
-    <Tabs screenOptions={{ tabBarActiveTintColor: "blue" }}>
-      <Tabs.Screen
-        name="index"
-        options={{
-          title: "Home",
-          tabBarIcon: ({ color }) => (
-            <FontAwesome size={28} name="home" color={color} />
-          ),
-        }}
-      />
-      <Tabs.Screen
-        name="settings/index"
-        options={{
-          title: "Settings",
-          tabBarIcon: ({ color }) => (
-            <FontAwesome size={28} name="cog" color={color} />
-          ),
-        }}
-      />
-      <Tabs.Screen
-        name="search/index"
-        options={{
-          title: "Search",
-          tabBarIcon: ({ color }) => (
-            <FontAwesome size={28} name="search" color={color} />
-          ),
-        }}
-      />
-    </Tabs>
-  );
+    return (
+        <Tabs screenOptions={{ tabBarActiveTintColor: 'blue' }}>
+            <Tabs.Screen
+                name="index"
+                options={{
+                    title: 'Home',
+                    tabBarIcon: ({ color }) => (
+                        <FontAwesome size={28} name="home" color={color} />
+                    )
+                }}
+            />
+            <Tabs.Screen
+                name="settings/index"
+                options={{
+                    title: 'Settings',
+                    tabBarIcon: ({ color }) => (
+                        <FontAwesome size={28} name="cog" color={color} />
+                    )
+                }}
+            />
+            <Tabs.Screen
+                name="search/index"
+                options={{
+                    title: 'Search',
+                    tabBarIcon: ({ color }) => (
+                        <FontAwesome size={28} name="search" color={color} />
+                    )
+                }}
+            />
+            <Tabs.Screen
+                name="testing/index"
+                options={{
+                    title: 'Test Component',
+                    tabBarIcon: ({ color }) => (
+                        <FontAwesome size={28} name="hashtag" color={color} />
+                    )
+                }}
+            />
+        </Tabs>
+    );
 }

app/(tabs)/testing/index.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import { View, Text } from 'react-native';
+
+export default function TestingPage() {
+    return (
+        <View>
+            <Text
+                style={{
+                    textAlign: 'center',
+                    backgroundColor: 'black',
+                    color: 'white'
+                }}
+            >
+                This area only exist in dev mode
+            </Text>
+            {/* Put Test Component Below */}
+            {/* ... */}
+        </View>
+    );
+}