"use client";
import {withFormik} from "formik";
import InnerUpdateDefaultForm from "./InnerUpdateDefaultForm";
import {AppRouterInstance} from "next/dist/shared/lib/app-router-context.shared-runtime";
import {UseMutateAsyncFunction} from "@tanstack/react-query";
import {toast} from "react-toastify";
import {Language, ServerResponse} from "@/types";
import {handleAxiosError} from "@/lib/utils";
import * as Yup from "yup";

export const translationSchema = Yup.object({
  address: Yup.string().required("آدرس الزامیست"),

  underLogoText: Yup.string()
    // .max(255, "متن زیر لوگو نباید بیشتر از 255 کاراکتر باشد")
    .required("متن زیر لوگو الزامیست"),
});

export const updateDefaultsValidationSchema = Yup.object({
  email: Yup.string()
    .email("فرمت ایمیل صحیح نیست")
    .required("ایمیل الزامی است"),

  hospitalPhone: Yup.string()
    .required("شماره تلفن الزامی است")
    .matches(
      /^[0-9+\-() ]+$/,
      "شماره تلفن فقط می‌تواند شامل عدد و + - ( ) باشد"
    )
    .min(8, "شماره تلفن کوتاه است"),

  mapAddress: Yup.string()
    .required("آدرس الزامی است")
    .min(5, "آدرس خیلی کوتاه است"),

  instagramLink: Yup.string()
    .nullable()
    .notRequired()
    .url("لینک اینستاگرام معتبر نیست"),

  linkedinLink: Yup.string()
    .nullable()
    .notRequired()
    .url("لینک لینکدین معتبر نیست"),

  logoUrl: Yup.string().nullable().notRequired().url("لینک لوگو معتبر نیست"),
  translations: Yup.array()
    .of(translationSchema)
    .min(1, "حداقل یک ترجمه الزامی است")
    .required("وارد کردن ترجمه ها الزامیست"),
});

/* ---------- TYPES ---------- */

export interface DefaultTranslationInput {
  languageId: number;
  address: string;
  underLogoText: string;
  aboutUsText:string;
  patientsRights:string;
}

export interface SiteDefaultDataType {
  id: string;

  email: string;
  hospitalPhone: string;
  mapAddress: string;

  instagramLink?: string | null;
  linkedinLink?: string | null;
  logoUrl?: string | null;

  translations: DefaultTranslationInput[];

  updatedAt: string;
  createdAt?: string;
}

export interface UpdateDefaultFormValues {
  email: string;
  instagramLink: string;
  linkedinLink: string;
  hospitalPhone: string;
  mapAddress: string;
  logo?: string | null;
  translations: DefaultTranslationInput[];
}

export type UpdateDefaultsVariables = {
  data: UpdateDefaultFormValues;
  id: string;
};

export interface UpdateDefaultFormProps {
  router: AppRouterInstance;
  languages: Language[];

  updateFn: UseMutateAsyncFunction<
    ServerResponse,
    Error,
    {data: UpdateDefaultFormValues},
    ServerResponse
  >;
  updatePending: boolean;
  preValues: SiteDefaultDataType;
  preValuesLoading: boolean;
}

/* ---------- FORM ---------- */

const UpdateDefaultForm = withFormik<
  UpdateDefaultFormProps,
  UpdateDefaultFormValues
>({
  enableReinitialize: true,
  mapPropsToValues: (props) => ({
    email: props?.preValues?.email || "",
    instagramLink: props?.preValues?.instagramLink || "",
    linkedinLink: props?.preValues?.linkedinLink || "",
    hospitalPhone: props?.preValues?.hospitalPhone || "",
    mapAddress: props?.preValues?.mapAddress || "",
    logo: props?.preValues?.logoUrl || "",
    translations:
      props.preValues?.translations?.length > 0
        ? props?.preValues?.translations
        : props?.languages.map((lang) => ({
            languageId: lang.id,
            address: "",
            underLogoText: "",
            aboutUsText: "",
            patientsRights: "",
            // position: "",
          })), // چندزبانه
  }),
  // validationSchema:updateDefaultsValidationSchema,
  handleSubmit: async (values, {props}) => {
    try {
      
      await props.updateFn({
        data: values,
      });
      
      toast.success("done");
    } catch (error) {
      const message = handleAxiosError(error);
      toast.error(message);
    }
  },
})(InnerUpdateDefaultForm);

export default UpdateDefaultForm;
