diff --git a/navigation/index.js b/navigation/index.js index bfe77d6..0621251 100644 --- a/navigation/index.js +++ b/navigation/index.js @@ -4,6 +4,7 @@ import { createNativeStackNavigator } from "@react-navigation/native-stack"; import { createBottomTabNavigator } from "@react-navigation/bottom-tabs"; import { Entypo, FontAwesome, Ionicons } from "@expo/vector-icons"; import OrderDetails from "../src/screens/OrderDetails"; +import OrdersFollowUp from "../src/screens/OrdersFollowUp"; import { Dimensions } from "react-native"; import Splash from "../src/screens/Splash"; import Home from "../src/screens/Home"; @@ -47,11 +48,7 @@ const BottomTabNavigator = () => { component={AuthStackScreen} options={{ tabBarIcon: ({ focused, color }) => ( - + ), }} /> @@ -97,10 +94,14 @@ const BottomTabNavigator = () => { const HomeStack = createNativeStackNavigator(); const HomeStackScreen = () => { return ( - + + ); }; @@ -108,10 +109,14 @@ const HomeStackScreen = () => { const ProductsStack = createNativeStackNavigator(); const ProductsStackScreen = () => { return ( - + + ); }; @@ -119,7 +124,10 @@ const ProductsStackScreen = () => { const AuthStack = createNativeStackNavigator(); const AuthStackScreen = () => { return ( - + @@ -127,15 +135,30 @@ const AuthStackScreen = () => { ); }; -const Stack = createNativeStackNavigator(); +const OrderStack = createNativeStackNavigator(); +const OrderStackScreen = () => { + return( + + + + + ); +} -const Navigation = () => { +const Stack = createNativeStackNavigator(); +const Navigation = ({ profile }) => { return ( + + + diff --git a/src/components/Drawer.js b/src/components/Drawer.js new file mode 100644 index 0000000..4252b78 --- /dev/null +++ b/src/components/Drawer.js @@ -0,0 +1,107 @@ +import React, { useState } from "react"; +import { + View, + Platform, + UIManager, + Dimensions, + Pressable, + Text, + TouchableOpacity, +} from "react-native"; +import { useNavigation } from "@react-navigation/native"; +import { Entypo, FontAwesome, Ionicons, AntDesign } from "@expo/vector-icons"; +import tw from "tailwind-rn"; + +const width = Dimensions.get("window").width; +const height = Dimensions.get("window").height; + +if ( + Platform.OS === "android" && + UIManager.setLayoutAnimationEnabledExperimental +) { + UIManager.setLayoutAnimationEnabledExperimental(true); +} + +const Drawer = ({ position, setBoxPosition }) => { + const [routes, setRoutes] = useState([ + { + name: "صفحه اصلی", + route: "Home", + icon: , + toast: "", + message: "", + }, + { + name: "فعال سازی", + route: "Activation", + icon: , + toast: "", + message: "", + }, + { + name: "پروفایل", + route: "Profile", + icon: , + toast: "", + message: "", + }, + { + name: "واقعیت افزوده", + route: "AR", + icon: , + toast: "", + message: "", + }, + { + name: "سفارشات", + route: "Orders", + icon: , + toast: "", + message: "", + } + ]); + const navigation = useNavigation(); + const Route = ({ route }) => { + return ( + navigation.navigate(route.route)} + > + {route.icon} + + {route.name} + + + ); + }; + return ( + console.log(e.currentTarget._nativeTag)} + style={[ + tw(`absolute z-50 top-0 flex flex-row justify-end `), + { + left: position, + width: width, + height: height, + }, + ]} + > + setBoxPosition()} + style={[tw(`w-1/5 h-full ${position === "0%" ? "" : ""}`)]} + > + + {routes.map((route, index) => ( + + ))} + + + ); +}; + +export default Drawer; diff --git a/src/components/Navbar.js b/src/components/Navbar.js index f407809..b042b41 100644 --- a/src/components/Navbar.js +++ b/src/components/Navbar.js @@ -1,4 +1,4 @@ -import React, { useCallback } from "react"; +import React, { useCallback, useState } from "react"; import { Image, StyleSheet, @@ -6,7 +6,9 @@ import { Pressable, } from "react-native"; import { useNavigation } from "@react-navigation/native"; +import { Ionicons } from "@expo/vector-icons"; import tw from "tailwind-rn"; +import Drawer from "./Drawer"; //colors import Color from "../constants/Colors"; @@ -17,8 +19,9 @@ import logoIcon from "../assets/icons/logo.png"; import qrLightIcon from "../assets/icons/qr-light.png"; import arLightIcon from "../assets/icons/ar-light.png"; -const Navbar = ({ notification }) => { +const Navbar = ({ notification, back, setBoxPosition }) => { const navigation = useNavigation(); + const Button = useCallback(({ icon, route }) => { return ( { return ( - + setBoxPosition()}> { )} > )} - + navigation.navigate("خانه")} + onPress={() => navigation.navigate("Home")} style={tw("absolute right-1/2 top-1/2")} > { ]} /> - + + {back && ( + navigation.goBack()} + /> + )}