diff --git a/App.js b/App.js index 1f10af0ed414f606bbdd3def89266c6896573453..8d7fcbee3fe9e7e533537cc17f88b0e76f9af1c5 100644 --- a/App.js +++ b/App.js @@ -1,14 +1,14 @@ import React, { useState, createContext, useContext, useEffect } from "react"; import { NavigationContainer } from "@react-navigation/native"; -import { createStackNavigator } from "@react-navigation/stack"; import { View, ActivityIndicator } from "react-native"; import { onAuthStateChanged } from "firebase/auth"; import { auth } from "./config/firebase"; import Login from "./screens/auth/Login"; import Signup from "./screens/auth/Signup"; import ScreenNavigator from "./screens/ScreenNavigator"; +import { createNativeStackNavigator } from '@react-navigation/native-stack'; -const Stack = createStackNavigator(); +const Stack = createNativeStackNavigator(); const AuthenticatedUserContext = createContext({}); const AuthenticatedUserProvider = ({ children }) => { @@ -45,7 +45,11 @@ function RootNavigator() { ); } - return <NavigationContainer>{user ? <ScreenNavigator /> : <AuthStack />}</NavigationContainer>; + return ( + <NavigationContainer> + {user ? <ScreenNavigator /> : <AuthStack />} + </NavigationContainer> + ); } export default function App() { diff --git a/package-lock.json b/package-lock.json index 1d28474665ab99604cdfe95c5ae23f77210dcce6..941fad147d1058a12b502bee1ca85a89cb21da9a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,10 +10,11 @@ "dependencies": { "@expo/webpack-config": "^18.0.1", "@firebase/auth": "^1.5.1", - "@react-native-async-storage/async-storage": "1.17.11", + "@react-native-async-storage/async-storage": "^1.18.1", "@react-native-community/masked-view": "^0.1.11", "@react-navigation/bottom-tabs": "^6.5.11", - "@react-navigation/native": "^6.0.6", + "@react-navigation/native": "^6.1.9", + "@react-navigation/native-stack": "^6.9.17", "@react-navigation/stack": "^6.0.11", "dotenv": "^11.0.0", "expo": "^48.0.19", @@ -4574,14 +4575,14 @@ "integrity": "sha512-Vvn3zZrhQZkkBE8LSuW3em98c0FwgO4nxzv6OdSxPKJIEKY2bGbHn+mhGIPerzI4twdxaP8/0+06HBpwf345Lw==" }, "node_modules/@react-native-async-storage/async-storage": { - "version": "1.17.11", - "resolved": "https://registry.npmjs.org/@react-native-async-storage/async-storage/-/async-storage-1.17.11.tgz", - "integrity": "sha512-bzs45n5HNcDq6mxXnSsOHysZWn1SbbebNxldBXCQs8dSvF8Aor9KCdpm+TpnnGweK3R6diqsT8lFhX77VX0NFw==", + "version": "1.18.1", + "resolved": "https://registry.npmjs.org/@react-native-async-storage/async-storage/-/async-storage-1.18.1.tgz", + "integrity": "sha512-70aFW8fVCKl+oA1AKPFDpE6s4t9pulj2QeLX+MabEmzfT3urd/3cckv45WJvtocdoIH/oXA3Y+YcCRJCcNa8mA==", "dependencies": { "merge-options": "^3.0.4" }, "peerDependencies": { - "react-native": "^0.0.0-0 || 0.60 - 0.71 || 1000.0.0" + "react-native": "^0.0.0-0 || 0.60 - 0.72 || 1000.0.0" } }, "node_modules/@react-native-community/cli": { @@ -5783,16 +5784,16 @@ } }, "node_modules/@react-navigation/core": { - "version": "6.4.9", - "resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-6.4.9.tgz", - "integrity": "sha512-G9GH7bP9x0qqupxZnkSftnkn4JoXancElTvFc8FVGfEvxnxP+gBo3wqcknyBi7M5Vad4qecsYjCOa9wqsftv9g==", + "version": "6.4.10", + "resolved": "https://registry.npmjs.org/@react-navigation/core/-/core-6.4.10.tgz", + "integrity": "sha512-oYhqxETRHNHKsipm/BtGL0LI43Hs2VSFoWMbBdHK9OqgQPjTVUitslgLcPpo4zApCcmBWoOLX2qPxhsBda644A==", "dependencies": { "@react-navigation/routers": "^6.1.9", "escape-string-regexp": "^4.0.0", "nanoid": "^3.1.23", "query-string": "^7.1.3", "react-is": "^16.13.0", - "use-latest-callback": "^0.1.5" + "use-latest-callback": "^0.1.7" }, "peerDependencies": { "react": "*" @@ -5810,11 +5811,11 @@ } }, "node_modules/@react-navigation/native": { - "version": "6.1.7", - "resolved": "https://registry.npmjs.org/@react-navigation/native/-/native-6.1.7.tgz", - "integrity": "sha512-W6E3+AtTombMucCRo6q7vPmluq8hSjS+IxfazJ/SokOe7ChJX7eLvvralIsJkjFj3iWV1KgOSnHxa6hdiFasBw==", + "version": "6.1.9", + "resolved": "https://registry.npmjs.org/@react-navigation/native/-/native-6.1.9.tgz", + "integrity": "sha512-AMuJDpwXE7UlfyhIXaUCCynXmv69Kb8NzKgKJO7v0k0L+u6xUTbt6xvshmJ79vsvaFyaEH9Jg5FMzek5/S5qNw==", "dependencies": { - "@react-navigation/core": "^6.4.9", + "@react-navigation/core": "^6.4.10", "escape-string-regexp": "^4.0.0", "fast-deep-equal": "^3.1.3", "nanoid": "^3.1.23" @@ -5824,6 +5825,22 @@ "react-native": "*" } }, + "node_modules/@react-navigation/native-stack": { + "version": "6.9.17", + "resolved": "https://registry.npmjs.org/@react-navigation/native-stack/-/native-stack-6.9.17.tgz", + "integrity": "sha512-X8p8aS7JptQq7uZZNFEvfEcPf6tlK4PyVwYDdryRbG98B4bh2wFQYMThxvqa+FGEN7USEuHdv2mF0GhFKfX0ew==", + "dependencies": { + "@react-navigation/elements": "^1.3.21", + "warn-once": "^0.1.0" + }, + "peerDependencies": { + "@react-navigation/native": "^6.0.0", + "react": "*", + "react-native": "*", + "react-native-safe-area-context": ">= 3.0.0", + "react-native-screens": ">= 3.0.0" + } + }, "node_modules/@react-navigation/routers": { "version": "6.1.9", "resolved": "https://registry.npmjs.org/@react-navigation/routers/-/routers-6.1.9.tgz", @@ -16709,9 +16726,9 @@ } }, "node_modules/use-latest-callback": { - "version": "0.1.6", - "resolved": "https://registry.npmjs.org/use-latest-callback/-/use-latest-callback-0.1.6.tgz", - "integrity": "sha512-VO/P91A/PmKH9bcN9a7O3duSuxe6M14ZoYXgA6a8dab8doWNdhiIHzEkX/jFeTTRBsX0Ubk6nG4q2NIjNsj+bg==", + "version": "0.1.9", + "resolved": "https://registry.npmjs.org/use-latest-callback/-/use-latest-callback-0.1.9.tgz", + "integrity": "sha512-CL/29uS74AwreI/f2oz2hLTW7ZqVeV5+gxFeGudzQrgkCytrHw33G4KbnQOrRlAEzzAFXi7dDLMC9zhWcVpzmw==", "peerDependencies": { "react": ">=16.8" } diff --git a/package.json b/package.json index e07ecde6c80c53a6ba677b434dab300b3eb9c70f..9c466d2e70bfe8b23ec51a210433a048446cb08a 100644 --- a/package.json +++ b/package.json @@ -12,10 +12,11 @@ "dependencies": { "@expo/webpack-config": "^18.0.1", "@firebase/auth": "^1.5.1", - "@react-native-async-storage/async-storage": "1.17.11", + "@react-native-async-storage/async-storage": "^1.18.1", "@react-native-community/masked-view": "^0.1.11", "@react-navigation/bottom-tabs": "^6.5.11", - "@react-navigation/native": "^6.0.6", + "@react-navigation/native": "^6.1.9", + "@react-navigation/native-stack": "^6.9.17", "@react-navigation/stack": "^6.0.11", "dotenv": "^11.0.0", "expo": "^48.0.19", diff --git a/screens/ScreenNavigator.js b/screens/ScreenNavigator.js index 1fa4f9470881893ad57e8f599184f9945ca17930..19bba0ff59aa85a64d35b4cf42c95da1c22ae64e 100644 --- a/screens/ScreenNavigator.js +++ b/screens/ScreenNavigator.js @@ -1,9 +1,8 @@ -import React, { useState, useLayoutEffect } from "react"; +import React, { useState, useLayoutEffect, useEffect } from "react"; import { auth, database } from "../config/firebase"; -import { collection, query, onSnapshot, where, and, addDoc } from "firebase/firestore"; +import { collection, query, onSnapshot, where, and, addDoc, getDocs } from "firebase/firestore"; import { createStackNavigator } from "@react-navigation/stack"; import Chat from "./tabs/Chat"; -import Home from "./ScreenNavigator"; import ChatUid from "./tabs/ChatUid"; import CatownerHome from "./tabs/CatownerHome"; import ChatList from "./tabs/ChatList"; @@ -11,11 +10,12 @@ import Catsitter from "./tabs/Catsitter"; import CatsitterHome from "./cat-sitter/CatsitterHome"; import CatsitterSetting from "./cat-sitter/CatsitterSetting"; import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; +import { View, Text } from "react-native"; const Stack = createStackNavigator(); const Tab = createBottomTabNavigator(); -const Home = () => { +const ScreenNavigator = () => { //Get current profile const [userProfile, setUserProfile] = useState({}); useLayoutEffect(() => { @@ -27,15 +27,13 @@ const Home = () => { }; const collectionRef = collection(database, "profiles"); const q = query(collectionRef, and(where("userId", "==", id)),); - - const unsubscribe = onSnapshot(q, (querySnapshot) => { - if (querySnapshot.docs.length > 0) { - setUserProfile(querySnapshot.docs[0].data()) + getDocs(q).then((data) => { + if (data.docs.length > 0) { + setUserProfile(data.docs[0].data()) } else { createUserProfile(auth?.currentUser?.uid) } }); - return unsubscribe; }, []); const createUserProfile = (userId) => { @@ -45,29 +43,31 @@ const Home = () => { role: "cat-owner" }); } - - if (userProfile.role == "cat-owner") { - return ( - <Stack.Navigator defaultScreenOptions={Home}> - <Stack.Screen name="Home" component={Home} /> - <Stack.Screen name="CatownerHome" component={CatownerHome} /> - <Stack.Screen name="Catsitter" component={Catsitter} /> - <Stack.Screen name="Chat" component={ChatList} /> - <Stack.Screen name="ChatDetail" component={Chat} /> - <Stack.Screen name="ChatWithUser" component={ChatUid} /> - </Stack.Navigator> - ) - } + if (userProfile.role == "cat-owner") return ( + <Stack.Navigator defaultScreenOptions={CatownerHome}> + <Stack.Screen name="CatownerHome" component={CatownerHome} /> + <Stack.Screen name="Catsitter" component={Catsitter} /> + <Stack.Screen name="Chat" component={ChatList} /> + <Stack.Screen name="ChatDetail" component={Chat} /> + <Stack.Screen name="ChatWithUser" component={ChatUid} /> + </Stack.Navigator> + ) + if (userProfile.role == "cat-sitter") return (<Tab.Navigator> + {/* Cat sitter stack */} + <Tab.Screen name="CatsitterHome" component={CatsitterHome} options={{ + tabBarLabel: "Home", + }} /> + <Tab.Screen name="CatsitterSetting" component={CatsitterSetting} options={{ + tabBarLabel: "Setting", + }} /> + </Tab.Navigator> + ) return ( - <Tab.Navigator defaultScreenOptions={CatsitterHome}> - {/* Cat sitter stack */} - <Tab.Screen name="CatsitterHome" component={CatsitterHome} /> - <Tab.Screen name="CatsitterSetting" component={CatsitterSetting} /> - </Tab.Navigator> + <View> + <Text>Loading screen</Text> + </View> ) - - } -export default Home \ No newline at end of file +export default ScreenNavigator \ No newline at end of file