import { IPokemonAppDispatch, IRouterProps } from 'app/types';

import * as ActionsPokemonApp from 'app/actions';
import * as ActionsPokemonExplorer from 'app/components/PokemonExplorer/actions';

import { convertFormParamToPokemonForm, convertIdParamToPokemonId, convertLeagueParamToLeague } from 'app/utils/navigation';

export const routePokemonApp = async (props : IRouterProps, dispatch : IPokemonAppDispatch['dispatch']) => {
    const {
        id,
        form,
        league,
    } = props.match.params;

    const pokemonId = convertIdParamToPokemonId(id);
    const pokemonForm = convertFormParamToPokemonForm(form);
    if (pokemonId !== null && pokemonForm !== null) {
        dispatch(ActionsPokemonExplorer.setIsLoading(true));
        try {
            const leaguePokemon = await dispatch(ActionsPokemonApp.fetchPokemonLeagueStats(pokemonId, pokemonForm));
            dispatch(ActionsPokemonExplorer.reset(leaguePokemon));
        } catch (error) {
            // tslint:disable-next-line:no-console
            console.error(error);
            dispatch(ActionsPokemonExplorer.setLeaguePokemon(null));
        }
        dispatch(ActionsPokemonExplorer.setIsLoading(false));
    }

    const activeLeague = convertLeagueParamToLeague(league);
    if (activeLeague !== null) {
        dispatch(ActionsPokemonExplorer.setActiveLeague(activeLeague));
    }
};