gitscope
← marzneshin / v0.4.1 / dashboard/src/features/hosts/dialogs/settings/index.tsx
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/hosts/dialogs/settings/index.tsx · TypeScript
Blame Raw
 1import { type FC, useEffect } from "react";
 2import {
 3    SettingsDialogProps,
 4    SettingsDialog,
 5    Table,
 6    TableBody,
 7    TableRowWithCell,
 8} from "@marzneshin/components"
 9import { useTranslation } from "react-i18next"
10import { HostType } from "../.."
11
12interface HostsSettingsDialogProps extends SettingsDialogProps {
13    onOpenChange: (state: boolean) => void
14    onClose: () => void
15    open: boolean
16    entity: HostType
17}
18
19export const HostSettingsDialog: FC<HostsSettingsDialogProps> = ({ onOpenChange, open, entity, onClose }) => {
20    const { t } = useTranslation();
21
22    useEffect(() => {
23        if (!open) onClose();
24    }, [open, onClose]);
25
26    return (
27        <SettingsDialog open={open} onOpenChange={onOpenChange}>
28            <Table>
29                <TableBody>
30                    <TableRowWithCell label={t('remark')} value={entity.remark} />
31                    <TableRowWithCell label={t('address')} value={entity.address} />
32                    <TableRowWithCell label={t('port')} value={entity.port} />
33                    <TableRowWithCell label={t('host')} value={entity.host} />
34                    <TableRowWithCell label={t('path')} value={entity.path} />
35                    <TableRowWithCell label={t('sni')} value={entity.sni} />
36                    <TableRowWithCell label={t('alpn')} value={entity.alpn} />
37                </TableBody>
38            </Table>
39        </SettingsDialog>
40    )
41}