feat: Add tab bar icon

src/navigation/BottomTabNavigator.tsx

 import * as React from "react";
 import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
 import { RootTabParamList } from "../types/navigation";
-import { FontAwesome } from "@expo/vector-icons";
+import {
+  FontAwesome,
+  MaterialIcons,
+  MaterialCommunityIcons,
+} from "@expo/vector-icons";
 import { Pressable } from "react-native";
 import Colors from "../constants/Colors";
 import ProfileStackNavigator from "./ProfileStackNavigator";
@@ -18,6 +22,9 @@ const BottomTabNavigator = () => {
     <BottomTab.Navigator
       initialRouteName="Ecosystem"
       screenOptions={{
+        tabBarLabel: () => {
+          return null;
+        },
         tabBarActiveTintColor: Colors.icon.tab.active, //TODO ganti warna nya
       }}
     >
@@ -27,7 +34,14 @@ const BottomTabNavigator = () => {
         options={() => ({
           title: "Ecosystem",
           headerShown: false,
-          tabBarIcon: ({ color }) => <TabBarIcon name="code" color={color} />,
+          tabBarIcon: ({ color }) => (
+            <MaterialCommunityIcons
+              name={"earth"}
+              size={30}
+              style={{ marginBottom: -3 }}
+              color={color}
+            />
+          ),
           headerRight: () => (
             <Pressable
               onPress={() => null}
@@ -51,7 +65,14 @@ const BottomTabNavigator = () => {
         options={() => ({
           title: "Profile",
           headerShown: false,
-          tabBarIcon: ({ color }) => <TabBarIcon name="code" color={color} />,
+          tabBarIcon: ({ color }) => (
+            <MaterialIcons
+              name={"person-outline"}
+              size={30}
+              style={{ marginBottom: -3 }}
+              color={color}
+            />
+          ),
           headerRight: () => (
             <Pressable
               onPress={() => null}
@@ -73,14 +94,4 @@ const BottomTabNavigator = () => {
   );
 };
 
-/**
- * You can explore the built-in icon families and icons on the web at https://icons.expo.fyi/
- */
-function TabBarIcon(props: {
-  name: React.ComponentProps<typeof FontAwesome>["name"];
-  color: string;
-}) {
-  return <FontAwesome size={30} style={{ marginBottom: -3 }} {...props} />;
-}
-
 export default BottomTabNavigator;