1
  2import {
  3    Sheet,
  4    SheetContent,
  5    SheetHeader,
  6    SheetTitle,
  7    Table,
  8    TableBody,
  9    TableCell,
 10    TableHead,
 11    TableRow,
 12} from "@marzneshin/components"
 13import { FC } from "react"
 14import { useTranslation } from "react-i18next"
 15import { HostType } from "../.."
 16
 17interface HostsSettingsDialogProps {
 18    onOpenChange: (state: boolean) => void
 19    open: boolean
 20    entity: HostType | null
 21}
 22
 23export const HostSettingsDialog: FC<HostsSettingsDialogProps> = ({ onOpenChange, open, entity }) => {
 24
 25    const { t } = useTranslation();
 26
 27    if (entity) {
 28        return (
 29            <Sheet open={open} onOpenChange={onOpenChange}>
 30                <SheetContent className="sm:min-w-full md:min-w-[700px]" >
 31                    <SheetHeader>
 32                        <SheetTitle>
 33                            {t('page.hosts.settings.title')}
 34                        </SheetTitle>
 35                    </SheetHeader>
 36                    <Table>
 37                        <TableBody>
 38                            <TableRow>
 39                                <TableHead>
 40                                    {t('remark')}
 41                                </TableHead>
 42                                <TableCell>
 43                                    {entity.remark}
 44                                </TableCell>
 45                            </TableRow>
 46                            <TableRow>
 47                                <TableHead>
 48                                    {t('address')}
 49                                </TableHead>
 50                                <TableCell>
 51                                    {entity.address}
 52                                </TableCell>
 53                            </TableRow>
 54                            <TableRow>
 55                                <TableHead>
 56                                    {t('port')}
 57                                </TableHead>
 58                                <TableCell>
 59                                    {entity.port}
 60                                </TableCell>
 61                            </TableRow>
 62                            <TableRow>
 63                                <TableHead>
 64                                    {t('host')}
 65                                </TableHead>
 66                                <TableCell>
 67                                    {entity.host}
 68                                </TableCell>
 69                            </TableRow>
 70                            <TableRow>
 71                                <TableHead>
 72                                    {t('path')}
 73                                </TableHead>
 74                                <TableCell>
 75                                    {entity.path}
 76                                </TableCell>
 77                            </TableRow>
 78                            <TableRow>
 79                                <TableHead>
 80                                    {t('sni')}
 81                                </TableHead>
 82                                <TableCell>
 83                                    {entity.sni}
 84                                </TableCell>
 85                            </TableRow>
 86                            <TableRow>
 87                                <TableHead>
 88                                    {t('alpn')}
 89                                </TableHead>
 90                                <TableCell>
 91                                    {entity.alpn}
 92                                </TableCell>
 93                            </TableRow>
 94                        </TableBody>
 95                    </Table>
 96                </SheetContent>
 97            </Sheet>
 98        )
 99    }
100}