App.tsx

/* eslint-disable @typescript-eslint/no-explicit-any */
import React from 'react'
import { HashRouter } from 'react-router-dom'
import { createBrowserHistory } from 'history'
import { Layout, Main, Content } from 'cozy-ui/transpiled/react/Layout'
import { useSelector } from 'react-redux'
import { AppStore } from 'store'

import Routes from 'components/Routes/Routes'
import Navbar from 'components/Navbar/Navbar'
import SplashRoot from 'components/Splash/SplashRoot'
import SplashScreen from 'components/Splash/SplashScreen'
import SplashScreenError from 'components/Splash/SplashScreenError'
import WelcomeModal from 'components/Onboarding/WelcomeModal'

export const history = createBrowserHistory()

export const App = () => {
  const { onboarding } = useSelector((state: AppStore) => state.ecolyo.profile)
  const { isLastTermAccepted } = useSelector(
    (state: AppStore) => state.ecolyo.global
  )

  return (
    <HashRouter {...history}>
      <Layout>
        <SplashRoot
          splashComponent={SplashScreen}
          splashErrorComponent={SplashScreenError}
        >
          {isLastTermAccepted && (
            <>
              <WelcomeModal open={!onboarding.isWelcomeSeen} />
              <Navbar />
            </>
          )}
          <Main>
            <Content className="app-content">
              <Routes isLastTermAccepted={isLastTermAccepted} />
            </Content>
          </Main>
        </SplashRoot>
      </Layout>
    </HashRouter>
  )
}

export default App