1import {
 2	FormControl,
 3	FormField,
 4	FormItem,
 5	FormLabel,
 6	FormDescription,
 7	Checkbox,
 8} from "@marzneshin/components";
 9import { useFormContext } from "react-hook-form";
10import { useTranslation } from "react-i18next";
11
12export const MuxField = () => {
13	const { t } = useTranslation();
14	const form = useFormContext();
15	return (
16		<FormField
17			control={form.control}
18			name="mux"
19			render={({ field }) => (
20				<>
21					<FormLabel>{t("mux")}</FormLabel>
22
23					<FormItem className="flex flex-row items-start space-x-3 space-y-0 rounded-md border p-4 shadow">
24						<FormControl>
25							<Checkbox
26								checked={field.value}
27								onCheckedChange={field.onChange}
28							/>
29						</FormControl>
30						<div className="space-y-1 leading-none">
31							<FormLabel>{t("page.hosts.mux.title")}</FormLabel>
32							<FormDescription>{t("page.hosts.mux.desc")}</FormDescription>
33						</div>
34					</FormItem>
35				</>
36			)}
37		/>
38	);
39};