import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import React from 'react';
import { connect } from 'react-redux';
import { HashRouter, Route } from 'react-router-dom';
import { routeProp } from '../../utils/propTypes';
import Header from './Header';
import Footer from './Footer';
import * as actions from './actions';
import '../../style/core/css/cagov.core.css';
import '../../style/style.scss'; // main container for applications - handles routing and user settings

export var App =
/*#__PURE__*/
function (_React$PureComponent) {
  _inherits(App, _React$PureComponent);

  function App() {
    var _getPrototypeOf2;

    var _this;

    _classCallCheck(this, App);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(App)).call.apply(_getPrototypeOf2, [this].concat(args)));

    _this.getRoutes = function () {
      var routes = _this.props.routes;
      return routes.map(function (route) {
        return React.createElement(Route, route);
      });
    };

    _this.setSettings = function () {
      document.body.style.zoom = Number(localStorage.getItem('zoom'));

      if (localStorage.getItem('highContrast')) {
        document.getElementsByTagName('html')[0].classList.add('high-contrast');
      }
    };

    _this.registerRouting = function () {
      var _this$props = _this.props,
          updateRouting = _this$props.updateRouting,
          routes = _this$props.routes,
          contactLink = _this$props.contactLink; // update store with routes and current pages hash

      updateRouting({
        routes: routes,
        contactLink: contactLink,
        hash: window.location.hash.replace('#', '')
      }); // register for future changes and clear errors on page change

      window.addEventListener('hashchange', function (event) {
        var hash = event.newURL.replace(/^[^#]*#/, '');
        updateRouting({
          hash: hash
        });
      });
    };

    return _this;
  }

  _createClass(App, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      this.setSettings();
      this.registerRouting();
    }
  }, {
    key: "render",
    value: function render() {
      return React.createElement(HashRouter, null, React.createElement(React.Fragment, null, React.createElement(Header, null), React.createElement("div", {
        id: "main-content",
        className: "main-content"
      }, React.createElement("div", {
        className: "section"
      }, React.createElement("main", {
        className: "main-primary"
      }, this.getRoutes()))), React.createElement(Footer, null)));
    }
  }]);

  return App;
}(React.PureComponent);
App.defaultProps = {
  contactLink: '/help'
};
export var mapDispatchToProps = function mapDispatchToProps(dispatch) {
  return {
    updateRouting: function updateRouting(props) {
      return dispatch(actions.updateRouting(props));
    }
  };
};
var withRedux = connect(null, mapDispatchToProps);
export default withRedux(App);