'use client';

import { useCallback, useState } from 'react';
import { useRegisterZustand } from './registerZustand';
import { validateRegister, RegisterErrors } from './validateRegister';
import { useRegisterModal } from '@/shared/zustand/auth';
import { useMutation } from '@tanstack/react-query';
import { apiRequest } from '@/shared/request/apiRequest';
import { links } from '@/shared/request/links';
import { toast } from 'react-toastify';
import { useRouter } from '@/shared/config/i18n/navigation';
import { AuthData } from '../../login/lib/useLoginForm';
import { useUserPlagiatStore } from '@/shared/zustand/user';

interface RegisterData {
  first_name: string;
  last_name: string;
  phone: string;
  password: string;
}

export function useRegisterForm() {
  const { registerData, setItem, setOferta, clearRegisterData } =
    useRegisterZustand();
  const [errors, setErrors] = useState<RegisterErrors>({});
  const [success, setSuccess] = useState(false);
  const setUser = useUserPlagiatStore((state) => state.setUser);
  const route = useRouter();
  const toggleRegisterModal = useRegisterModal(
    (state) => state.toggleRegisterModal,
  );

  const registerRequest = useMutation({
    mutationKey: ['register'],
    mutationFn: (data: RegisterData) =>
      apiRequest('POST', links.register, data),
    onSuccess: (data) => {
      console.log('Register successful:', data);
      const resData = data?.data as AuthData;
      const user = data
        ? {
            id: resData?.user_id,
            name: resData?.first_name,
            surname: resData?.last_name,
          }
        : null;
      if (user) {
        localStorage.setItem('access_token', resData.access);
        localStorage.setItem('refresh_token', resData.refresh);
        localStorage.setItem('user', JSON.stringify(user));
      }
      setUser(user);
      toggleRegisterModal();
      setSuccess(true);
      toast.success("Ro'yxatdan o'tish muvaffaqiyatli!");
      route.push('/plagiat');
    },
    onError: (err) => {
      console.log('Register failed:', err);
    },
  });

  const handleChange = useCallback(
    (e: React.ChangeEvent<HTMLInputElement>) => {
      const { name, value } = e.target;
      setItem(name as keyof typeof registerData, value);
      // clear the error for this field on change
      setErrors((prev) => ({ ...prev, [name]: undefined }));
    },
    [setItem],
  );

  const handleOferta = useCallback(
    (e: React.ChangeEvent<HTMLInputElement>) => {
      setOferta(e.target.checked);
      setErrors((prev) => ({ ...prev, oferta: undefined }));
    },
    [setOferta],
  );

  const handleSubmit = useCallback(
    async (e: React.FormEvent) => {
      e.preventDefault();
      const validationErrors = validateRegister(registerData);
      console.log('register data on submit:', registerData);
      if (Object.keys(validationErrors).length > 0) {
        setErrors(validationErrors);
        return;
      }
      const sendedData = {
        phone: registerData.phone,
        first_name: registerData.name,
        last_name: registerData.surname,
        password: registerData.password,
      };
      registerRequest.mutate(sendedData);
    },
    [registerData, clearRegisterData],
  );

  return {
    registerData,
    errors,
    loading: registerRequest.isPending,
    success,
    handleChange,
    handleOferta,
    handleSubmit,
    setItem,
  };
}