68 lines
1.7 KiB
JavaScript
68 lines
1.7 KiB
JavaScript
import React from "react";
|
|
|
|
import { Image } from "react-native";
|
|
import { useNavigation } from "@react-navigation/native";
|
|
import { HeaderBackButton } from "@react-navigation/elements";
|
|
import { MaterialCommunityIcons } from "@expo/vector-icons";
|
|
|
|
import { useDrawerState } from "~/navigation/Context";
|
|
import { createStyles } from "~/theme";
|
|
|
|
const logo = require("~/assets/img/alert96.png");
|
|
export default function HeaderLeft(props) {
|
|
const styles = useStyles();
|
|
|
|
const navigation = useNavigation();
|
|
const [drawerState] = useDrawerState();
|
|
const { canGoBack } = props;
|
|
|
|
if (canGoBack || !drawerState.homeFocused) {
|
|
const { iconStyle } = props;
|
|
return (
|
|
<HeaderBackButton
|
|
{...props}
|
|
labelVisible={false}
|
|
style={[styles.size, styles.backButton]}
|
|
onPress={() => {
|
|
if (canGoBack) {
|
|
navigation.goBack();
|
|
} else {
|
|
navigation.navigate(drawerState.topTabPrev || "SendAlert");
|
|
}
|
|
}}
|
|
backImage={() => (
|
|
<MaterialCommunityIcons
|
|
name="arrow-left"
|
|
size={styles.size.width}
|
|
style={[styles.icon, iconStyle]}
|
|
/>
|
|
)}
|
|
/>
|
|
);
|
|
}
|
|
|
|
return <Image style={[styles.size, styles.logo]} source={logo} />;
|
|
}
|
|
|
|
const useStyles = createStyles(({ wp, hp, scaleText, theme: { colors } }) => {
|
|
const size = Math.max(24, wp(3));
|
|
return {
|
|
size: {
|
|
width: size,
|
|
height: size,
|
|
},
|
|
logo: {
|
|
marginHorizontal: Math.max(8, wp(2)),
|
|
color: colors.onSurface,
|
|
},
|
|
backButton: {
|
|
marginHorizontal: Math.max(8, wp(2)),
|
|
color: colors.onSurface,
|
|
zIndex: 1,
|
|
},
|
|
icon: {
|
|
color: colors.onSurface,
|
|
opacity: 1,
|
|
},
|
|
};
|
|
});
|