import React, {useState, useEffect} from 'react';
import {View, Text, Button, ScrollView} from 'react-native';
import {useNavigation} from '@react-navigation/native';
import {useDispatch, useSelector} from "react-redux";
import GoPathSummary from '../components/GoPathSummary';

const OptRoutePath = (props) => {
    const navigation = useNavigation();
    const {route} = props;
    const {optRoute} = route.params;

    const [pathList, setPathList] = useState([]);
    const {startLocation} = useSelector(state => state.location);
    const {endLocation} = useSelector(state => state.location);

    const dispatch = useDispatch();
    const setOptRouteRequest = async () => {
        try {
            console.log('set optroute request');
            setTimeout(() => {
                if (optRoute.pathList) {
                    for (var i = 0; i < optRoute.pathList.length; i++) {
                        setPathList(oldPath => [...oldPath, optRoute.pathList[i]]);
                    }
                }
            }, 3000);

        } catch (e) {
            console.error(e);
        }
    };


    useEffect(() => {
        setOptRouteRequest();
    }, []);

    return (
        <ScrollView>
            {pathList ?
                pathList.map((path, index) => {
                    return (
                        <>
                            <GoPathSummary summary={path.info} detail={path.subPathList}/>
                        </>
                    )
                })
                :
                null
            }
        </ScrollView>
    )
};

export default OptRoutePath;