import React, { FC } from 'react';
import { View } from 'react-native';

import Button from '../Button/Button';
import Modal from './Modal';

type props = {
  isVisible: boolean;
  setIsVisible: (value: boolean) => void;
  onSearch: () => void;
  children: React.ReactNode;
};

const FilterModal: FC<props> = ({ isVisible, setIsVisible, onSearch, children }) => {
  return (
    <Modal
      title="Filtrovat podle"
      isVisible={isVisible}
      setIsVisible={setIsVisible}
      buttons={
        <View className="flex-row">
          <Button classNames="px-4" variant="text" onPress={() => setIsVisible(false)}>
            Zrušit
          </Button>
          <Button
            classNames="pl-4"
            variant="text"
            onPress={() => {
              onSearch();
              setIsVisible(false);
            }}
          >
            Hledat
          </Button>
        </View>
      }
    >
      {children}
    </Modal>
  );
};

export default FilterModal;
