bottom tab added

Navigations/AuctionBottomTab.js

+import React from "react";
+import {
+  StyleSheet,
+  View,
+  Text,
+  TouchableOpacity,
+} from "react-native";
+import {
+    Ionicons,
+    MaterialIcons
+  } from "@expo/vector-icons";
+import { useNavigation } from '@react-navigation/native';
+import themeColors from "../assets/colors";
+
+export function AuctionBottomTab() {
+    const navigation = useNavigation();
+    return(
+        <View style={styles.bottomBtn}>
+            <TouchableOpacity style={styles.barButtonView}
+             onPress={() => navigation.navigate("gamification")}
+             >
+            <Ionicons name="game-controller" size={24} color={themeColors.PRIMARY_COLOR} />
+                <Text style={styles.iconText}>Buy</Text>
+            </TouchableOpacity>
+
+
+            <TouchableOpacity style={styles.barButtonView}
+             onPress={() => navigation.navigate("gamification")}
+            >
+            <Ionicons name="hardware-chip-sharp" size={24} color={themeColors.PRIMARY_COLOR} />
+                <Text style={styles.iconText}>Sell</Text>
+            </TouchableOpacity>
+
+
+            <TouchableOpacity style={styles.barButtonView}
+                onPress={() => navigation.navigate("Leaderboard")}
+            >
+            <MaterialIcons name="leaderboard" size={24} color={themeColors.PRIMARY_COLOR} />
+                <Text style={styles.iconText}>Bids</Text>
+            </TouchableOpacity>
+
+
+            <TouchableOpacity style={styles.barButtonView}
+             onPress={() => navigation.navigate("gamification")}
+            >
+            <Ionicons name="hardware-chip-sharp" size={24} color={themeColors.PRIMARY_COLOR} />
+                <Text style={styles.iconText}>Auctions</Text>
+            </TouchableOpacity>
+
+
+            <TouchableOpacity style={styles.barButtonView}
+             onPress={() => navigation.navigate("AuctionHomeScreen")}
+            >
+            <Ionicons name="home" size={24} color={themeColors.PRIMARY_COLOR}  />
+                <Text style={styles.iconText}>Home</Text>
+            </TouchableOpacity>
+        </View>
+    );
+}
+
+const styles = StyleSheet.create({
+  iconText: {
+    color: themeColors.PRIMARY_COLOR
+  },
+  bottomBtn:{
+      width:"100%",
+      height:60,
+      flexDirection:"row",
+      justifyContent:"space-between",
+      padding:15,
+      backgroundColor:"white",
+      alignItems:"center"
+
+  },
+  barButtonView:{
+      marginTop:5,
+      flexDirection:"column",
+      alignItems:"center"
+  }
+
+})
\ No newline at end of file

components/auction_item.component.js

@@ -17,6 +17,11 @@ const styles = StyleSheet.create({
     fontSize: 16,
     backgroundColor: themeColors.TERTIARY_COLOR,
     borderRadius: 20,
+    shadowColor: 'rgba(0,0,0, .4)',
+    shadowOffset: { height: 2, width: 1 },
+    shadowOpacity: 1,
+    shadowRadius: 1,
+    elevation: 2,
     marginVertical: 10
   },
   label: {

screen/Home.Auction.Screen.js

@@ -5,23 +5,14 @@
 import React from 'react';
 import {View, StyleSheet, Text, ScrollView} from 'react-native';
 import { AppAuctionItem } from '../components/auction_item.component';
-import { AppIconButton } from '../components/icon_button.component';
 import { AppContainer } from '../container/container';
 import themeColors from '../assets/colors';
+import { AuctionBottomTab } from '../Navigations/AuctionBottomTab';
+
 const  HomeAuctionScreen =  ({navigation}) => {
   return (
     <View style={styles.container}>
-      <View style={styles.header}>
-      </View>
-      <ScrollView horizontal style={styles.btnRowContainer}>
-        <View style={styles.contentContainer}>
-          <AppIconButton label='Buy' onPress = {() => navigation.navigate("SignUp")}/>
-          <AppIconButton label='Sell'/>
-          <AppIconButton label='My Bids'/>
-          <AppIconButton label='My Auctions'/>
-        </View>
-      </ScrollView>
-
+      <View style={styles.header}/>
       <AppContainer>
         <Text style={styles.auctionHeading}>Auctions List</Text>
         <ScrollView>
@@ -33,6 +24,7 @@ const  HomeAuctionScreen =  ({navigation}) => {
           </View>
       </ScrollView>
       </AppContainer>
+      <AuctionBottomTab/>
     </View>
   );
 };
@@ -45,9 +37,8 @@ const styles = StyleSheet.create({
   },
   header: {
     height: '35%',
-    backgroundColor : themeColors.PRIMARY_COLOR,
-    borderBottomEndRadius: 25,
-    borderBottomStartRadius: 25
+    marginBottom: 25,
+    backgroundColor : themeColors.PRIMARY_COLOR
   },
   btnRowContainer: {
     maxHeight: 100