App.tsx

import Navbar from 'components/Navbar/Navbar'
import AppRoutes from 'components/Routes/Routes'
import SplashRoot from 'components/Splash/SplashRoot'
import WelcomeModal from 'components/WelcomeModal/WelcomeModal'
import { Layout } from 'cozy-ui/transpiled/react/Layout'
import React, { useEffect } from 'react'
import { useSelector } from 'react-redux'
import { useLocation } from 'react-router-dom'
import { AppStore } from 'store'
import MatomoTracker from 'utils/matomoTracker'

interface AppProps {
  tracker: undefined | MatomoTracker
}

export const App = ({ tracker }: AppProps) => {
  const location = useLocation()
  const {
    global: { termsStatus },
    profile: { onboarding },
  } = useSelector((state: AppStore) => state.ecolyo)

  useEffect(() => {
    tracker?.track(location)
  }, [tracker, location])

  return (
    <Layout>
      <SplashRoot>
        {termsStatus.accepted && (
          <>
            <WelcomeModal open={!onboarding.isWelcomeSeen} />
            <Navbar />
          </>
        )}
        <main className="app-content">
          <AppRoutes termsStatus={termsStatus} />
        </main>
      </SplashRoot>
    </Layout>
  )
}

export default App