Как использовать реквизиты по умолчанию с реквизитами Redux?

Question

Я пытался создать «приложение фотогалереи», где каждое изображение - это «кнопка», которая переключает логическое свойство для модального тега. Проблема в том, что изображения отрисовываются с помощью FlatList, который передает реквизиты компоненту «GenerateImage. js», но в то же время мне нужно также передать функцию состояния и диспетчеризации в качестве параметра.

Файл, который отображает FlatList:

import React, { Component } from 'react'
import { FlatList, View, StyleSheet, TouchableOpacity, Text, AppRegistry } from 'react-native'
import { connect } from 'react-redux'

import GenerateImage from '../components/GenerateImage'
import commonStyles from '../commonStyles'
import Modal from '../components/Modal'

const Photos = ({ params }) => {
  return (
    <View style={{ flex: 1 }}>
        <Modal isVisible={params.showFullImage} />

        <View style={styles.buttonsContainer}>
            <TouchableOpacity style={styles.touchContainer}>
                <Text style={styles.button}>Hoje</Text>
            </TouchableOpacity>

            <TouchableOpacity style={styles.touchContainer}>
                <Text style={styles.button}>Mês</Text>
            </TouchableOpacity>

            <TouchableOpacity style={styles.touchContainer}>
                <Text style={styles.button}>Ano</Text>
            </TouchableOpacity>

            <TouchableOpacity style={styles.touchContainer}>
                <Text style={styles.button}>Álbuns</Text>
            </TouchableOpacity>
        </View>

        <View style={{ flex: 30 }}> 
            <FlatList data={params.images} keyExtractor={item => `${item.id}`}
            renderItem={({item}) => <GenerateImage {...item} />} numColumns={2} />
        </View>  
    </View>
  )
}

const styles = StyleSheet.create({
    buttonsContainer: {
        flex: 3,
        flexDirection: 'row',
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#1c2431',
    },
    touchContainer: {
        marginHorizontal: 20,
        backgroundColor: '#439ce8',
        borderRadius: 30,
        width: 65,
        alignItems: 'center',
        justifyContent: 'center',
        padding: 5
    },
    button: {
        color: 'white',
        fontFamily: commonStyles.Font,
        fontSize: 14
    }
})


export default connect(state => ({ params: state[0] }))(Photos)

GenerateImage. js:

import React from 'react'
import { View,
    StyleSheet,
    Image,
    PixelRatio,
    Dimensions,
    TouchableOpacity } from 'react-native'
import { connect } from 'react-redux'



const GenerateImage = (props, {param, dispatch}) => {

    function toggleModal(param) {
        return {
            type: 'TOGGLE_MODAL_ON',
        }
    }

    return (
        <View style={styles.container}>
            <View style={styles.imgContainer}>
                <TouchableOpacity activeOpacity={0.7} onPress={() => dispatch(toggleModal(param))}>
                    <Image source={props.image} style={styles.imgContainer} />
                </TouchableOpacity>
            </View>
        </View>
    )
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        marginVertical: 5,
        marginHorizontal: 4
    },
    imgContainer: {
        height: Dimensions.get('window').height * 0.25,
        width: Dimensions.get('window').width * 0.48,
        //borderRadius: 8,
        //flex: 1,
        //orderWidth: 1,
    },
    image: {
        resizeMode: 'contain',
        aspectRatio: PixelRatio.get()
    },
})

export default connect(state => ({ param: state[0].showFullImage }))(GenerateImage)

Итак, как мне передать обе данные?