|
1 |
| -import { Tab } from '@mui/material'; |
2 |
| -import { Navigate, Route, Routes } from 'react-router-dom'; |
3 |
| -import HelpInformation from './HelpInformation'; |
| 1 | +import CommentIcon from '@mui/icons-material/CommentTwoTone'; |
| 2 | +import EastIcon from '@mui/icons-material/East'; |
| 3 | +import GitHubIcon from '@mui/icons-material/GitHub'; |
| 4 | +import MenuBookIcon from '@mui/icons-material/MenuBookTwoTone'; |
| 5 | +import { Box, List, ListItem, ListItemAvatar, ListItemText, Link, Typography } from '@mui/material'; |
4 | 6 | import type { FC } from 'react';
|
5 |
| - |
6 |
| -import { RouterTabs, useRouterTab, useLayoutTitle } from 'components'; |
7 |
| - |
| 7 | +import { SectionContent, useLayoutTitle } from 'components'; |
8 | 8 | import { useI18nContext } from 'i18n/i18n-react';
|
9 | 9 |
|
10 | 10 | const Help: FC = () => {
|
11 | 11 | const { LL } = useI18nContext();
|
12 |
| - const { routerTab } = useRouterTab(); |
13 |
| - |
14 | 12 | useLayoutTitle(LL.HELP_OF(''));
|
15 | 13 |
|
| 14 | + const uploadURL = window.location.origin + '/system/upload'; |
| 15 | + |
16 | 16 | return (
|
17 |
| - <> |
18 |
| - <RouterTabs value={routerTab}> |
19 |
| - <Tab value="information" label={LL.HELP_OF('EMS-ESP')} /> |
20 |
| - </RouterTabs> |
21 |
| - <Routes> |
22 |
| - <Route path="information" element={<HelpInformation />} /> |
23 |
| - <Route path="/*" element={<Navigate replace to="information" />} /> |
24 |
| - </Routes> |
25 |
| - </> |
| 17 | + <SectionContent title={LL.SUPPORT_INFORMATION()} titleGutter> |
| 18 | + <List> |
| 19 | + <ListItem> |
| 20 | + <ListItemAvatar> |
| 21 | + <MenuBookIcon style={{ fontSize: 24, color: 'lightblue', verticalAlign: 'middle' }} /> |
| 22 | + </ListItemAvatar> |
| 23 | + <ListItemText> |
| 24 | + {LL.HELP_INFORMATION_1()} |
| 25 | + <EastIcon style={{ fontSize: 24, color: 'lightblue', verticalAlign: 'middle' }} /> |
| 26 | + |
| 27 | + <Link target="_blank" href="https://emsesp.github.io/docs" color="primary"> |
| 28 | + {LL.CLICK_HERE()} |
| 29 | + </Link> |
| 30 | + </ListItemText> |
| 31 | + </ListItem> |
| 32 | + |
| 33 | + <ListItem> |
| 34 | + <ListItemAvatar> |
| 35 | + <CommentIcon style={{ fontSize: 24, color: 'lightblue', verticalAlign: 'middle' }} /> |
| 36 | + </ListItemAvatar> |
| 37 | + <ListItemText> |
| 38 | + {LL.HELP_INFORMATION_2()} |
| 39 | + <EastIcon style={{ fontSize: 24, color: 'lightblue', verticalAlign: 'middle' }} /> |
| 40 | + |
| 41 | + <Link target="_blank" href="https://discord.gg/3J3GgnzpyT" color="primary"> |
| 42 | + {LL.CLICK_HERE()} |
| 43 | + </Link> |
| 44 | + </ListItemText> |
| 45 | + </ListItem> |
| 46 | + |
| 47 | + <ListItem> |
| 48 | + <ListItemAvatar> |
| 49 | + <GitHubIcon style={{ fontSize: 24, color: 'lightblue', verticalAlign: 'middle' }} /> |
| 50 | + </ListItemAvatar> |
| 51 | + <ListItemText> |
| 52 | + {LL.HELP_INFORMATION_3()} |
| 53 | + <EastIcon style={{ fontSize: 24, color: 'lightblue', verticalAlign: 'middle' }} /> |
| 54 | + <Link target="_blank" href="https://github.com/emsesp/EMS-ESP32/issues/new/choose" color="primary"> |
| 55 | + {LL.CLICK_HERE()} |
| 56 | + </Link> |
| 57 | + <br /> |
| 58 | + <i>({LL.HELP_INFORMATION_4()}</i> |
| 59 | + <Link href={uploadURL} color="primary"> |
| 60 | + {LL.UPLOAD()} |
| 61 | + </Link> |
| 62 | + ) |
| 63 | + </ListItemText> |
| 64 | + </ListItem> |
| 65 | + </List> |
| 66 | + |
| 67 | + <Box border={1} p={1} mt={4} color="orange"> |
| 68 | + <Typography align="center" variant="subtitle1" color="orange"> |
| 69 | + <b>{LL.HELP_INFORMATION_5()}</b> |
| 70 | + </Typography> |
| 71 | + <Typography align="center"> |
| 72 | + <Link target="_blank" href="https://github.com/emsesp/EMS-ESP32" color="primary"> |
| 73 | + {'github.com/emsesp/EMS-ESP32'} |
| 74 | + </Link> |
| 75 | + </Typography> |
| 76 | + <Typography color="white" align="center"> |
| 77 | + @proddy @MichaelDvP |
| 78 | + </Typography> |
| 79 | + </Box> |
| 80 | + </SectionContent> |
26 | 81 | );
|
27 | 82 | };
|
28 | 83 |
|
|
0 commit comments