TouchableHighlight does not work when I nested it in Modal

I used touchablehighlight in other screen (not in modal) they worked properly.But I don't understand why its doesnt work properly when I put it in modal. If I put Button, it works. Here is a part of my code: Please help me !

import React,{useState} from 'react'
import {
    View,
    Text,
    Modal,
    Button
    } from 'react-native';

 import { TouchableHighlight } from 'react-native-gesture-handler';
 const Icons = () => {
    const [modalVisible, setModalVisible] = useState(true);
    console.log(modalVisible)
    return (    
        <View >
            <TouchableHighlight 
            onPress={()=>setModalVisible(!modalVisible) }
            >
                <Text>Son</Text>
            </TouchableHighlight>
            <Modal
            visible={modalVisible}
            >
        <View >
            <View style={{marginBottom: 100, }}>
            <Text style={{fontSize:30}} >Hoşgeldiniz</Text>
            </View>
            <View style={''}>
                
            <TouchableHighlight 
            onPress={ () => setModalVisible(!modalVisible) }
            >
                <Text>Sağol</Text>
            </TouchableHighlight>
            </View>
            </View>
            </Modal>
        </View>
    )
}

I had the same problem as well. Import TouchableHighlight from 'react-native'. But I dont know why it does not work when I import from gesture.