Modal Custom DatePick

{/* =============================== MODAL DEPARTURE DATE & RETURN DATE ===================================== */}
                <Modal useNativeDriver={true} hideModalContentWhileAnimating={true} isVisible={(this.state.visibleModal === 5 || this.state.visibleModal === 6)} style={styles.bottomModal} onBackButtonPress={this.resetModal} onBackdropPress={this.resetModal}>
                    <View style={styles.modalContent}>
                        <Grid style={styles.modalHeaderDatepicker}>
                            <Row style={{ paddingBottom: 7.5 }}>
                                <TouchableOpacity style={{ flexDirection: "row", flex: 1 }} onPress={() => this.resetModal()}>
                                    <Col size={2} style={{ alignItems: "center", justifyContent: "center" }}>
                                        <Icon name='close' type='evilIcon' color={thameColors.white} size={28} />
                                    </Col>
                                    <Col size={6.5} style={styles.modalTitleSection}>
                                        <Text style={styles.modalTitle}>
                                            {
                                                (this.state.visibleModal === 5) ? "Departure Date" : "Return Date"
                                            }
                                        </Text>
                                    </Col>
                                    <Col size={1.5} />
                                </TouchableOpacity>
                            </Row>
                        </Grid>
                        <Grid>
                            <Col>
                                <View style={{ flex: 1 }}>
                                    <Dates
                                        date={this.state.date}
                                        onDatesChange={(this.state.visibleModal === 5) ? this.setDepartureDate : this.setReturnDate}
                                        startDate={this.state.startDate}
                                        endDate={this.state.endDate}
                                        focusedInput={this.state.focus}
                                        isDateBlocked={isDateBlocked}
                                        focusedInput={this.state.focus}
                                    />
                                    <Text style={{ paddingTop: 20, fontSize: 16, color: thameColors.textBlack, paddingLeft: 20 }}>
                                        {
                                            (this.state.visibleModal === 5)
                                                ? "Departure Date: " + moment(this.state.departureDate).format("DD MMM YYYY")
                                                : "Return Date: " + moment(this.state.returnDate).format("DD MMM YYYY")

                                        }
                                    </Text>

                                </View>
                            </Col>
                        </Grid>
                    </View>
                </Modal>
                {/* =============================== MODAL DEPARTURE DATE & RETURN DATE ===================================== */}


{/* =============================== FUNCTION ===================================== */}
setDepartureDate = ({ date }) => {
        this.setState({
            startDate: date,
            departureDate: moment(date).format("YYYY-MM-DD"),
            visibleModal: null,
            focus: date,
            returnDate: moment(date).add(1, 'days').format("YYYY-MM-DD")
        })
    }
    setReturnDate = ({ date }) => {
        this.setState({
            returnDate: moment(date).format("YYYY-MM-DD"),
            visibleModal: null
        })
    }

{/* =============================== FUNCTION ===================================== */}