73 lines
1.6 KiB
TypeScript
73 lines
1.6 KiB
TypeScript
import React, { useEffect, Suspense } from 'react'
|
|
import { Routes, Route, useNavigate } from 'react-router-dom'
|
|
import { Provider } from 'react-redux'
|
|
import { getNavigationsValue } from '@brojs/cli'
|
|
import { Box, Container, Spinner, VStack } from '@chakra-ui/react'
|
|
|
|
import {
|
|
CourseListPage,
|
|
LessonDetailsPage,
|
|
LessonListPage,
|
|
UserPage,
|
|
} from './pages'
|
|
|
|
const Wrapper = ({ children }: { children: React.ReactElement }) => (
|
|
<Suspense
|
|
fallback={
|
|
<Container>
|
|
<VStack>
|
|
<Box mt="150">
|
|
<Spinner
|
|
thickness="4px"
|
|
speed="0.65s"
|
|
emptyColor="gray.200"
|
|
color="blue.500"
|
|
size="xl"
|
|
/></Box>
|
|
</VStack>
|
|
</Container>
|
|
}
|
|
>
|
|
{children}
|
|
</Suspense>
|
|
)
|
|
|
|
export const Dashboard = ({ store }) => (
|
|
<Provider store={store}>
|
|
<Routes>
|
|
<Route
|
|
path={getNavigationsValue('journal.main')}
|
|
element={
|
|
<Wrapper>
|
|
<CourseListPage />
|
|
</Wrapper>
|
|
}
|
|
/>
|
|
<Route
|
|
path={`${getNavigationsValue('journal.main')}/lessons-list/:courseId`}
|
|
element={
|
|
<Wrapper>
|
|
<LessonListPage />
|
|
</Wrapper>
|
|
}
|
|
/>
|
|
<Route
|
|
path={`${getNavigationsValue('journal.main')}/u/:lessonId/:accessId`}
|
|
element={
|
|
<Wrapper>
|
|
<UserPage />
|
|
</Wrapper>
|
|
}
|
|
/>
|
|
<Route
|
|
path={`${getNavigationsValue('journal.main')}/lesson/:courseId/:lessonId`}
|
|
element={
|
|
<Wrapper>
|
|
<LessonDetailsPage />
|
|
</Wrapper>
|
|
}
|
|
/>
|
|
</Routes>
|
|
</Provider>
|
|
)
|