gitscope
← marzneshin / v0.6.3 / dashboard/src/modules/hosts/dialogs/mutation/fields/security.tsx
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/modules/hosts/dialogs/mutation/fields/security.tsx · TypeScript
Blame Raw
 1import {
 2    FormControl,
 3    FormField,
 4    FormItem,
 5    FormLabel,
 6    FormMessage,
 7    Select,
 8    SelectContent,
 9    SelectItem,
10    SelectTrigger,
11    SelectValue,
12} from "@marzneshin/common/components";
13import { useEffect, useState } from "react";
14import { useFormContext } from "react-hook-form";
15import { useTranslation } from "react-i18next";
16import { AllowInsecureField, AlpnField, FingerprintField, SniField } from ".";
17
18export const SecurityFields = () => {
19    const { t } = useTranslation();
20    const form = useFormContext();
21    const security = form.watch().security;
22
23    const [extraSecurity, setExtraSecurity] = useState<boolean>(
24        ["tls", "inbound_default"].includes(security),
25    );
26    useEffect(() => {
27        setExtraSecurity(["tls", "inbound_default"].includes(security));
28    }, [security, setExtraSecurity]);
29
30    return (
31        <>
32            <FormField
33                control={form.control}
34                name="security"
35                render={({ field }) => (
36                    <FormItem>
37                        <FormLabel>{t("security")}</FormLabel>
38                        <Select onValueChange={field.onChange} defaultValue={field.value}>
39                            <FormControl>
40                                <SelectTrigger>
41                                    <SelectValue placeholder="Select a verified email to display" />
42                                </SelectTrigger>
43                            </FormControl>
44                            <SelectContent>
45                                <SelectItem value="none">None</SelectItem>
46                                <SelectItem value="tls">TLS</SelectItem>
47                                <SelectItem value="inbound_default">Inbound Default</SelectItem>
48                            </SelectContent>
49                        </Select>
50                        <FormMessage />
51                    </FormItem>
52                )}
53            />
54            {extraSecurity && (
55                <>
56                    <SniField />
57                    <div className="flex flex-row w-full gap-2">
58                        <AlpnField />
59                        <FingerprintField />
60                    </div>
61                    <AllowInsecureField />
62                </>
63            )}
64        </>
65    );
66};