auction screens created

Navigations/AuctionBottomTab.js

@@ -14,37 +14,26 @@ export function AuctionBottomTab() {
     return(
         <View style={styles.bottomBtn}>
             <TouchableOpacity style={styles.barButtonView}
-             onPress={() => navigation.navigate("gamification")}
+             onPress={() => navigation.navigate("AuctionListScreen")}
              >
             <Ionicons name="cart" size={24} color={themeColors.PRIMARY_COLOR} />
                 <Text style={styles.iconText}>Buy</Text>
             </TouchableOpacity>
 
-
-            <TouchableOpacity style={styles.barButtonView}
-             onPress={() => navigation.navigate("gamification")}
-            >
-            <Ionicons name="pricetag" size={24} color={themeColors.PRIMARY_COLOR} />
-                <Text style={styles.iconText}>Sell</Text>
-            </TouchableOpacity>
-
-
             <TouchableOpacity style={styles.barButtonView}
-                onPress={() => navigation.navigate("Leaderboard")}
+                onPress={() => navigation.navigate("UserBidScreen")}
             >
             <MaterialIcons name="leaderboard" size={24} color={themeColors.PRIMARY_COLOR} />
                 <Text style={styles.iconText}>Bids</Text>
             </TouchableOpacity>
 
-
             <TouchableOpacity style={styles.barButtonView}
-             onPress={() => navigation.navigate("gamification")}
+             onPress={() => navigation.navigate("UserAuctionScreen")}
             >
             <MaterialIcons name="gavel" size={24} color={themeColors.PRIMARY_COLOR} />
                 <Text style={styles.iconText}>Auctions</Text>
             </TouchableOpacity>
 
-
             <TouchableOpacity style={styles.barButtonView}
              onPress={() => navigation.navigate("AuctionHomeScreen")}
             >

Navigations/AuthStack.js

 import React from "react";
 import { createStackNavigator } from "@react-navigation/stack";
-import { Ionicons } from "@expo/vector-icons";
-import { MaterialIcons } from '@expo/vector-icons';
+import { Ionicons, MaterialIcons } from "@expo/vector-icons";
 import { SignIn } from "../screen/SignIn";
 import { SignUp } from "../screen/SignUp";
 import { HomeScreen } from "../screen/HomeScreen";
@@ -12,6 +11,9 @@ import { IotScreen } from "../screen/IotScreen";
 import { AboutUs } from "../screen/AboutUs";
 import axios from "axios";
 import HomeAuctionScreen from  "../screen/Home.Auction.Screen";
+import UserAuctionListScreen from "../screen/User.Auctions.Screen";
+import UserBidScreen from "../screen/User.Bids.Screen";
+import AuctionListScreen from "../screen/Auctions.List.Screen";
 
 const Stack = createStackNavigator();
 
@@ -189,31 +191,38 @@ export function AuthStack({ navigation }) {
         }}
       />
       <Stack.Screen
-        name="auctionscreen"
+        name="AuctionHomeScreen"
         component={HomeAuctionScreen}
         options={{
-          title: "Auction Screen",
-          headerTitleAlign: "center",
-          headerRight: () => {
-            return (
-              <MaterialIcons name="logout"
-               size={30}
-               color="black"
-               onPress={() => axios.get("http://192.168.8.126:5000/logout", )
-               .then(function (response) {
-                 const stngobj = JSON.stringify(response.data)
-                 console.log(stngobj + "logged out");
-                 console.log("Successfully logged out");
-                 alert("Successfully Logged out")
-                 navigation.navigate("SignIn")
-               })
-               .catch(function (error) {
-                 console.log(error);
-                 alert("Login failed")
-               })}
-                />
-            );
-          },
+          title: "Auctions",
+          headerTitleAlign: "center"
+        }}
+      />
+      <Stack.Screen
+        name="UserAuctionScreen"
+        component={UserAuctionListScreen}
+        options={{
+          headerShown: false,
+          title: "My Auctions",
+          headerTitleAlign: "center"
+        }}
+      />
+      <Stack.Screen
+        name="UserBidScreen"
+        component={UserBidScreen}
+        options={{
+          headerShown: false,
+          title: "My Bids",
+          headerTitleAlign: "center"
+        }}
+      />
+      <Stack.Screen
+        name="AuctionListScreen"
+        component={AuctionListScreen}
+        options={{
+          headerShown: false,
+          title: "Auctions List",
+          headerTitleAlign: "center"
         }}
       />
       <Stack.Screen

screen/Auctions.List.Screen.js

+// Example of Splash, Login and Sign Up in React Native
+// https://aboutreact.com/react-native-login-and-signup/
+
+// Import React and Component
+import React from 'react';
+import {View, StyleSheet, Text, ScrollView} from 'react-native';
+import { AppAuctionItem } from '../components/auction_item.component';
+import { AppContainer } from '../container/container';
+import themeColors from '../assets/colors';
+import { AuctionBottomTab } from '../Navigations/AuctionBottomTab';
+
+const  AuctionListScreen =  ({navigation}) => {
+  return (
+    <View style={styles.container}>
+      <AppContainer>
+        <Text style={styles.auctionHeading}>Auctions List</Text>
+        <ScrollView>
+          <View>
+            <AppAuctionItem label='Auction Item 1' onPress = {() => navigation.navigate("SignUp")}/>
+            <AppAuctionItem label='Auction Item 2'/>
+            <AppAuctionItem label='Auction Item 3'/>
+            <AppAuctionItem label='Auction Item 4'/>
+          </View>
+      </ScrollView>
+      </AppContainer>
+      <AuctionBottomTab/>
+    </View>
+  );
+};
+export default AuctionListScreen;
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: '#ffffff'
+  },
+  header: {
+    height: '35%',
+    marginBottom: 25,
+    backgroundColor : themeColors.PRIMARY_COLOR
+  },
+  btnRowContainer: {
+    maxHeight: 100
+  },
+  contentContainer: {
+    flex: 1,
+    flexDirection: 'row',
+    margin: 20
+  },
+  auctionHeading: {
+    fontSize: 24,
+    fontWeight: 'bold',
+    color: themeColors.SECONDARY_COLOR
+  }
+})
\ No newline at end of file

