import React from 'react';
import { Router } from '@reach/router';
import { compose, lifecycle } from 'recompose';
import { connect } from './redux/store';
import { ErrorUnexpected, Loading } from '@kineticdata/bundle-common';
import { I18n } from '@kineticdata/react';
import { PageTitle } from './components/shared/PageTitle';
import { Sidebar } from './components/Sidebar';
import { Home } from './components/Home';
import { Past } from './components/Past';
import { TechBars } from './components/TechBars';
import { Display } from './components/Display';
import { Form } from './components/Form';
import { AppointmentForm } from './components/AppointmentForm';
import { Settings } from './components/settings/Settings';
import { Sidebar as SettingsSidebar } from './components/settings/Sidebar';
import { actions } from './redux/modules/techBarApp';

var AppComponent = function AppComponent(props) {
  if (props.error) {
    return /*#__PURE__*/React.createElement(ErrorUnexpected, null);
  } else if (props.loading) {
    return /*#__PURE__*/React.createElement(Loading, {
      text: "App is loading ..."
    });
  } else {
    return props.render({
      sidebar: /*#__PURE__*/React.createElement(Router, null, /*#__PURE__*/React.createElement(SettingsSidebar, {
        settingsBackPath: props.settingsBackPath,
        path: "settings/*"
      }), /*#__PURE__*/React.createElement(Sidebar, {
        counts: props.submissionCounts,
        homePageMode: props.homePageMode,
        homePageItems: props.homePageItems,
        openSettings: props.openSettings,
        path: "*"
      })),
      main: /*#__PURE__*/React.createElement(I18n, null, /*#__PURE__*/React.createElement("main", {
        className: "package-layout package-layout--tech-bar"
      }, /*#__PURE__*/React.createElement(PageTitle, {
        parts: ['Loading...']
      }), /*#__PURE__*/React.createElement(Router, null, /*#__PURE__*/React.createElement(Settings, {
        path: "settings/*"
      }), /*#__PURE__*/React.createElement(Home, {
        path: "/"
      }), /*#__PURE__*/React.createElement(TechBars, {
        path: "/tech-bars"
      }), /*#__PURE__*/React.createElement(AppointmentForm, {
        path: "/past/appointment/:techBarId/:id"
      }), /*#__PURE__*/React.createElement(Past, {
        path: "/past"
      }), /*#__PURE__*/React.createElement(AppointmentForm, {
        path: "/appointment/:techBarId/:id"
      }), /*#__PURE__*/React.createElement(AppointmentForm, {
        path: "/appointment/:techBarId"
      }), /*#__PURE__*/React.createElement(AppointmentForm, {
        path: "/appointment/:id"
      }), /*#__PURE__*/React.createElement(AppointmentForm, {
        path: "/appointment"
      }), /*#__PURE__*/React.createElement(Form, {
        path: "/forms/:formSlug/submissions/:id"
      }), /*#__PURE__*/React.createElement(Form, {
        path: "/forms/:formSlug"
      }), /*#__PURE__*/React.createElement(Display, {
        path: "/display/:techBarId/:mode"
      }), /*#__PURE__*/React.createElement(Display, {
        path: "/display/:techBarId"
      }))))
    });
  }
};

var mapStateToProps = function mapStateToProps(state, props) {
  return {
    loading: state.techBarApp.loading,
    error: state.techBarApp.error,
    settingsBackPath: "/kapps/".concat(state.app.kappSlug)
  };
};

var mapDispatchToProps = {
  fetchAppDataRequest: actions.fetchAppDataRequest
};
var enhance = compose(connect(mapStateToProps, mapDispatchToProps), lifecycle({
  componentDidMount: function componentDidMount() {
    this.props.fetchAppDataRequest();
  }
}));
export var App = enhance(AppComponent);