model_react_native

App.js

@@ -1,9 +1,9 @@
 import React from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 import AppContainer from './src/navigations/AppNavigation';
-
+import SingIn from './src/screens/SignIn/SignIn'
 export default function App() {
   return (
-     <AppContainer />
+     <AppContainer  />
   );
 }

app.json

@@ -2,7 +2,7 @@
   "expo": {
     "name": "Instafood",
     "slug": "instafood-recipes-app",
-    "description": "React Native Recipes App Demo. Download source code for free at https://www.instamobile.io . You can also check out the Swift version at https://www.iosapptemplates.com and the Kotlin version at https://www.instakotlin.com .",
+    "description": "",
     "privacy": "public",
     "platforms": [
       "ios",

src/navigations/AppNavigation.js

@@ -10,6 +10,8 @@ import DrawerContainer from '../screens/DrawerContainer/DrawerContainer';
 import IngredientScreen from '../screens/Ingredient/IngredientScreen';
 import SearchScreen from '../screens/Search/SearchScreen';
 import IngredientsDetailsScreen from '../screens/IngredientsDetails/IngredientsDetailsScreen';
+import SingIn from '../screens/SignIn/SignIn';
+
 
  const Stack = createStackNavigator();
 
@@ -25,6 +27,9 @@ function MainNavigator() {
           }
       }}
     >
+
+
+      <Stack.Screen name='SingIn' component={SingIn} />
       <Stack.Screen name='Home' component={HomeScreen} />
       <Stack.Screen name='Categories' component={CategoriesScreen}/>
       <Stack.Screen name='Recipe' component={RecipeScreen}/>
@@ -66,4 +71,3 @@ function DrawerStack() {
 } 
 
 
-console.disableYellowBox = true;

src/screens/DrawerContainer/DrawerContainer.js

@@ -33,6 +33,14 @@ export default function DrawerContainer(props) {
             navigation.closeDrawer();
           }}
         />
+        <MenuButton
+          title="LOGOUT"
+          source={require("../../../assets/icons/search.png")}
+          onPress={() => {
+            navigation.navigate("SingIn");
+            navigation.closeDrawer();
+          }}
+        />
       </View>
     </View>
   );

src/screens/SignIn/SignIn.js

@@ -0,0 +1,24 @@
+import React, { useLayoutEffect } from "react";
+import { Text, View,TouchableOpacity, TextInput } from "react-native";
+import style from './styles'
+
+
+export default function SingIn({ navigation }) {
+
+  return (
+    <View style={style.container}>
+      <TextInput style={style.input} />
+      <TextInput style={style.input} />
+
+      <TouchableOpacity
+        style={style.btn}
+        onPress={() => {
+          navigation.navigate("Home");
+        }}
+      >
+        <Text style={style.textbtn}>Press Here</Text>
+      </TouchableOpacity>
+
+    </View>
+  );
+}

src/screens/SignIn/styles.js

@@ -0,0 +1,38 @@
+import { StyleSheet } from 'react-native';
+
+const styles = StyleSheet.create({
+  container: {
+    width: '100%',
+    height: '100%',
+    flex: 1,
+    justifyContent: 'center',
+    marginHorizontal: 9,
+  },
+  input: {
+    height: 40,
+    margin: 12,
+    borderWidth: 2,
+    borderColor: 'red',
+    margin: 10,
+    marginLeft: 35,
+    width: '80%',
+    borderRadius: 20,
+    height: 50,
+  },
+  btn: {
+    width: '100%',
+    marginVertical: 10,
+    paddingVertical: 2,
+  },
+  textbtn: {
+    fontWeight: 'bold',
+    fontSize: 15,
+    lineHeight: 26,
+  },
+  fixToText: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+  },
+});
+
+export default styles;

yarn.lock

@@ -2147,9 +2147,14 @@ camelcase@^5.0.0, camelcase@^5.3.1:
   integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==
 
 caniuse-lite@^1.0.30001181:
-  version "1.0.30001202"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001202.tgz#4cb3bd5e8a808e8cd89e4e66c549989bc8137201"
-  integrity sha512-ZcijQNqrcF8JNLjzvEiXqX4JUYxoZa7Pvcsd9UD8Kz4TvhTonOSNRsK+qtvpVL4l6+T1Rh4LFtLfnNWg6BGWCQ==
+  version "1.0.30001319"
+  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001319.tgz"
+  integrity sha512-xjlIAFHucBRSMUo1kb5D4LYgcN1M45qdKP++lhqowDpwJwGkpIRTt5qQqnhxjj1vHcI7nrJxWhCC1ATrCEBTcw==
+
+caniuse-lite@^1.0.30001319:
+  version "1.0.30001319"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001319.tgz#eb4da4eb3ecdd409f7ba1907820061d56096e88f"
+  integrity sha512-xjlIAFHucBRSMUo1kb5D4LYgcN1M45qdKP++lhqowDpwJwGkpIRTt5qQqnhxjj1vHcI7nrJxWhCC1ATrCEBTcw==
 
 capture-exit@^2.0.0:
   version "2.0.0"