matiru

 1import { View, Text, TouchableOpacity } from "react-native";
 2import { MaterialCommunityIcons } from "@expo/vector-icons";
 3import styles, { colors } from "../styles";
 4
 5export default function ScreenHeader({
 6  title,
 7  navigation,
 8  role,
 9  showBack,
10  hideSearchButton,
11  hideNotificationsButton,
12}) {
13  return (
14    <View
15      style={{
16        flexDirection: "row",
17        alignItems: "center",
18        marginBottom: 16,
19      }}
20    >
21      <View
22        style={{
23          flex: 1,
24          flexDirection: "row",
25          justifyContent: "flex-start",
26          alignItems: "center",
27        }}
28      >
29        {showBack && (
30          <TouchableOpacity onPress={() => navigation.goBack()}>
31            <MaterialCommunityIcons
32              name="arrow-left"
33              size={28}
34              color={colors.darkGreen}
35            />
36          </TouchableOpacity>
37        )}
38        {!hideNotificationsButton && (
39          <TouchableOpacity
40            onPress={() => navigation.navigate("Notifications")}
41            style={{ marginLeft: showBack ? 16 : 0 }}
42          >
43            <MaterialCommunityIcons
44              name="bell-outline"
45              size={28}
46              color={colors.darkGreen}
47            />
48          </TouchableOpacity>
49        )}
50      </View>
51
52      <Text style={[styles.title, { flex: 2, marginBottom: 0 }]}>{title}</Text>
53
54      <View
55        style={{
56          flex: 1,
57          flexDirection: "row",
58          justifyContent: "flex-end",
59        }}
60      >
61        {!hideSearchButton && (
62          <TouchableOpacity
63            onPress={() => navigation.navigate("Search", { fromRole: role })}
64          >
65            <MaterialCommunityIcons
66              name="magnify"
67              size={28}
68              color={colors.darkGreen}
69            />
70          </TouchableOpacity>
71        )}
72      </View>
73    </View>
74  );
75}