import React, { Component, Fragment } from "react"
import PropTypes from "prop-types"
import { api } from "src/API"
import { WaitModal } from "../Modal"
import { Column } from "ui"
import autobind from "autobind-decorator"

export class Parking extends Component {
  static propTypes = {
    history: PropTypes.oneOfType([PropTypes.array, PropTypes.object]),
  }

  componentDidMount() {
    api.addListener("login", this.goToRedirect)
    api.addListener("logout", this.goToLogin)
  }

  componentWillUnmount() {
    api.removeListener("login", this.goToRedirect)
    api.removeListener("logout", this.goToLogin)
  }

  @autobind
  goToRedirect() {
    if (this.props.history) {
      let url =
        new URLSearchParams(this.props.history.location.search).get(
          "redirect"
        ) || "/"

      try {
        this.props.history.replace(url)
      } catch (error) {
        this.props.history.replace("/")
      }
    }
  }

  @autobind
  goToLogin() {
    this.props.history.replace("/login")
  }

  render() {
    return (
      <Fragment>
        <Column.Item grow>
          <WaitModal open loader={false} message="Authenticating..." />
        </Column.Item>
      </Fragment>
    )
  }
}