import React, { Component, PropTypes } from 'react';
import { DataSourceType } from '../../constants/Constants';
import moment from 'moment';
import _ from 'lodash';

export default class DataSourceLogin extends Component {
  static propTypes = {
    children: PropTypes.node,
    disabled: PropTypes.bool,
    accessUrl: PropTypes.string,
    type: PropTypes.string,
    styling: PropTypes.string,
    onSuccess: PropTypes.func,
    onError: PropTypes.func
  };

  static defaultProps = {
    disabled: false,
    styling: 'width=584,height=600'
  };

  showPopup = () => {
    if (this.props.disabled) return;

    const { accessUrl, styling, type, onSuccess, onError } = this.props;
    const popupWindow = window.open(accessUrl, '', styling);

    const parseUrl = url => {
      // Ik stuur gewoon letterlijk 'error' terug in de url want in mijn geval sluit de popup toch meteen
      if (_.includes('error', url)) {
        return onError(url);
      }

      // Haal data op van url die je nodig hebt en parse die onzin
      const splitted = _.split(url, '/');
      const length = splitted.length;

      if (type === DataSourceType.MAIL_CHIMP) {
        return {
          accessToken: splitted[length - 2],
          dataCenter: splitted[length - 1],
          dateCreated: moment.utc().format()
        };
      }

      return {
        accessToken: splitted[length - 2].replace('TYRON', '/'),
        refreshToken: splitted[length - 1].replace('TYRON', '/'),
        dateCreated: moment.utc().format()
      };
    };

    // Open popup -> check url verandering -> verandering? -> handle success || error
    try {
      const interval = setInterval(() => {
        const href = popupWindow.location.href;

        if (href) {
          popupWindow.close();
          clearInterval(interval);
          onSuccess(parseUrl(href));
        }
      }, 1000);
    } catch (error) {
      // Ignore error
    }
  };

  render () {
    const { children } = this.props;

    return (
      <div onClick={this.showPopup}>
        {children}
      </div>
    );
  }
}