|
|
@ -49,7 +49,7 @@ import Colors from "../src/constants/Colors"; |
|
|
|
import fontSize from "../src/constants/fontSize"; |
|
|
|
import fontSize from "../src/constants/fontSize"; |
|
|
|
|
|
|
|
|
|
|
|
const Tab = createBottomTabNavigator(); |
|
|
|
const Tab = createBottomTabNavigator(); |
|
|
|
const BottomTabNavigator = ({ theme }) => { |
|
|
|
const BottomTabNavigator = ({ theme, userProducts }) => { |
|
|
|
const insets = useSafeAreaInsets(); |
|
|
|
const insets = useSafeAreaInsets(); |
|
|
|
const [headerShown, setHeaderShown] = React.useState(true); |
|
|
|
const [headerShown, setHeaderShown] = React.useState(true); |
|
|
|
React.useEffect(() => { |
|
|
|
React.useEffect(() => { |
|
|
@ -64,6 +64,10 @@ const BottomTabNavigator = ({ theme }) => { |
|
|
|
screenOptions={{ |
|
|
|
screenOptions={{ |
|
|
|
tabBarHideOnKeyboard: true, |
|
|
|
tabBarHideOnKeyboard: true, |
|
|
|
headerShown, |
|
|
|
headerShown, |
|
|
|
|
|
|
|
headerStyle: { |
|
|
|
|
|
|
|
backgroundColor: |
|
|
|
|
|
|
|
theme === "light" ? Colors.theme1.white : Colors.theme1.dark, |
|
|
|
|
|
|
|
}, |
|
|
|
tabBarIconStyle: { |
|
|
|
tabBarIconStyle: { |
|
|
|
transform: [{ scaleX: -1 }], |
|
|
|
transform: [{ scaleX: -1 }], |
|
|
|
}, |
|
|
|
}, |
|
|
@ -77,7 +81,7 @@ const BottomTabNavigator = ({ theme }) => { |
|
|
|
theme === "light" ? Colors.theme1.white : Colors.theme1.dark, |
|
|
|
theme === "light" ? Colors.theme1.white : Colors.theme1.dark, |
|
|
|
transform: [{ scaleX: -1 }], |
|
|
|
transform: [{ scaleX: -1 }], |
|
|
|
height: 65 + insets.bottom, |
|
|
|
height: 65 + insets.bottom, |
|
|
|
borderWidth : 0 |
|
|
|
borderWidth: 0, |
|
|
|
}, |
|
|
|
}, |
|
|
|
tabBarLabelStyle: { |
|
|
|
tabBarLabelStyle: { |
|
|
|
transform: [{ scaleX: -1 }, { translateY: -5 }], |
|
|
|
transform: [{ scaleX: -1 }, { translateY: -5 }], |
|
|
@ -123,7 +127,7 @@ const BottomTabNavigator = ({ theme }) => { |
|
|
|
width={33.58} |
|
|
|
width={33.58} |
|
|
|
height={33.579} |
|
|
|
height={33.579} |
|
|
|
style={{ |
|
|
|
style={{ |
|
|
|
transform: [{scale : 0.7}] |
|
|
|
transform: [{ scale: 0.7 }], |
|
|
|
}} |
|
|
|
}} |
|
|
|
> |
|
|
|
> |
|
|
|
<Path |
|
|
|
<Path |
|
|
@ -191,7 +195,7 @@ const BottomTabNavigator = ({ theme }) => { |
|
|
|
width={35.135} |
|
|
|
width={35.135} |
|
|
|
height={34.763} |
|
|
|
height={34.763} |
|
|
|
style={{ |
|
|
|
style={{ |
|
|
|
transform: [{scale : 0.7}] |
|
|
|
transform: [{ scale: 0.7 }], |
|
|
|
}} |
|
|
|
}} |
|
|
|
> |
|
|
|
> |
|
|
|
<G |
|
|
|
<G |
|
|
@ -300,12 +304,22 @@ const BottomTabNavigator = ({ theme }) => { |
|
|
|
name="ShoppingCartTab" |
|
|
|
name="ShoppingCartTab" |
|
|
|
children={() => <CARTStackScreen theme={theme} />} |
|
|
|
children={() => <CARTStackScreen theme={theme} />} |
|
|
|
options={{ |
|
|
|
options={{ |
|
|
|
// tabBarBadge: count,
|
|
|
|
tabBarBadge: userProducts.filter((product) => product.condition < 2) |
|
|
|
// tabBarBadgeStyle: {
|
|
|
|
.length |
|
|
|
// color: "white",
|
|
|
|
? userProducts.filter((product) => product.condition < 2).length |
|
|
|
// backgroundColor: Colors.theme1.['light'].green79,
|
|
|
|
: null, |
|
|
|
// fontSize: fontSize.sm,
|
|
|
|
tabBarBadgeStyle: { |
|
|
|
// },
|
|
|
|
color: "white", |
|
|
|
|
|
|
|
backgroundColor: |
|
|
|
|
|
|
|
theme === "light" ? Colors.theme1.greenCF : Colors.theme1.greenCF, |
|
|
|
|
|
|
|
fontSize: fontSize.sm, |
|
|
|
|
|
|
|
paddingTop: fontSize.sm / 4, |
|
|
|
|
|
|
|
color: theme === "light" ? Colors.theme1.white : Colors.theme1.dark, |
|
|
|
|
|
|
|
borderWidth: 1, |
|
|
|
|
|
|
|
borderColor: |
|
|
|
|
|
|
|
theme === "light" ? Colors.theme1.greenCF : Colors.theme1.dark, |
|
|
|
|
|
|
|
fontFamily: "bold", |
|
|
|
|
|
|
|
}, |
|
|
|
title: "سبد خرید", |
|
|
|
title: "سبد خرید", |
|
|
|
tabBarIcon: ({ focused, color }) => |
|
|
|
tabBarIcon: ({ focused, color }) => |
|
|
|
focused ? ( |
|
|
|
focused ? ( |
|
|
@ -321,7 +335,7 @@ const BottomTabNavigator = ({ theme }) => { |
|
|
|
? Colors.theme1.green79 |
|
|
|
? Colors.theme1.green79 |
|
|
|
: Colors.theme1.greenCF |
|
|
|
: Colors.theme1.greenCF |
|
|
|
} |
|
|
|
} |
|
|
|
stroke={theme === 'light' ? "white" : Colors.theme1.dark} |
|
|
|
stroke={theme === "light" ? "white" : Colors.theme1.dark} |
|
|
|
strokeLinecap="round" |
|
|
|
strokeLinecap="round" |
|
|
|
strokeLinejoin="round" |
|
|
|
strokeLinejoin="round" |
|
|
|
strokeWidth={1.5} |
|
|
|
strokeWidth={1.5} |
|
|
@ -489,7 +503,6 @@ const VODStackScreen = ({ theme }) => { |
|
|
|
}, |
|
|
|
}, |
|
|
|
}} |
|
|
|
}} |
|
|
|
initialRouteName="VOD" |
|
|
|
initialRouteName="VOD" |
|
|
|
|
|
|
|
|
|
|
|
> |
|
|
|
> |
|
|
|
<VODStack.Screen name="VOD" component={Videos} /> |
|
|
|
<VODStack.Screen name="VOD" component={Videos} /> |
|
|
|
<VODStack.Screen name="Video" component={Video} unmountOnExit={true} /> |
|
|
|
<VODStack.Screen name="Video" component={Video} unmountOnExit={true} /> |
|
|
@ -587,7 +600,9 @@ const Navigation = ({ |
|
|
|
<Stack.Screen name="Otp" component={Otp} /> |
|
|
|
<Stack.Screen name="Otp" component={Otp} /> |
|
|
|
<Stack.Screen |
|
|
|
<Stack.Screen |
|
|
|
name="Root" |
|
|
|
name="Root" |
|
|
|
children={() => <BottomTabNavigator theme={theme} />} |
|
|
|
children={() => ( |
|
|
|
|
|
|
|
<BottomTabNavigator theme={theme} userProducts={userProducts} /> |
|
|
|
|
|
|
|
)} |
|
|
|
/> |
|
|
|
/> |
|
|
|
<Stack.Screen name="QR" component={QR} /> |
|
|
|
<Stack.Screen name="QR" component={QR} /> |
|
|
|
<Stack.Screen name="Orders" component={OrdersFollowUp} /> |
|
|
|
<Stack.Screen name="Orders" component={OrdersFollowUp} /> |
|
|
|