import React from 'react';
import { formatMessage } from '../../i18n';
import FilterCountry from '../../components/FilterCountry';
import MyCatalogFilterModal from '../MyCatalogFilterModal';
import styles from './styles';

interface CountrySelection {
    countryCode: string;
}

interface Props {
    onApply: () => void;
    onReset: () => void;
    onBack: () => void;
    onCountryPress: (country: CountrySelection) => void;
    language?: string;
    isFiltersEqualToDefaults: boolean;
    isFiltersChanged: boolean;
    countriesFiltersLocalParams: Set<string>;
    title?: string;
}

const EntityCountryFilterModal = ({
    onApply,
    onReset,
    onBack,
    onCountryPress,
    language,
    isFiltersEqualToDefaults,
    isFiltersChanged,
    countriesFiltersLocalParams,
    title
}: Props) => (
    <MyCatalogFilterModal
        onApply={onApply}
        onReset={onReset}
        onBack={onBack}
        isFiltersChanged={isFiltersChanged}
        title={title ?? formatMessage('filtering.country')}
        isFiltersEqualToDefaults={isFiltersEqualToDefaults}
        isBackIcon
    >
        <FilterCountry
            style={styles.filterCountry}
            countriesSelected={countriesFiltersLocalParams}
            language={language}
            onCountryPress={onCountryPress}
        />
    </MyCatalogFilterModal>
);

export default EntityCountryFilterModal;