import React from 'react';
import { View } from 'react-native';
import styles from './styles';
import EntityCountryFilterToggle from '../../../components/EntityCountryFilterToggle';
import useScreenHeaderOpacity from '../../../hooks/useScreenHeaderOpacity';

interface HeaderRightProps {
    onFilterPress: () => void;
    countryCodes?: string[];
    filterCount?: number;
}

const HeaderRight = ({
    onFilterPress,
    countryCodes = [],
    filterCount = 0
}: HeaderRightProps) => {
    const opacity = useScreenHeaderOpacity();

    return (
        <View style={styles.container}>
            <EntityCountryFilterToggle
                testID="filterToggle"
                onPress={onFilterPress}
                filterCount={filterCount}
                countryCodes={countryCodes}
                opacity={opacity}
                style={styles.item}
            />
        </View>
    );
};

export default HeaderRight;
