import { useRef, useState } from "react";
import { useMutation, useQueryClient } from "@tanstack/react-query";
import { AxiosError } from "axios";
import {
  DialogMode,
  ExperienceFormValues,
  MappedExperience,
} from "../types/experience.types";
import { ExperienceType } from "@/type/profileType";
import {
  AddExperience,
  editExperience,
  deleteExperience,
} from "@/lib/services/profile.service";
import showCustomToast from "@/components/common/toaster/CustomToast";
import { mapFormToBody, mapItemToFormValues } from "../utils/experience.utils";

export function useExperienceSection() {
  const queryClient = useQueryClient();
  const [isDialogOpen, setIsDialogOpen] = useState(false);
  const [defaultValues, setDefaultValues] = useState<
    ExperienceFormValues[] | undefined
  >();
  const modeRef = useRef<DialogMode>("add");
  const editingIdRef = useRef<string | undefined>(undefined);

  const { mutate, isPending } = useMutation({
    mutationFn: (body: ExperienceType) =>
      modeRef.current === "edit" && editingIdRef.current
        ? editExperience(editingIdRef.current, body)
        : AddExperience(body),
    onMutate: async (newBody) => {
      await queryClient.cancelQueries({ queryKey: ["profile"] });
      const previousProfile = queryClient.getQueryData(["profile"]);

      queryClient.setQueryData(["profile"], (old: any) => {
        if (!old) return old;
        const experiences = [...(old.data.experiences || [])];

        if (modeRef.current === "edit" && editingIdRef.current) {
          const index = experiences.findIndex(
            (e: any) => e.uuid === editingIdRef.current,
          );
          if (index !== -1) {
            experiences[index] = { ...experiences[index], ...newBody };
          }
        } else {
          // Add optimistic item
          experiences.unshift({
            ...newBody,
            uuid: "temp-" + Date.now(),
          });
        }

        return {
          ...old,
          data: { ...old.data, experiences },
        };
      });

      return { previousProfile };
    },
    onSuccess: (data) => {
      showCustomToast({ type: "success", message: data.message });
      closeDialog();
    },
    onError: (error: AxiosError<{ message: string }>, _, context: any) => {
      queryClient.setQueryData(["profile"], context.previousProfile);
      showCustomToast({
        type: "error",
        message: error.response?.data.message ?? "Something went wrong",
      });
    },
    onSettled: () => {
      queryClient.invalidateQueries({ queryKey: ["profile"] });
    },
  });

  const { mutate: deleteMutate } = useMutation({
    mutationFn: deleteExperience,
    onMutate: async (uuid) => {
      await queryClient.cancelQueries({ queryKey: ["profile"] });
      const previousProfile = queryClient.getQueryData(["profile"]);
      queryClient.setQueryData(["profile"], (old: any) => {
        if (!old) return old;
        return {
          ...old,
          data: {
            ...old.data,
            experiences: (old.data.experiences || []).filter(
              (exp: any) => exp.uuid !== uuid,
            ),
          },
        };
      });
      return { previousProfile };
    },
    onSuccess: () => {
      showCustomToast({ type: "success", message: "Experience deleted" });
    },
    onError: (err, uuid, context: any) => {
      queryClient.setQueryData(["profile"], context.previousProfile);
      showCustomToast({
        type: "error",
        message: "Failed to delete experience",
      });
    },
    onSettled: () => {
      queryClient.invalidateQueries({ queryKey: ["profile"] });
    },
  });

  const openAddDialog = () => {
    modeRef.current = "add";
    editingIdRef.current = undefined;
    setDefaultValues(undefined);
    setIsDialogOpen(true);
  };

  const openEditDialog = (item: MappedExperience) => {
    modeRef.current = "edit";
    editingIdRef.current = item.id;
    console.log("------item------", item);

    setDefaultValues([mapItemToFormValues(item)]);
    setIsDialogOpen(true);
  };

  const closeDialog = () => {
    setIsDialogOpen(false);
    setDefaultValues(undefined);
  };

  const handleSubmit = (data: { experience: ExperienceFormValues[] }) => {
    console.log("-------sdfgsdfg----", data);

    const body = mapFormToBody(data.experience[0]);
    mutate(body);
  };

  return {
    isDialogOpen,
    defaultValues,
    isPending,
    isEditing: modeRef.current === "edit",
    openAddDialog,
    openEditDialog,
    closeDialog,
    handleSubmit,
    deleteExperience: deleteMutate,
  };
}