I am trying to create a draggable to do list using react-native-draggable-flatlist module. But I am getting a this error:

TypeError: undefined is not a function, js engine: hermes

This is my code:

  const Todos = () => {
  const [unfinishedTodos, setUnfinishedTodos] = useState([]);
  const [loading, setLoading] = useState(true)
  function loadData() {
    firestore()
      .collection('todos')
      .orderBy('priority', 'desc')
      .get()
      .then(snap => {
        setLoading(true);
        let unfinished = [];
        snap.docs.map(each => {
          let eachdict = {
            id: each.id,
            taskName: each.get('taskName'),
            taskDesc: each.get('taskDesc'),
            priority: each.get('priority'),
            finished: each.get('finished'),
            time: each.get('time'),
            index: each.get('index'),
            timeType: each.get('timeType'),
          };
            unfinished.push(eachdict);
        });
        setUnfinishedTodos(
          unfinished.sort((a, b) => {
            return a.index - b.index;
          }),
        );
        setLoading(false);
      })
      .catch(error => {
        console.log(error.message);
      });
  }
           

 return( 
      <DraggableFlatList data={unfinishedTodos} renderItem={({item, index, drag, isActive}) => {
   return (
      <Text>{item.taskName}</Text>
)}}                     
    keyExtractor={(item, index) => `${item.id}`}
    onDragEnd={({data}) => console.log(data)} />
   )}

What am I doing wrong or which part of the code has to be replaced?