import React from "react";

import { FormBuilder } from "@/components/FormBuilder";
import { FormCard, FormContent } from "@/components/FormCard";
import { Form } from "@/components/ui/form";
import { useGlobal } from "@/context/global";
import { ServerRequest } from "@/lib/actions";
import { getUploadFilesFormFields } from "@/models/files";
import { ProjectFilesTree } from "@/models/projectFilesTree";
import {
  getUploadFilesSchema,
  UploadFilesSchema,
} from "@/schemas/files/_uploadfiles";
import uploadSubdomainFiles from "@/services/files/uploadSubdomainFiles";
import { faCloudUpload } from "@fortawesome/free-solid-svg-icons";
import { zodResolver } from "@hookform/resolvers/zod";
import { useParams } from "next/navigation";
import { useTransition } from "react";
import { useForm } from "react-hook-form";
import { toast } from "sonner";

type SelectedProjectFilesUploadFormProps = {
  link?: string;
  treeState?: ProjectFilesTree[];
  sendSignal: React.Dispatch<React.SetStateAction<boolean>>;
};

export default function SelectedProjectFilesUploadForm({
  link,
  treeState,
  sendSignal,
}: SelectedProjectFilesUploadFormProps) {
  const { dict, closeModal } = useGlobal();

  const params = useParams();

  const [isPending, startTransition] = useTransition();

  const form = useForm<UploadFilesSchema>({
    resolver: zodResolver(getUploadFilesSchema(dict)),
    mode: "onChange",
    defaultValues: {
      path: link?.slice(1) ?? "",
      files: [],
    },
  });

  const handleSubmit = (values: UploadFilesSchema) => {
    startTransition(() => {
      const filesToOverwrite: string[] = [];

      treeState?.forEach((file) => {
        if (values.files.some((f) => f.name === file.name)) {
          filesToOverwrite.push(file.name);
        }
      });

      const pass =
        filesToOverwrite.length === 0
          ? true
          : confirm(
              `${
                dict.pages.project_files.forms.upload_files.overwrite
              }\n${filesToOverwrite.join("\n")}`,
            );

      if (!pass) {
        return;
      }

      const promise = new Promise(async (resolve, reject) => {
        const formData = new FormData();

        formData.append("name", params.name as string);
        formData.append("path", values.path ?? "");

        let index = 0;
        for (const file of values.files) {
          index++;
          formData.append(`file-${index}`, file, file.name);
        }
        formData.append("totalFiles", index.toString());

        const result = await ServerRequest(
          uploadSubdomainFiles(formData, false),
        );

        if (!result.operation) {
          return reject(result);
        }

        sendSignal((prev) => !prev);
        form.reset();

        return resolve(result);
      });

      toast.promise(promise, {
        loading: dict.alerts.upload_files.loading,
        success: ({ message }: any) => message,
        error: ({ message }: any) => message,
      });
    });
  };

  return (
    <FormCard>
      <FormContent
        title={dict.pages.project_files.forms.upload_files.title}
        subtitle={dict.pages.project_files.forms.upload_files.subtitle}
        icon={faCloudUpload}
      >
        <Form {...form}>
          <form onSubmit={form.handleSubmit(handleSubmit)}>
            <FormBuilder
              form={form}
              elements={getUploadFilesFormFields({
                closeModal,
                isPending,
                dict,
              })}
              upperLabel
            />
          </form>
        </Form>
      </FormContent>
    </FormCard>
  );
}