1import Ionicons from '@expo/vector-icons/build/Ionicons';
2import { BottomTabNavigationProp } from '@react-navigation/bottom-tabs';
3import { HeaderStyleInterpolators } from '@react-navigation/stack';
4import * as React from 'react';
5import { Platform, StyleSheet, TouchableOpacity } from 'react-native';
6
7import { Colors } from '../constants';
8
9const styles = StyleSheet.create({
10  header: Platform.select({
11    default: {
12      backgroundColor: Colors.headerBackground,
13    },
14    android: {
15      elevation: 0,
16      borderBottomWidth: 1,
17      borderBottomColor: '#eee',
18    },
19  }),
20  headerTitle: {
21    color: Colors.headerTitle,
22  },
23  card: {
24    backgroundColor: Colors.greyBackground,
25  },
26});
27
28export default function getStackConfig({
29  navigation,
30}: {
31  navigation: BottomTabNavigationProp<any>;
32}) {
33  return {
34    cardStyle: styles.card,
35    screenOptions: () => ({
36      headerStyleInterpolator: HeaderStyleInterpolators.forUIKit,
37      headerStyle: styles.header,
38      headerTintColor: Colors.tintColor,
39      headerTitleStyle: styles.headerTitle,
40      headerPressColorAndroid: Colors.tintColor,
41      headerRight: () => (
42        <TouchableOpacity onPress={() => navigation.navigate('search')} style={{ marginRight: 16 }}>
43          <Ionicons
44            name="md-search"
45            size={Platform.OS === 'ios' ? 22 : 25}
46            color={Colors.tintColor}
47          />
48        </TouchableOpacity>
49      ),
50    }),
51  };
52}
53