import {type ChangeEvent, useMemo, useState} from "react";
import {useNavigate} from "react-router-dom";
import {toast} from "react-toastify";
import type {FormActionsModel, FormMode, HeaderModel, StatusModel} from "../../../../../type/viewModel.ts";
import {ADMIN_CONTENT_LIST_ROUTE} from "../../../../route/adminRouteMap.ts";
import type {ContentFormItem} from "../../type/content.types.ts";
import {useContentDetail} from "../query/useContentDetail.ts";
import {useCreateContent} from "../mutation/useCreateContent.ts";
import {useUpdateContent} from "../mutation/useUpdateContent.ts";
import {useDeleteContent} from "../mutation/useDeleteContent.ts";

type ContentFormPageModel = {
    header: HeaderModel;
    status: StatusModel;
    form: {
        form: ContentFormItem;
        onChange: (event: ChangeEvent<HTMLInputElement>) => void;
        onContentChange: (value: string) => void;
        disabled: boolean;
    };
    actions: FormActionsModel<FormMode>;
};

const initContentFormData: ContentFormItem = {
    cntId: '',
    cntDtId: '',
    cntName: '',
    cntCn: '',
    registerId: '',
    registPnttm: '',
    updusrId: '',
    updtPnttm: '',
};

const createInitialForm = (
    item?: ContentFormItem,
    cntId = '',
    cntDtId = '',
) => ({
    ...initContentFormData,
    cntId,
    cntDtId,
    ...item,
});

export const useContentFormPage = (cntId: string, cntDtId: string): ContentFormPageModel => {
    const navigate = useNavigate();
    const mode: FormMode = cntId ? 'update' : 'create';
    const [formDraft, setFormDraft] = useState<Partial<ContentFormItem>>({});

    const {data, isLoading, error} = useContentDetail(cntId, cntDtId, {enabled: !!cntId});
    console.log(data);
    const {mutateAsync: createContent, isPending: isCreating} = useCreateContent();
    const {mutateAsync: updateContent, isPending: isUpdating} = useUpdateContent();
    const {mutateAsync: deleteContent, isPending: isDeleting} = useDeleteContent();
    const isPending = isCreating || isUpdating || isDeleting;

    const title = `콘텐츠 ${mode === 'create' ? '등록' : '수정'}`;
    const breadcrumb = [
        {label: '콘텐츠 관리', url: ADMIN_CONTENT_LIST_ROUTE},
        {label: title},
    ];

    const baseForm = useMemo(
        () => createInitialForm(data, cntId, cntDtId),
        [cntDtId, cntId, data],
    );
    const form = {
        ...baseForm,
        ...formDraft,
    };

    const handleChange = (event: ChangeEvent<HTMLInputElement>) => {
        const {name, value} = event.target;

        setFormDraft((prev) => ({
            ...prev,
            [name]: value,
        }));
    };

    const handleContentChange = (value: string) => {
        setFormDraft((prev) => ({
            ...prev,
            cntCn: value,
        }));
    };

    const validateForm = () => {
        if (!form.cntName.trim()) {
            toast.warning('콘텐츠 이름을 입력해주세요.');
            return false;
        }

        if (!form.cntCn.trim() || form.cntCn === '<p></p>') {
            toast.warning('내용을 입력해주세요.');
            return false;
        }

        return true;
    };

    const handleCreate = async () => {
        if (!validateForm()) {
            return;
        }

        await toast.promise(
            createContent(form),
            {
                pending: '등록 중...',
                success: '등록 완료',
                error: '등록 실패',
            },
        );

        handleList();
    };

    const handleUpdate = async () => {
        if (!validateForm()) {
            return;
        }

        await toast.promise(
            updateContent(form),
            {
                pending: '수정 중...',
                success: '수정 완료',
                error: '수정 실패',
            },
        );

        handleList();
    };

    const handleDelete = async () => {
        if (!cntId || !window.confirm('콘텐츠를 삭제하시겠습니까?')) {
            return;
        }

        await toast.promise(
            deleteContent(cntId),
            {
                pending: '삭제 중...',
                success: '삭제 완료',
                error: '삭제 실패',
            },
        );

        handleList();
    };

    const handleList = () => {
        navigate(ADMIN_CONTENT_LIST_ROUTE);
    };

    return {
        header: {
            title,
            breadcrumb,
            homeUrl: '#',
        },
        status: {
            isLoading,
            error,
            successMessage: '콘텐츠 조회가 완료되었습니다.',
        },
        form: {
            form,
            onChange: handleChange,
            onContentChange: handleContentChange,
            disabled: isPending,
        },
        actions: {
            mode,
            disabled: isPending,
            onCreate: handleCreate,
            onUpdate: handleUpdate,
            onDelete: handleDelete,
            onList: handleList,
        },
    };
};