import * as React from 'react';
import { WithTranslation, withTranslation } from 'react-i18next';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';

import { updateHistory } from 'actions/history';
import { loadCrops } from 'crop/actions/public';
import { initMyList } from 'list/actions/public';
import { initMyMaps } from 'accessions/actions/public';
import { serverInfoRequest } from 'actions/serverInfo';
import { loadIso3Decodings, refreshIso3Decodings } from 'geo/actions/public';

import { withRouter } from 'react-router-dom';

// required cause of infinite memory leak for chunking and node-12
import(/* webpackMode:"lazy", webpackChunkName: "vendors" */'react-autosuggest');

import Snackbar from 'ui/common/snackbar/Snackbar';
import renderRoutes from 'ui/renderRoutes';
import Crop from '@genesys/client/model/genesys/Crop';
import ApiCall from '@genesys/client/model/ApiCall';


interface IAppProps extends React.ClassAttributes<any>, WithTranslation {
    children: any;
    login: any;
    route: any;
    location: any;
    updateHistory: (path: string) => void;
    crops: Crop[];
    loadCrops: () => void;
    initMyList: () => void;
    countryCodes: ApiCall<any>;
    loadIso3Decodings: (lang: string) => void;
    serverInfo: any;
    serverInfoRequest: any;
    initMyMaps: any;
    refreshIso3Decodings: (lang: string) => void;
    lang: string;
}

class App extends React.Component<IAppProps, any> {

    public constructor(props: any) {
        super(props);
    }

    public componentDidMount() {
        const { initMyList, initMyMaps, refreshIso3Decodings, lang } = this.props;
        const { crops, loadCrops, serverInfo, serverInfoRequest} = this.props;
        if (! crops || crops.length === 0) {
            loadCrops();
        }
        if (! serverInfo || ! serverInfo.revision) {
            console.log('Requesting server info because we have:', serverInfo);
            serverInfoRequest();
        }

        initMyList();
        initMyMaps();
        refreshIso3Decodings(lang);
    }

    public componentDidUpdate(prevProps: IAppProps) {
        const {updateHistory, location: prevLocation} = prevProps;
        const {location} = this.props;
        if (prevLocation !== null && location !== null) {
            if (prevLocation !== location) {
                if (typeof window !== 'undefined') {
                    const origin = window.location.origin;
                    const path = location.pathname + location.search;
                    const links = [...document.getElementsByTagName('html')[0].getElementsByTagName('link')];
                    links.forEach((l) => {
                        if (l.getAttribute('rel') === 'alternate') {
                            const lang = l.getAttribute('hreflang') === 'en' ? '' : `/${l.getAttribute('hreflang')}`;
                            l.setAttribute('href', `${origin + lang + path}`);
                        }
                    });
                }
                updateHistory(`${location.pathname}${location.search ? location.search : ''}`);
            }
        }

        const {countryCodes, loadIso3Decodings, i18n, tReady} = this.props;
        if (tReady && (!countryCodes || (!countryCodes.loading && !countryCodes.error && !countryCodes.data))) {
            loadIso3Decodings(i18n.language);
        }
    }

    public render() {
        const { route: { routes } } = this.props;
        return (
            <div>
                { renderRoutes(routes) }
                <Snackbar />
            </div>
        );
    }
}

const mapStateToProps = (state) => ({
    wiewsCodes: state.decoder.wiewsCodes,
    countryCodes: state.decoder.countryCodes,
    crops: state.crop.public.list ? state.crop.public.list.data : undefined,
    serverInfo: state.serverInfo.data,
    lang: state.applicationConfig.lang,
});

const mapDispatchToProps = (dispatch) => bindActionCreators({
  updateHistory,
  loadCrops,
  initMyList,
  serverInfoRequest,
  loadIso3Decodings,
  initMyMaps,
  refreshIso3Decodings,
}, dispatch);

export default withRouter(connect(mapStateToProps, mapDispatchToProps)(withTranslation()(App)));