1import { type FC, useState, useMemo } from "react";
  2import {
  3    DialogTitle,
  4    DialogContent,
  5    Dialog,
  6    DialogHeader,
  7    Form,
  8    Button,
  9    ScrollArea,
 10    VStack,
 11} from "@marzneshin/common/components";
 12import { useTranslation } from "react-i18next";
 13import {
 14    useAdminsCreationMutation,
 15    useAdminsUpdateMutation,
 16    AdminEditSchema,
 17    AdminCreateSchema,
 18    AdminType,
 19} from "@marzneshin/modules/admins";
 20import { ServicesField } from "@marzneshin/modules/services";
 21import { UsernameField } from "@marzneshin/modules/users";
 22import {
 23    PasswordField,
 24    EnabledField,
 25    ModifyUsersAccessField,
 26    SubscriptionUrlPrefixField,
 27    SudoPrivilageField,
 28    AllServicesAccessField,
 29} from "./fields";
 30import { useMutationDialog, MutationDialogProps } from "@marzneshin/common/hooks";
 31
 32export const AdminsMutationDialog: FC<MutationDialogProps<AdminType>> = ({
 33    onClose,
 34    entity = null,
 35}) => {
 36    const { t } = useTranslation();
 37
 38    const defaultValue = useMemo(() => ({
 39        service_ids: [],
 40        username: "",
 41        is_sudo: false,
 42        enabled: true,
 43        modify_users_access: true,
 44    }), [])
 45
 46    const { onOpenChange, open, form, handleSubmit } = useMutationDialog({
 47        entity,
 48        onClose,
 49        createMutation: useAdminsCreationMutation(),
 50        updateMutation: useAdminsUpdateMutation(),
 51        schema: entity ? AdminEditSchema : AdminCreateSchema,
 52        defaultValue,
 53    });
 54
 55    const [change, setChange] = useState<boolean>(entity === null);
 56    if (entity !== null)
 57        form.setValue("password", null,
 58            {
 59                shouldTouch: true,
 60                shouldDirty: true,
 61            });
 62
 63    return (
 64        <Dialog open={open} onOpenChange={onOpenChange} defaultOpen={true}>
 65            <DialogContent className="min-w-full h-full md:h-auto md:min-w-[42rem]">
 66                <ScrollArea className="flex flex-col justify-between h-full ">
 67                    <DialogHeader className="mb-3">
 68                        <DialogTitle className="text-primary">
 69                            {t(entity ? "page.admins.dialogs.edition.title" : "page.admins.dialogs.creation.title")}
 70                        </DialogTitle>
 71                    </DialogHeader>
 72                    <Form {...form}>
 73                        <form onSubmit={handleSubmit} >
 74                            <div className="flex-col grid-cols-2 gap-2 sm:flex md:grid h-full">
 75                                <div className="space-y-3">
 76                                    <UsernameField disabled={!!entity} />
 77                                    <PasswordField change={change} handleChange={setChange} />
 78                                    <SubscriptionUrlPrefixField />
 79                                    <EnabledField />
 80                                    <ModifyUsersAccessField />
 81                                    <SudoPrivilageField />
 82                                    <AllServicesAccessField />
 83                                </div>
 84                                <VStack>
 85                                    <ServicesField />
 86                                </VStack>
 87                            </div>
 88                            <Button
 89                                className="mt-3 w-full font-semibold"
 90                                type="submit"
 91                                disabled={form.formState.isSubmitting}
 92                            >
 93                                {t("submit")}
 94                            </Button>
 95                        </form>
 96                    </Form>
 97                </ScrollArea>
 98            </DialogContent>
 99        </Dialog>
100    );
101};