modified-image-price

screens/DetailsScreen.js

@@ -6,6 +6,7 @@ import {
   StyleSheet,
   TouchableOpacity,
   ScrollView,
+  Image,
 } from "react-native";
 import ImageSlider from "../components/ImageSlider";
 import { FontAwesome5 } from "@expo/vector-icons";
@@ -20,7 +21,7 @@ const DetailsScreen = ({ navigation, route }) => {
   };
 
   const { destination } = route.params;
-  const { name, location, image, rating, description, reviews } = destination;
+  const { name, location, image, rating, description, reviews, price } = destination;
 
   return (
     <ScrollView style={styles.container}>
@@ -33,7 +34,8 @@ const DetailsScreen = ({ navigation, route }) => {
           <AntDesign name="arrowleft" size={24} color="#fcfcfc" />
         </TouchableOpacity>
       </View>
-      <ImageSlider />
+      {/*how to set image slider dynamically*/}
+      <Image source={destination.image} style={styles.image} />
       <Text style={styles.heading}>{name}</Text>
       {/* add a rating and reviews here */}
       <View style={styles.locaRate}>
@@ -92,14 +94,12 @@ const DetailsScreen = ({ navigation, route }) => {
       </View>
       <View style={styles.overview}>
         <Text style={styles.heading}>Overview</Text>
-        <Text style={styles.location}>
-          {description}
-        </Text>
+        <Text style={styles.location}>{description}</Text>
       </View>
       {/* price per night  and person details with new style */}
       <View style={styles.BookingInfo}>
         <Text style={styles.bookinfo}>1 night, 1 adult</Text>
-        <Text style={styles.price}>$150</Text>
+        <Text style={styles.price}>{price}</Text>
         <Text style={styles.location}>includes taxes and charges</Text>
       </View>
       <View style={styles.BookContain}>
@@ -223,6 +223,13 @@ const styles = StyleSheet.create({
     fontWeight: "bold",
     textAlign: "center",
   },
+  image: {
+    width: "90%",
+    height: 300,
+    borderRadius: 20,
+    marginHorizontal: 20,
+    margin: 10,
+  },
 });
 
 export default DetailsScreen;

screens/FinlandScreen.js

@@ -22,6 +22,7 @@ const destinations = [
     location: "Helsinki, Finland",
     rating: "4.7",
     reviews: "1123",
+    price: "$150",
     image: require("../assets/Suomenlinna.jpg"), // Correct path to your asset
     description:"Explore the beautiful city of Helsinki and visit the historic Suomenlinna Maritime Fortress on a guided tour. Learn about the history of the city and the fortress with a professional guide.",
   },
@@ -30,6 +31,7 @@ const destinations = [
     location: "Rovaniemi, Finland",
     rating: "4.8",
     reviews: "987",
+    price: "$200",
     image: require("../assets/GlassResortAir3-2048x1210.jpg"), // Correct path to your asset
     url: "https://santaclausvillage.info/accommodation/glass-resort/",
     description:"Experience the magic of Christmas at Santa Claus Village in Rovaniemi. Meet Santa, ride a husky sled, and enjoy a traditional Finnish Christmas dinner.",
@@ -39,6 +41,7 @@ const destinations = [
     location: "Helsinki, Finland",
     rating: "4.7",
     reviews: "892",
+    price: "$100",
     image: require("../assets/Hotel_Kamp_Exterior_001.jpg"),
     description:"Stay at the luxurious Hotel Kämp in Helsinki and enjoy world-class service and amenities. Explore the city's attractions and dine at the hotel's Michelin-starred restaurant.",
   },
@@ -47,6 +50,7 @@ const destinations = [
     location: "Rovaniemi, Finland",
     rating: "4.6",
     reviews: "763",
+    price: "$250",
     image: require("../assets/Arctic-TreeHouse-hotel-rovaniemi-lapland-1920x1152.jpg"),
     description:"Experience the magic of the Arctic Circle at the Arctic TreeHouse Hotel in Rovaniemi. Stay in a luxury treehouse and enjoy stunning views of the Northern Lights.",
   },
@@ -55,6 +59,7 @@ const destinations = [
     location: "Levi, Finland",
     rating: "4.8",
     reviews: "428",
+    price: "$180",
     image: require("../assets/Hotelli_Vanajanlinna_Hameenlinna_Vanajanlinna_Group_ravintola_kokous_juhlat_haat_tapahtumat-1.jpg"),
     description:"Stay at the Levi Spirit luxury hotel in Levi and enjoy a range of outdoor activities, including skiing, snowboarding, and snowmobiling. Relax in the hotel's spa and dine at the on-site restaurant.",
   },
@@ -63,7 +68,8 @@ const destinations = [
     location: "Kittilä, Finland",
     rating: "4.5",
     reviews: "317",
-    image: require("../assets/snowvillage_picture1-200x150,q=75.jpg"),
+    price: "$300",
+    image: require("../assets/imgs/lapland.jpg"),
     description:"Experience the magic of Lapland at the SnowVillage in Kittilä. Stay in a luxury ice hotel, explore the snow and ice sculptures, and enjoy a range of winter activities.",
   },
 ];

screens/HomeScreen.js

@@ -20,7 +20,7 @@ import HotelCard from "../components/HotelCard";
 const FinlandScreen = React.lazy(() => import("./FinlandScreen"));
 
 const HomeScreen = ({ navigation }) => {
-  const [currentUser, setCurrentUser] = useState(null);
+  const [currentUser, setCurrentUser] = useState();
 
   useEffect(() => {
     const unsubscribe = onAuthStateChanged(auth, (user) => {
@@ -49,13 +49,10 @@ const HomeScreen = ({ navigation }) => {
             <Ionicons name="search" size={34} color="#fcfcfc" />
           </TouchableOpacity>
         </View>
-        <Text style={styles.inputref}>
-          Welcome{" "}
-          <Text style={{ color: "#fde047", fontStyle: "italic" }}>
-            {currentUser?.displayName}
+          <Text style={styles.inputref}>
+            Welcome:{auth.currentUser.displayName}
           </Text>
-        </Text>
-        <Places />
+          <Places />
         <RecommendCard
           imageSources={[require("../assets/imgs/centaa.jpg")]}
           heading="Centa Village"

screens/SignUpScreen.js

@@ -33,13 +33,17 @@ const SignUpScreen = ({ navigation }) => {
         email.trim(),
         password
       );
-      await updateProfile(userCredential.user, {
-        displayName: name,
-      });
-      console.log(
-        "User signed up and name set: ",
-        userCredential.user.displayName
-      );
+      if (userCredential.user) {
+        await updateProfile(userCredential.user, {
+          displayName: name,
+        });
+        console.log(
+          "User signed up and name set: ",
+          userCredential.user.displayName
+        );
+      } else {
+        console.log("User credential does not contain user information");
+      }
     } catch (err) {
       console.log("Error in SignUp", err.message);
     }

screens/WelcomeScreen.js

@@ -6,7 +6,7 @@ const WelcomeScreen = ({ navigation }) => {
   return (
     <SafeAreaView style={styles.container}>
       <View style={styles.cover}>
-        <Text style={styles.txthead}>Welcome!</Text>
+        <Text style={styles.txthead}>BookaStay!</Text>
 
         <View style={styles.cotainImg}>
           <Image