gitscope
https://dev.kronoz.win/r/marzneshin.git
app/dashboard/src/pages/hosts/dialog/remark-field-popover.tsx · v0.1.3
Source
1 89f8f93 Mardin 2y ago
2 89f8f93 Mardin 2y ago import { InfoIcon } from './icons';
3 89f8f93 Mardin 2y ago import {
4 89f8f93 Mardin 2y ago Badge,
5 89f8f93 Mardin 2y ago Box,
6 89f8f93 Mardin 2y ago Popover,
7 89f8f93 Mardin 2y ago PopoverArrow,
8 89f8f93 Mardin 2y ago PopoverBody,
9 89f8f93 Mardin 2y ago PopoverCloseButton,
10 89f8f93 Mardin 2y ago PopoverContent,
11 89f8f93 Mardin 2y ago PopoverTrigger,
12 89f8f93 Mardin 2y ago Portal,
13 89f8f93 Mardin 2y ago Text,
14 89f8f93 Mardin 2y ago } from '@chakra-ui/react';
15 89f8f93 Mardin 2y ago import { useTranslation } from 'react-i18next';
16 89f8f93 Mardin 2y ago import 'slick-carousel/slick/slick-theme.css';
17 89f8f93 Mardin 2y ago import 'slick-carousel/slick/slick.css';
18 89f8f93 Mardin 2y ago
19 89f8f93 Mardin 2y ago export const RemarkFieldPopover = () => {
20 89f8f93 Mardin 2y ago const { t } = useTranslation();
21 89f8f93 Mardin 2y ago return (
22 89f8f93 Mardin 2y ago <Popover isLazy placement="right">
23 89f8f93 Mardin 2y ago <PopoverTrigger>
24 89f8f93 Mardin 2y ago <Box mt="-8px">
25 89f8f93 Mardin 2y ago <InfoIcon />
26 89f8f93 Mardin 2y ago </Box>
27 89f8f93 Mardin 2y ago </PopoverTrigger>
28 89f8f93 Mardin 2y ago <Portal>
29 89f8f93 Mardin 2y ago <PopoverContent>
30 89f8f93 Mardin 2y ago <PopoverArrow />
31 89f8f93 Mardin 2y ago <PopoverCloseButton />
32 89f8f93 Mardin 2y ago <PopoverBody>
33 89f8f93 Mardin 2y ago <Box fontSize="xs">
34 89f8f93 Mardin 2y ago <Text pr="20px">{t('hostsDialog.desc')}</Text>
35 89f8f93 Mardin 2y ago <Text>
36 89f8f93 Mardin 2y ago <Badge>
37 89f8f93 Mardin 2y ago {'{'}SERVER_IP{'}'}
38 89f8f93 Mardin 2y ago </Badge>{' '}
39 89f8f93 Mardin 2y ago {t('hostsDialog.currentServer')}
40 89f8f93 Mardin 2y ago </Text>
41 89f8f93 Mardin 2y ago <Text mt={1}>
42 89f8f93 Mardin 2y ago <Badge>
43 89f8f93 Mardin 2y ago {'{'}USERNAME{'}'}
44 89f8f93 Mardin 2y ago </Badge>{' '}
45 89f8f93 Mardin 2y ago {t('hostsDialog.username')}
46 89f8f93 Mardin 2y ago </Text>
47 89f8f93 Mardin 2y ago <Text mt={1}>
48 89f8f93 Mardin 2y ago <Badge>
49 89f8f93 Mardin 2y ago {'{'}DATA_USAGE{'}'}
50 89f8f93 Mardin 2y ago </Badge>{' '}
51 89f8f93 Mardin 2y ago {t('hostsDialog.dataUsage')}
52 89f8f93 Mardin 2y ago </Text>
53 89f8f93 Mardin 2y ago <Text mt={1}>
54 89f8f93 Mardin 2y ago <Badge>
55 89f8f93 Mardin 2y ago {'{'}DATA_LEFT{'}'}
56 89f8f93 Mardin 2y ago </Badge>{' '}
57 89f8f93 Mardin 2y ago {t('hostsDialog.remainingData')}
58 89f8f93 Mardin 2y ago </Text>
59 89f8f93 Mardin 2y ago <Text mt={1}>
60 89f8f93 Mardin 2y ago <Badge>
61 89f8f93 Mardin 2y ago {'{'}DATA_LIMIT{'}'}
62 89f8f93 Mardin 2y ago </Badge>{' '}
63 89f8f93 Mardin 2y ago {t('hostsDialog.dataLimit')}
64 89f8f93 Mardin 2y ago </Text>
65 89f8f93 Mardin 2y ago <Text mt={1}>
66 89f8f93 Mardin 2y ago <Badge>
67 89f8f93 Mardin 2y ago {'{'}DAYS_LEFT{'}'}
68 89f8f93 Mardin 2y ago </Badge>{' '}
69 89f8f93 Mardin 2y ago {t('hostsDialog.remainingDays')}
70 89f8f93 Mardin 2y ago </Text>
71 89f8f93 Mardin 2y ago <Text mt={1}>
72 89f8f93 Mardin 2y ago <Badge>
73 89f8f93 Mardin 2y ago {'{'}EXPIRE_DATE{'}'}
74 89f8f93 Mardin 2y ago </Badge>{' '}
75 89f8f93 Mardin 2y ago {t('hostsDialog.expireDate')}
76 89f8f93 Mardin 2y ago </Text>
77 89f8f93 Mardin 2y ago <Text mt={1}>
78 89f8f93 Mardin 2y ago <Badge>
79 89f8f93 Mardin 2y ago {'{'}JALALI_EXPIRE_DATE{'}'}
80 89f8f93 Mardin 2y ago </Badge>{' '}
81 89f8f93 Mardin 2y ago {t('hostsDialog.jalaliExpireDate')}
82 89f8f93 Mardin 2y ago </Text>
83 89f8f93 Mardin 2y ago <Text mt={1}>
84 89f8f93 Mardin 2y ago <Badge>
85 89f8f93 Mardin 2y ago {'{'}TIME_LEFT{'}'}
86 89f8f93 Mardin 2y ago </Badge>{' '}
87 89f8f93 Mardin 2y ago {t('hostsDialog.remainingTime')}
88 89f8f93 Mardin 2y ago </Text>
89 89f8f93 Mardin 2y ago <Text mt={1}>
90 89f8f93 Mardin 2y ago <Badge>
91 89f8f93 Mardin 2y ago {'{'}STATUS_EMOJI{'}'}
92 89f8f93 Mardin 2y ago </Badge>{' '}
93 89f8f93 Mardin 2y ago {t('hostsDialog.statusEmoji')}
94 89f8f93 Mardin 2y ago </Text>
95 89f8f93 Mardin 2y ago <Text mt={1}>
96 89f8f93 Mardin 2y ago <Badge>
97 89f8f93 Mardin 2y ago {'{'}PROTOCOL{'}'}
98 89f8f93 Mardin 2y ago </Badge>{' '}
99 89f8f93 Mardin 2y ago {t('hostsDialog.proxyProtocol')}
100 89f8f93 Mardin 2y ago </Text>
101 89f8f93 Mardin 2y ago <Text mt={1}>
102 89f8f93 Mardin 2y ago <Badge>
103 89f8f93 Mardin 2y ago {'{'}TRANSPORT{'}'}
104 89f8f93 Mardin 2y ago </Badge>{' '}
105 89f8f93 Mardin 2y ago {t('hostsDialog.proxyMethod')}
106 89f8f93 Mardin 2y ago </Text>
107 89f8f93 Mardin 2y ago </Box>
108 89f8f93 Mardin 2y ago </PopoverBody>
109 89f8f93 Mardin 2y ago </PopoverContent>
110 89f8f93 Mardin 2y ago </Portal>
111 89f8f93 Mardin 2y ago </Popover>
112 89f8f93 Mardin 2y ago );
113 89f8f93 Mardin 2y ago }