gitscope
/
← marzneshin / dashboard/src/features/users/components/used-user-traffic.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/users/components/used-user-traffic.tsx · v0.3.0-alpha4
Source
1 ab3442f Mrdn 2y ago import { FC } from 'react'
2 ab3442f Mrdn 2y ago import { UserType } from '@marzneshin/features/users';
3 ab3442f Mrdn 2y ago import { CircularProgress } from '@nextui-org/progress';
4 ab3442f Mrdn 2y ago import prettyBytes from 'pretty-bytes';
5 ab3442f Mrdn 2y ago
6 ab3442f Mrdn 2y ago
7 ab3442f Mrdn 2y ago interface UserUsedTrafficProps {
8 ab3442f Mrdn 2y ago user: UserType
9 ab3442f Mrdn 2y ago }
10 ab3442f Mrdn 2y ago
11 ab3442f Mrdn 2y ago export const UserUsedTraffic: FC<UserUsedTrafficProps> = (
12 ab3442f Mrdn 2y ago { user }
13 ab3442f Mrdn 2y ago ) => {
14 ab3442f Mrdn 2y ago return (
15 ab3442f Mrdn 2y ago user.data_limit ? (
16 ab3442f Mrdn 2y ago <div className="flex gap-x-5 justify-start items-center">
17 ab3442f Mrdn 2y ago <CircularProgress
18 ab3442f Mrdn 2y ago value={user.used_traffic / user.data_limit * 100}
19 ab3442f Mrdn 2y ago size='sm'
20 ab3442f Mrdn 2y ago showValueLabel
21 ab3442f Mrdn 2y ago />
22 ab3442f Mrdn 2y ago <div>
23 ab3442f Mrdn 2y ago <p className="text-sm font-medium text-gray-900 dark:text-gray-50">
24 ab3442f Mrdn 2y ago {prettyBytes(user.used_traffic)}
25 ab3442f Mrdn 2y ago </p>
26 ab3442f Mrdn 2y ago <p className="text-sm text-gray-500 dark:text-gray-500">
27 ab3442f Mrdn 2y ago {prettyBytes(user.data_limit)}
28 ab3442f Mrdn 2y ago </p>
29 ab3442f Mrdn 2y ago </div>
30 ab3442f Mrdn 2y ago </div>
31 ab3442f Mrdn 2y ago ) : ("No Traffic")
32 ab3442f Mrdn 2y ago );
33 ab3442f Mrdn 2y ago }