1
|
import './App.css'
|
2
|
import { Routes, Route, Link } from 'react-router-dom'
|
3
|
import Home from './features/Home/Home'
|
4
|
import Catalog from './features/Catalog/Catalog'
|
5
|
import NotFound from './features/NotFound/NotFound'
|
6
|
import { Container, Paper, Theme } from '@mui/material'
|
7
|
import { ThemeProvider } from '@emotion/react'
|
8
|
import { useSelector } from 'react-redux'
|
9
|
import { RootState } from './features/redux/store'
|
10
|
import Login from './features/Auth/Login'
|
11
|
import CatalogItemDetail from './features/Catalog/CatalogItemDetail'
|
12
|
import Navigation from './features/Navigation/Navigation'
|
13
|
|
14
|
const App = () => {
|
15
|
const theme: Theme = useSelector((state: RootState) => state.theme.theme)
|
16
|
|
17
|
return (
|
18
|
<ThemeProvider theme={theme}>
|
19
|
<Navigation>
|
20
|
<Container>
|
21
|
<Routes>
|
22
|
<Route path="/" element={<Home />} />
|
23
|
<Route path="/catalog" element={<Catalog />} />
|
24
|
<Route
|
25
|
path="/catalog/:itemId"
|
26
|
element={<CatalogItemDetail />}
|
27
|
/>
|
28
|
<Route path="/login" element={<Login />} />
|
29
|
<Route path="*" element={<NotFound />} />
|
30
|
</Routes>
|
31
|
</Container>
|
32
|
</Navigation>
|
33
|
</ThemeProvider>
|
34
|
)
|
35
|
}
|
36
|
|
37
|
export default App
|