index.js

/* eslint-disable jsdoc/valid-types */
import React from 'react';
import LS_CONSTANTS from 'build-utils-react/config/constants';
import { createOlafApplication } from 'olaf';
import { TranslationProvider, translationReducer } from 'i18n-translations';
import App from './containers/App';
import globalSlice from './containers/App/reducer';
import appSagas from './containers/App/sagas';
import liveReducer from './containers/Live/reducer';
import liveSagas from './containers/Live/sagas';
import resultsReducer from './containers/Results/reducer';
import resultsSagas from './containers/Results/sagas';
import statisticsReducer from './containers/Statistics/reducer';
import statisticsSagas from './containers/Statistics/sagas';
import SVGProvider from './components/SVG/SVGProvider';
import statisticsDetailsReducer from './containers/TeamStatictics/reducer';
import statisticsDetailsSagas from './containers/TeamStatictics/sagas';

const PremierLeagueTeams = React.lazy(() => import('./svgs/PremierLeagueTeams'));
const LigaTeams = React.lazy(() => import('./svgs/LigaTeams'));
const SerieATeams = React.lazy(() => import('./svgs/SerieATeams'));
const BundesligaLeagueTeams = React.lazy(() => import('./svgs/BundesligaLeagueTeams'));
const Ligue1LeagueTeams = React.lazy(() => import('./svgs/Ligue1LeagueTeams'));
const PrimeiraLeagueTeams = React.lazy(() => import('./svgs/PrimeiraLeagueTeams'));
const EredivisieLeagueTeams = React.lazy(() => import('./svgs/EredivisieLeagueTeams'));
const TornadoLeagueTeams = React.lazy(() => import('./svgs/TornadoLeagueTeams'));
const Tornado2LeagueTeams = React.lazy(() => import('./svgs/Tornado2LeagueTeams'));
const PremierTurboLeagueTeams = React.lazy(() => import('./svgs/PremierTurboLeagueTeams'));
const AfconLeagueTeams = React.lazy(() => import('./svgs/AfconLeagueTeams'));

const bodyElement = document.querySelector('body');

if (process.env.SKIN === LS_CONSTANTS.SKINS.COLOMBIA) {
  bodyElement.classList.add('blue-theme');
} else if (process.env.SKIN === LS_CONSTANTS.SKINS.MAMABET) {
  bodyElement.classList.add('yellow-theme');
}

/**
 * @returns {view}
 */
function SVGTranslationAppComponent() {
  return (
    <SVGProvider>
      <TranslationProvider>
        <React.Suspense fallback={null}>
          <div className="svg-wrap" style={{ height: 0 }}>
            <PremierLeagueTeams />
            <LigaTeams />
            <SerieATeams />
            <BundesligaLeagueTeams />
            <Ligue1LeagueTeams />
            <PrimeiraLeagueTeams />
            <EredivisieLeagueTeams />
            <TornadoLeagueTeams />
            <Tornado2LeagueTeams />
            <PremierTurboLeagueTeams />
            <AfconLeagueTeams />
          </div>
        </React.Suspense>
        <App />
      </TranslationProvider>
    </SVGProvider>
  );
}
/**
 *
 * @external node_modules/olaf
 * @see {@link https://gitlab.com/providus.mu/fe-utils/olaf}
 */
/**
 * Olaf function to create usable aplications with passed routes, reducers, sagas and so on
 * @function external:node_modules/olaf.createOlafApplication
 * @returns {Application}
 */
createOlafApplication({
  name: 'app',
  thunk: true,
  hash: false,
  getRootDomElement: () => document.body.children[0],
  rootReactComponent: <SVGTranslationAppComponent />,
  reducers: {
    global: globalSlice,
    live: liveReducer,
    results: resultsReducer,
    statistics: statisticsReducer,
    statisticsDetails: statisticsDetailsReducer,
    i18n: translationReducer,
  },
  sagas: {
    app: appSagas,
    live: liveSagas,
    results: resultsSagas,
    statistics: statisticsSagas,
    statisticsDetails: statisticsDetailsSagas,
  },
});