import React, { useEffect } from "react";
import { Router } from "react-router-dom";
import { Helmet } from "react-helmet-async";
import i18next from "i18next";
import history from "./store/utils/history";
import MainContainer from "./components/Section/MainContainer";
import AppRoutes from "./AppRoutes";
import { useDispatch } from "react-redux";
import { refreshUserToken } from "./store/actions/login/loginActions";
import { BASE_PAGE } from "./constants/pages";

function App() {
  const dispatch = useDispatch();

  useEffect(() => {
    if (history.location.pathname === BASE_PAGE) {
      return;
    }
    dispatch(refreshUserToken());
  }, []);

  return (
    <>
      <Router history={history}>
        <Helmet>
          <title>{i18next.t("app.title")}</title>
        </Helmet>
        <MainContainer>
          <AppRoutes />
        </MainContainer>
      </Router>
    </>
  );
}

export default App;