gitscope
/
← marzneshin / dashboard/src/features/users/components/services-card.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/services-card.tsx · v0.3.0-alpha
Source
1 857e289 Mrdn 2y ago
2 857e289 Mrdn 2y ago import { Label, Separator } from '@marzneshin/components';
3 857e289 Mrdn 2y ago import { ServiceType } from '@marzneshin/features/services';
4 857e289 Mrdn 2y ago import { LucideIcon, ServerIcon, UserIcon } from 'lucide-react';
5 857e289 Mrdn 2y ago import { FC } from 'react'
6 857e289 Mrdn 2y ago
7 857e289 Mrdn 2y ago interface ServiceCardProps {
8 857e289 Mrdn 2y ago service: ServiceType
9 857e289 Mrdn 2y ago }
10 857e289 Mrdn 2y ago
11 857e289 Mrdn 2y ago const ServiceProperty = ({ Icon, amount }: { Icon: LucideIcon, amount: number }) => (
12 857e289 Mrdn 2y ago <div className="flex flex-row items-center w-full">
13 857e289 Mrdn 2y ago <Icon className="w-4 h-4 font-light" />
14 857e289 Mrdn 2y ago {amount}
15 857e289 Mrdn 2y ago </div>
16 857e289 Mrdn 2y ago )
17 857e289 Mrdn 2y ago
18 857e289 Mrdn 2y ago export const ServiceCard: FC<ServiceCardProps> = (
19 857e289 Mrdn 2y ago { service }
20 857e289 Mrdn 2y ago ) => {
21 857e289 Mrdn 2y ago if (service.users && service.inbounds) {
22 857e289 Mrdn 2y ago return (
23 857e289 Mrdn 2y ago <div className="w-full border rounded-md p-2 flex justify-between flex-row items-center">
24 857e289 Mrdn 2y ago <Label>{service.name}</Label>
25 857e289 Mrdn 2y ago <div className="flex flex-row items-center gap-1">
26 857e289 Mrdn 2y ago <ServiceProperty Icon={UserIcon} amount={service.users.length} />
27 857e289 Mrdn 2y ago <Separator className="w-4 rotate-[-75deg]" />
28 857e289 Mrdn 2y ago <ServiceProperty Icon={ServerIcon} amount={service.inbounds.length} />
29 857e289 Mrdn 2y ago </div>
30 857e289 Mrdn 2y ago </div>
31 857e289 Mrdn 2y ago )
32 857e289 Mrdn 2y ago }
33 857e289 Mrdn 2y ago };