import { create } from 'zustand';
import { RegisterProps } from '../types/auth';
import { registerSchema } from '../validations/auth';
import { ValidationError } from 'yup';

type State = {
  form: RegisterProps;
  errors: {
    [key in keyof RegisterProps]?: string;
  };
  isCheckedTNC: boolean;
  isOpenTNC: boolean;
  isValidCaptcha: boolean;
};

type Action = {
  updateForm: (name: string, value: string) => void;
  updateValidCaptcha: (value: boolean) => void;
  toggleCheckTNC: () => void;
  openTNC: () => void;
  closeTNC: () => void;
  validate: () => void;
};

export const useRegisterStore = create<State & Action>((set, get) => ({
  form: {
    company: '',
    name: '',
    email: '',
    password: '',
    phone: '',
  },
  updateForm: (name, value) =>
    set((state) => ({ form: { ...state.form, [name]: value } })),

  errors: {},
  validate: () =>
    registerSchema
      .validate(get().form, { abortEarly: false })
      .then(() => set({ errors: {} }))
      .catch((err: ValidationError) => {
        const validationErrors: State['errors'] = {};
        err.inner.forEach(
          (e) => (validationErrors[e.path as keyof RegisterProps] = e.message)
        );
        set({ errors: validationErrors });
      }),

  isCheckedTNC: false,
  toggleCheckTNC: () => set((state) => ({ isCheckedTNC: !state.isCheckedTNC })),

  isOpenTNC: false,
  openTNC: () => set(() => ({ isOpenTNC: true })),
  closeTNC: () => set(() => ({ isOpenTNC: false })),

  isValidCaptcha: false,
  updateValidCaptcha: (value) => set(() => ({ isValidCaptcha: value })),
}));