screen/HomeScreen.js

@@ -61,7 +61,7 @@ export function HomeScreen({ navigation }) {
         <View>
           <TouchableOpacity
             style={styles.Auction}
-            onPress={() => navigation.navigate("auctionscreen")}
+            onPress={() => navigation.navigate("AuctionHomeScreen")}
           >
             <Ionicons name="game-controller" size={24} color="black" />
             <Text style={styles.buttonText}>Auction</Text>

screen/User.Auctions.Screen.js

+// Example of Splash, Login and Sign Up in React Native
+// https://aboutreact.com/react-native-login-and-signup/
+
+// Import React and Component
+import React from 'react';
+import {View, StyleSheet, Text, ScrollView} from 'react-native';
+import { AppAuctionItem } from '../components/auction_item.component';
+import { AppContainer } from '../container/container';
+import themeColors from '../assets/colors';
+import { AuctionBottomTab } from '../Navigations/AuctionBottomTab';
+
+const  UserAuctionListScreen =  ({navigation}) => {
+  return (
+    <View style={styles.container}>
+      <AppContainer>
+        <Text style={styles.auctionHeading}>Auctions List</Text>
+        <ScrollView>
+          <View>
+            <AppAuctionItem label='Auction Item 1' onPress = {() => navigation.navigate("SignUp")}/>
+            <AppAuctionItem label='Auction Item 2'/>
+            <AppAuctionItem label='Auction Item 3'/>
+            <AppAuctionItem label='Auction Item 4'/>
+          </View>
+      </ScrollView>
+      </AppContainer>
+      <AuctionBottomTab/>
+    </View>
+  );
+};
+export default UserAuctionListScreen;
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: '#ffffff'
+  },
+  header: {
+    height: '35%',
+    marginBottom: 25,
+    backgroundColor : themeColors.PRIMARY_COLOR
+  },
+  btnRowContainer: {
+    maxHeight: 100
+  },
+  contentContainer: {
+    flex: 1,
+    flexDirection: 'row',
+    margin: 20
+  },
+  auctionHeading: {
+    fontSize: 24,
+    fontWeight: 'bold',
+    color: themeColors.SECONDARY_COLOR
+  }
+})
\ No newline at end of file

screen/User.Bids.Screen.js

+// Example of Splash, Login and Sign Up in React Native
+// https://aboutreact.com/react-native-login-and-signup/
+
+// Import React and Component
+import React from 'react';
+import {View, StyleSheet, Text, ScrollView} from 'react-native';
+import { AppAuctionItem } from '../components/auction_item.component';
+import { AppContainer } from '../container/container';
+import themeColors from '../assets/colors';
+import { AuctionBottomTab } from '../Navigations/AuctionBottomTab';
+
+const  UserBidScreen =  ({navigation}) => {
+  return (
+    <View style={styles.container}>
+      <AppContainer>
+        <Text style={styles.auctionHeading}>Auctions List</Text>
+        <ScrollView>
+          <View>
+            <AppAuctionItem label='Auction Item 1' onPress = {() => navigation.navigate("SignUp")}/>
+            <AppAuctionItem label='Auction Item 2'/>
+            <AppAuctionItem label='Auction Item 3'/>
+            <AppAuctionItem label='Auction Item 4'/>
+          </View>
+      </ScrollView>
+      </AppContainer>
+      <AuctionBottomTab/>
+    </View>
+  );
+};
+export default UserBidScreen;
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: '#ffffff'
+  },
+  header: {
+    height: '35%',
+    marginBottom: 25,
+    backgroundColor : themeColors.PRIMARY_COLOR
+  },
+  btnRowContainer: {
+    maxHeight: 100
+  },
+  contentContainer: {
+    flex: 1,
+    flexDirection: 'row',
+    margin: 20
+  },
+  auctionHeading: {
+    fontSize: 24,
+    fontWeight: 'bold',
+    color: themeColors.SECONDARY_COLOR
+  }
+})
\ No newline at end of file