Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 6718 | Rev 6725 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |

import React, { lazy, Suspense, useEffect } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import { BrowserRouter as Router, Switch } from 'react-router-dom'
import styled from 'styled-components'
import { getLanguage } from '../../redux/intl/intl.action'

import PublicRoute from './PublicRoute'
import PrivateRoute from './PrivateRoute'
import Spinner from '../components/UI/Spinner'
import NotificationAlert from '../components/UI/notification/NotificationAlert'

const Header = lazy(() => import('../components/navbar/Header'))
const Auth = lazy(() => import('../pages/auth/Auth'))
const DashboardPage = lazy(() => import('../pages/dashboard/DashboardPage'))
const MyConnectionsPage = lazy(() =>
  import('../pages/connections/MyConnectionsPage')
)
const InvitationsSendPage = lazy(() =>
  import('../pages/connections/InvitationsSend')
)

const StyledSpinnerContainer = styled.div`
  margin: 1rem auto;
  position: relative;
  width: 80px;
  text-align: center;
  height: 80px;
  border-radius: 100px;
  background-color: #fff;
  line-height: 80px;
  border: 1px solid #e1e1e1;
  cursor: pointer;
`

const AppRouter = () => {
  const { isAuth } = useSelector(({ auth }) => auth)
  const dispatch = useDispatch()

  useEffect(() => {
    dispatch(getLanguage())
  }, [])

  return (
    <Router>
      <Suspense
        fallback={
          <StyledSpinnerContainer>
            <Spinner />
          </StyledSpinnerContainer>
        }
      >
        {isAuth && <Header />}

        <Switch>
          <PrivateRoute exact path="/dashboard" isAuthenticated={isAuth}>
            <DashboardPage />
          </PrivateRoute>
          <PrivateRoute
            exact
            path="/connection/my-connections"
            isAuthenticated={isAuth}
          >
            <MyConnectionsPage />
          </PrivateRoute>
          <PrivateRoute
            exact
            path="/connection/invitations-sent"
            isAuthenticated={isAuth}
          >
            <InvitationsSendPage />
          </PrivateRoute>

          <PublicRoute path="/" isAuthenticated={isAuth}>
            <Auth />
          </PublicRoute>
        </Switch>
      </Suspense>

      <NotificationAlert />
    </Router>
  )
}

export default AppRouter