import React, {useState, useContext, useEffect, useCallback} from 'react';
import {View, Text, Button, Image, TouchableOpacity, StyleSheet, Platform} from 'react-native';
import {useDispatch, useSelector} from "react-redux";
import {LOG_IN_REQUEST, LOG_OUT_REQUEST} from "../reducers/user";
import {MaterialCommunityIcons} from "@expo/vector-icons";
import {useNavigation} from '@react-navigation/native';
import DateTimePicker from '@react-native-community/datetimepicker';
import {SET_TIME_SUCCESS} from "../reducers/location";
import moment from "moment";

const DateTimePickerComponent = (props) => {
    const [date, setDate] = useState(new Date());
    const [mode, setMode] = useState('time');
    const {goToMapsClick} = props;

    const onChange = (event, selectedDate) => {
        const currentDate = selectedDate || date;
        console.log(currentDate);
        setDate(currentDate);
    };

    // SET FINISH TIME
    const dispatch = useDispatch();
    const onSubmit = async () => {
        if (!date) {
            return
        }
        console.log('SET_TIME_SUCCESS GO!!', date);
        await dispatch({
            type: SET_TIME_SUCCESS,
            data: {
                date
            }
        });
    };

    useEffect(() => {
        if (goToMapsClick === true) {
            console.log(goToMapsClick);
            console.log('goToMapsClick!');
            onSubmit();
        }
        setDate(date);
    }, [goToMapsClick, date]);

    return (
        <View>
            <DateTimePicker
                testID="dateTimePicker"
                value={date}
                mode={mode}
                is24Hour={true}
                display="default"
                onChange={onChange}
                style={styles.TextStyle}
            />

        </View>
    );
};

const styles = StyleSheet.create({
    containerStyle: {
        marginTop: 10,
        alignItems: 'center',
        justifyContent: 'center',
    },
    TextStyle: {
        flex: 1,
        marginBottom: 240,
    }
});

export default DateTimePickerComponent;