added create auction functionality

App.js

-import { StatusBar } from 'expo-status-bar';
 import React from 'react';
-import { StyleSheet, Text, View, Button } from 'react-native';
+import { StyleSheet} from 'react-native';
 import { NavigationContainer } from "@react-navigation/native";
 import { createDrawerNavigator } from "@react-navigation/drawer";
 import { homeStack } from "./Navigations/homeStack";
 import { AuthStack } from "./Navigations/AuthStack";
-import { FontAwesome } from '@expo/vector-icons';
-import { AboutUs } from './screen/AboutUs';
-
-
-
-// import  {HomeScreen}  from './screen/HomeScreen';
-// import {HomeScreen} from './screen/HomeScreen'
-// import {BottomTab} from './Navigations/BottomTab';
-
-// import { createMaterialBottomTabNavigator } from '@react-navigation/material-bottom-tabs';
+import { RootSiblingParent } from 'react-native-root-siblings';
 
 const Drawer = createDrawerNavigator();
-// const Tab = createMaterialBottomTabNavigator();
-
 
 export default function App() {
   return (
-
-    <NavigationContainer>
-    <Drawer.Navigator initialRouteName="Authntications">
-      <Drawer.Screen name="HOME" component={AuthStack} />
-      <Drawer.Screen name="About Us" component={homeStack} />
-      {/* <Drawer.Screen name="MainTab" component={MainTabScreen} /> */}
-      {/* <Drawer.Screen name="About Us" component={AboutUs} /> */}
-    </Drawer.Navigator>
-      {/* <HomeScreen/> */}
-  </NavigationContainer>
+    <RootSiblingParent>
+      <NavigationContainer>
+        <Drawer.Navigator initialRouteName="Authntications">
+          <Drawer.Screen name="HOME" component={AuthStack} />
+          <Drawer.Screen name="About Us" component={homeStack} />
+          {/* <Drawer.Screen name="MainTab" component={MainTabScreen} /> */}
+          {/* <Drawer.Screen name="About Us" component={AboutUs} /> */}
+        </Drawer.Navigator>
+          {/* <HomeScreen/> */}
+      </NavigationContainer>
+  </RootSiblingParent>
   );
 }
 

components/datpicker.component.js

@@ -2,7 +2,7 @@ import React, {useState} from 'react';
 import {View, StyleSheet, Platform} from 'react-native';
 import DateTimePicker from '@react-native-community/datetimepicker';
 
