Невозможность правильно заполнить свойство в состоянии, чтобы использовать его в renderItem в FlatList

Question

Я пытаюсь создать приложение, которое получает автобусные станции от API и перечисляет их в плоский список.В каждой строке есть кнопка, которая является звездочкой, чтобы добавить элемент в избранное.Я храню избранное в асинхронном хранилище.Проблема в том, что я хочу получать избранное каждый раз при сборке приложения и показывать его, показывая черную звезду вместо белой.Источник изображения не устанавливается, он выдает синтаксическую ошибку в строке 132, где я установил ресурс кнопки изображения на источник. Также приложение становится глючным и медленным.Это дает мне эту ошибку: ошибка: связывание не удалось: ошибка: App.js: недопустимый вызов в строке 132: требуется (источник)

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 *
 * @format
 * @flow
 */

import React, {Component} from 'react';
import {StyleSheet, Text, View, ActivityIndicator,AsyncStorage, Image,ToastAndroid, TouchableOpacity, FlatList} from 'react-native';
import ImagePicker from "react-native-image-picker";

const options={
  title: 'Upload Picture',
  takePhotoButtonTitle: 'Camera Photo',
  chooseFromLibraryButtonTitle: 'Gallery Photo',
}
export default class App extends Component {

  constructor(props){
    super(props)
    this.state = {
        isLoadingData : true,
        dataSourceEmpty : null,
        favorites: null
    }
  }

  saveImage = (station) => {
    ImagePicker.showImagePicker(options, (response) => {
      if (response.didCancel) 
      {
        console.log('User cancelled image picker');
      }
      else if (response.error) 
      {
        console.log('Image Picker Error: ', response.error);
      }
      else 
      {
        AsyncStorage.setItem(station.id.toString()+"Photo",response.uri);
      }
    });
  }

  fillData = async (jsonResponseData) => {
    try {
      var keys = await this.DATABASE_getAllBusStations();
      this.setState({
        isLoadingData: false,
        dataSourceEmpty: jsonResponseData,
        favorites:keys
      })
    } catch (error) {
      console.log(error);
    }
  }

  componentDidMount() {
    return fetch('http://barcelonaapi.marcpous.com/bicing/stations.json')
    .then((response) => response.json())
    .then((JsonResponse) => this.fillData(JsonResponse.data.bici))
    .catch((error) => {
        console.log(error);
    });
  }

  _touchListener = (item) => {alert(  "ID is:"+item.id+"\n"
                                    + "Latitude is: "+item.lat+"\n"
                                    + "Longitude is:"+item.lon)};

  makeFavorite(item){
    this.saveData(item);
    this.saveImage(item);
    ToastAndroid.show(
      'ADD A PHOTO TO ADD TO FAVORITES!',
      ToastAndroid.SHORT
    );
  }

  saveData(station){
    AsyncStorage.setItem(station.id+"",station.name);
  }

  DATABASE_getAllBusStations = () => {
    return new Promise( async (resolve, reject) => {
      try {
        let keys = await AsyncStorage.getAllKeys();
        resolve(keys)
      } catch (error) {
        reject(new Error('Error getting keys from AsyncStorage: ' + error.message))
      }
    });
  }


  render() {
    if(this.state.isLoadingData)
    {
        return (
          <View style={styles.container}>
              <ActivityIndicator size="large" animating/>
          </View>
        );
    }
    else {
        return (
          <View style={styles.container}>
              <Text style = {styles.header}>
                  BARCELONA BUS STATIONS
              </Text>
              <FlatList     
                data={this.state.dataSourceEmpty}
                renderItem={({item}) => {
                let source = './Assets/fav.png';
                if(this.state.favorites)
                {
                  if(this.state.favorites.includes(item.id))
                  {
                    source = './Assets/favblack.png';
                  }
                }
                return <TouchableOpacity style={styles.item}
                  onPress={()=>this._touchListener(item)}>
                  <View style={styles.row}>
                    <Text style={styles.textStyle}>
                      {item.name}
                    </Text>
                    <View style={styles.buttonStyle}>
                      <TouchableOpacity onPress={()=>this.makeFavorite(item)}>
                          <Image
                            source ={require(source)}
                            style = {styles.imageStyle}
                          />
                      </TouchableOpacity>
                    </View>
                  </View>
                  </TouchableOpacity>
                  }
                }
                keyExtractor = {(item,index)=> index.toString()}
              />
          </View>
        );
    }
  }
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#F5FCFF',
  },
  indicator:{
    alignItems: 'center',
    justifyContent: 'center',
  },
  row:
  {
    flexDirection: 'row',
    justifyContent: 'space-between'
  },
  item: {
    padding: 10,
    borderBottomWidth: 1,
    borderBottomColor: '#eee',
    backgroundColor: 'skyblue'
  },
  header:
  {
    backgroundColor: '#F03209',
    textAlign: 'center',
    padding: 10,
    color: 'skyblue',
    fontSize: 20
  },
  imageStyle:
  {
    width:50,
    height:50
  },
  textStyle:
  {
    padding:10
  }
});