import React from "react";
import Router from "component/router";
import Header from "component/header";
import ErrorModal from "component/errorModal";
import DownloadingModal from "component/downloadingModal";
import UpgradeModal from "component/upgradeModal";
import WelcomeModal from "component/welcomeModal";
import lbry from "lbry";
import { Line } from "rc-progress";

class App extends React.Component {
  componentWillMount() {
    document.addEventListener("unhandledError", event => {
      this.props.alertError(event.detail);
    });

    if (!this.props.upgradeSkipped) {
      this.props.checkUpgradeAvailable();
    }

    lbry.balanceSubscribe(balance => {
      this.props.updateBalance(balance);
    });
  }

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

    return (
      <div id="window">
        <Header />
        <div id="main-content">
          <Router />
        </div>
        {modal == "upgrade" && <UpgradeModal />}
        {modal == "downloading" && <DownloadingModal />}
        {modal == "error" && <ErrorModal />}
        {modal == "welcome" && <WelcomeModal />}
      </div>
    );
  }
}

export default App;