Draft: Master

Lorem impsum dolor sit amet

screens/ScreenNavigator.js

-import { View, Text } from 'react-native'
 import React, { useState, useLayoutEffect } from "react";
 import { auth, database } from "../config/firebase";
 import { collection, query, onSnapshot, where, and, addDoc } from "firebase/firestore";
-import CatsitterHome from './cat-sitter/CatsitterHome';
-import CatOwnerHome from './tabs/CatownerHome';
-import CatsitterSetting from './cat-sitter/CatsitterSetting';
+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";
+import Catsitter from "./tabs/Catsitter";
+import CatsitterHome from "./cat-sitter/CatsitterHome";
+import CatsitterSetting from "./cat-sitter/CatsitterSetting";
+import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+
+const Stack = createStackNavigator();
+const Tab = createBottomTabNavigator();
 
 const Home = () => {
     //Get current profile
@@ -38,16 +47,27 @@ const Home = () => {
     }
 
     if (userProfile.role == "cat-owner") {
-        return <CatOwnerHome />
-    } else if (userProfile.role == "cat-sitter" && userProfile.updatedAt) {
-        return <CatsitterHome />
-    } else if (userProfile.role == "cat-sitter" && !userProfile.updatedAt) {
-        return <CatsitterSetting />
+        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>
+        )
     }
+    return (
+        <Tab.Navigator defaultScreenOptions={CatsitterHome}>
+            {/* Cat sitter stack */}
+            <Tab.Screen name="CatsitterHome" component={CatsitterHome} />
+            <Tab.Screen name="CatsitterSetting" component={CatsitterSetting} />
+        </Tab.Navigator>
+    )
+
+
 
-    return <View>
-        <Text>Loading screen</Text>
-    </View>
 }
 
 export default Home
\ No newline at end of file