DocSpace-buildtools/web/ASC.Web.Client/src/App.js

import React, { Suspense, lazy, useEffect } from "react";
import { Router, Route, Switch } from "react-router-dom";
import {
  history,
  PrivateRoute,
  PublicRoute,
  Login,
  Error404,
  Offline,
  ComingSoon,
  NavMenu,
  Main,
  utils,
  toastr,
} from "asc-web-common";
import Home from "./components/pages/Home";
import { inject, observer } from "mobx-react";

const About = lazy(() => import("./components/pages/About"));
const Confirm = lazy(() => import("./components/pages/Confirm"));
const Settings = lazy(() => import("./components/pages/Settings"));
const Wizard = lazy(() => import("./components/pages/Wizard"));
const Payments = lazy(() => import("./components/pages/Payments"));
const ThirdPartyResponse = lazy(() => import("./components/pages/ThirdParty"));

const App = (props) => {
  //constructor(props) {
  //super(props);

  //const pathname = window.location.pathname.toLowerCase();
  //this.isThirdPartyResponse = pathname.indexOf("thirdparty") !== -1;
  //}

  const { isLoaded, loadBaseInfo, isThirdPartyResponse } = props;

  useEffect(() => {
    try {
      loadBaseInfo();
    } catch (err) {
      toastr.error(err);
    }
  }, [loadBaseInfo]);

  useEffect(() => {
    console.log("App render", isLoaded);
    if (isLoaded) utils.updateTempContent();
  }, [isLoaded]);

  // useEffect(() => {
  //   debugger;
  //   utils.updateTempContent(isAuthenticated);
  // }, [isAuthenticated]);

  // if (this.isThirdPartyResponse) {
  //   //setIsLoaded();
  //   return;
  // }

  //utils.updateTempContent();
  //setIsLoaded();

  // const requests = [];
  // if (!isAuthenticated) {
  //   requests.push(getPortalSettings());
  // } else if (
  //   !window.location.pathname.includes("confirm/EmailActivation")
  // ) {
  //   requests.push(getUser());
  //   requests.push(getPortalSettings());
  //   //requests.push(getModules());
  // }

  // Promise.all(requests)
  //   .catch((e) => {
  //     toastr.error(e);
  //   })
  //   .finally(() => {
  //     utils.updateTempContent();
  //     setIsLoaded();
  //   });

  return navigator.onLine ? (
    <Router history={history}>
      {!isThirdPartyResponse && <NavMenu />}
      <Main>
        <Suspense fallback={null}>
          <Switch>
            <Route exact path="/wizard" component={Wizard} />
            <PublicRoute
              exact
              path={[
                "/login",
                "/login/error=:error",
                "/login/confirmed-email=:confirmedEmail",
              ]}
              component={Login}
            />
            <Route path="/confirm" component={Confirm} />
            <PrivateRoute
              path={`/thirdparty/:provider`}
              component={ThirdPartyResponse}
            />
            <PrivateRoute
              exact
              path={["/", "/error=:error"]}
              component={Home}
            />
            <PrivateRoute exact path="/about" component={About} />
            <PrivateRoute restricted path="/settings" component={Settings} />
            <PrivateRoute
              exact
              path={["/coming-soon"]}
              component={ComingSoon}
            />
            <PrivateRoute path="/payments" component={Payments} />
            <PrivateRoute component={Error404} />
          </Switch>
        </Suspense>
      </Main>
    </Router>
  ) : (
    <Offline />
  );
};

export default inject(({ auth }) => {
  const { init, isLoaded } = auth;

  const pathname = window.location.pathname.toLowerCase();
  const isThirdPartyResponse = pathname.indexOf("thirdparty") !== -1;

  return {
    loadBaseInfo: init,
    isThirdPartyResponse,
    isLoaded,
  };
})(observer(App));