-export const AppDatePicker = () => {
+export const AppDatePicker = (props) => {
   const [date, setDate] = useState(new Date());
   const [mode, setMode] = useState('date');
   const [show, setShow] = useState(false);
@@ -11,6 +11,7 @@ export const AppDatePicker = () => {
     const currentDate = selectedDate || date;
     setShow(Platform.OS === 'ios');
     setDate(currentDate);
+    props.onDateSelect(currentDate);
   };
 
   return (

package.json

@@ -32,6 +32,7 @@
     "react-native-image-slideshow": "^1.0.1",
     "react-native-paper": "^4.9.2",
     "react-native-reanimated": "~2.1.0",
+    "react-native-root-toast": "^3.3.0",
     "react-native-safe-area-context": "3.2.0",
     "react-native-screens": "~3.0.0",
     "react-native-svg": "^12.1.1",

screen/Auction.Detail.Screen.js

@@ -27,8 +27,8 @@ const  AuctionDetailScreen =  ({route}) => {
           <View style={styles.titleContent}>
             <Text style={styles.auctionHeading}>{auction.name}</Text>
             <View style={styles.lotContainer}>
-              <Text style={styles.auctionText}>Owner : </Text>
-              <View style={styles.lot}><Text style={styles.lotText}>{auction.owner}</Text></View>
+              <Text style={styles.auctionText}>Starting Price : </Text>
+              <View style={styles.lot}><Text style={styles.lotText}>{auction.starting_price}</Text></View>
             </View>
           </View>
           <Text style={styles.auctionText}>Last Stakes</Text>

screen/User.Auction.Create.Screen.js

 import React, { useEffect, useState } from 'react';
+import axios from 'axios';
 import {View, StyleSheet, Text, ScrollView, Image, TouchableOpacity} from 'react-native';
 import { AppContainer } from '../container/container';
 import themeColors from '../assets/colors';
@@ -7,9 +8,13 @@ import { AppTextInput } from '../components/text_input.component';
 import { AppButton } from '../components/button.component';
 import { AppDatePicker } from '../components/datpicker.component';
 import { MaterialIcons } from "@expo/vector-icons";
+import Toast from 'react-native-root-toast';
 
 const  UserAuctionCreateScreen =  ({route, navigation}) => {
   const [image, setImage] = useState('https://via.placeholder.com/50');
+  const [auctionName, setAuctionName] = useState('');
+  const [auctionPrice, setAuctionPrice] = useState('');
+  const [expireDate, setExpireDate] = useState('');
 
   useEffect(() => {
     if (route.params === undefined) {
@@ -19,6 +24,57 @@ const  UserAuctionCreateScreen =  ({route, navigation}) => {
     }
   }, [])
 
+  const itemNameChange = (itemName) => {
+    setAuctionName(itemName);
+  }
+
+  const itemPriceChange = (itemPrice) => {
+    setAuctionPrice(itemPrice);
+  }
+
+  const handleDateChange = (selectedDate) => {
+    setExpireDate(selectedDate);
+  }
+
+  const handleSubmit = () => {
+    let auctionObj = {
+        name: auctionName,
+        owner: "Pramodh Rajapakse",
+        bids: [],
+        starting_price: auctionPrice,
+        expire_date: expireDate,
+        images: [image]
+    }
+
+    axios.post("http://127.0.0.1:8085/auctions", auctionObj)
+      .then( async function (response) {
+        if (response.data.message === 'Created') {
+          const successMsg = Toast.show('Your auction has been created successfully', {
+            duration: Toast.durations.LONG,
+          });
+          setTimeout(function hideToast() {
+            Toast.hide(successMsg);
+          }, 1000);
+          navigation.navigate('AuctionHomeScreen');
+        } else {
+          const errMsg = Toast.show('Auction Creation Failed', {
+            duration: Toast.durations.LONG,
+          });
+          setTimeout(function hideToast() {
+            Toast.hide(errMsg);
+          }, 1000);
+        }
+      })
+      .catch(function (error) {
+        const errMsg = Toast.show('Auction Creation Failed', {
+          duration: Toast.durations.LONG,
+        });
+        setTimeout(function hideToast() {
+          Toast.hide(errMsg);
+        }, 1000);
+      });
+  }
+
   return (
     <View style={styles.container}>
       <AppContainer>
@@ -27,11 +83,11 @@ const  UserAuctionCreateScreen =  ({route, navigation}) => {
         </View>
         <ScrollView>
           <View>
-            <AppTextInput placeholder='Enter item name'/>
-            <AppTextInput placeholder='Enter item price' keyboardType='numeric'/>
+            <AppTextInput placeholder='Enter item name' onChangeText={(val) => itemNameChange(val)}/>
+            <AppTextInput placeholder='Enter item price' onChangeText={(val) => itemPriceChange(val)} keyboardType='numeric'/>
             <View style={styles.dateContainer}>
               <Text style={styles.label}>Expire Date</Text>
-             <AppDatePicker/>
+             <AppDatePicker onDateSelect={handleDateChange}/>
             </View>
             <Text style={styles.imgLabel}>Item Image</Text>
             <View style={styles.addImagewrapper}>
@@ -46,7 +102,7 @@ const  UserAuctionCreateScreen =  ({route, navigation}) => {
                 </TouchableOpacity>
               </View>
             </View>
-            <AppButton label='Add Item'/>
+            <AppButton label='Add Item' onPress={() => handleSubmit()}/>
           </View>
       </ScrollView>
       </AppContainer>