import { useEffect, useState } from 'react';
import { useForm } from 'react-hook-form';
import { PHXCombobox, PHXFuncGetLoggedInfo, PHXModal, PHXSearchResultListV3 } from '../../../../..';
import React from 'react';
import { searchBookForModalBorrowQuery } from '../query';
export default function ModalAddBookBorrow({ onChange, setShow, show, warehouseId, }) {
    const [selectedValues, setSelectedValues] = useState([]);
    const [disableSelectBook, setDisableSelectBook] = useState(true);
    const userInfo = PHXFuncGetLoggedInfo();
    const { register, setValue, watch } = useForm();
    const keySearchBook = 'book_name';
    const [inputText, setInputText] = useState('');
    const [options, setOptions] = useState([]);
    const handleSubmit = () => {
        onChange(selectedValues);
        onHide();
    };
    function onHide() {
        setShow(false);
        setDisableSelectBook(true);
        setOptions([]);
        setInputText('');
        setSelectedValues([]);
    }
    const handleClickSearchItem = (searchItem) => {
        var _a, _b;
        setInputText((_a = searchItem === null || searchItem === void 0 ? void 0 : searchItem.library_book) === null || _a === void 0 ? void 0 : _a.title);
        if (disableSelectBook) {
            setDisableSelectBook(false);
        }
        const { library_book, library_book_images, library_dang_ki_ca_biets } = searchItem;
        const image = (_b = library_book_images === null || library_book_images === void 0 ? void 0 : library_book_images[0]) === null || _b === void 0 ? void 0 : _b.url;
        const title = library_book === null || library_book === void 0 ? void 0 : library_book.title;
        const newOptions = (library_dang_ki_ca_biets || []).map((book) => ({
            id: book.id,
            title,
            image,
            code: book.code,
            stateId: book.state_id,
        }));
        setOptions(newOptions);
        setSelectedValues([]);
    };
    useEffect(() => {
        if (!watch(keySearchBook)) {
            setSelectedValues([]);
        }
    }, [watch(keySearchBook)]);
    return (React.createElement(PHXModal, { disableSubmit: selectedValues.length === 0, inCard: false, onHide: onHide, onSubmit: handleSubmit, primaryActionText: 'Th\u00EAm m\u1EDBi', show: show, title: 'Th\u00EAm s\u00E1ch m\u01B0\u1EE3n' },
        React.createElement("div", { className: 'space-y-5' },
            React.createElement(PHXSearchResultListV3, { defaultInputText: inputText, filterArray: [{ keyParent: 'library_book', keyChild: 'title' }], getSearchResult: handleClickSearchItem, handleCustomRender: (item) => { var _a; return (_a = item === null || item === void 0 ? void 0 : item.library_book) === null || _a === void 0 ? void 0 : _a.title; }, isFillInput: true, isUnaccentSearchValue: true, label: 'T\u00EAn s\u00E1ch', name: keySearchBook, placeholder: 'Nh\u1EADp t\u00EAn s\u00E1ch', register: register(keySearchBook), search: searchBookForModalBorrowQuery(userInfo === null || userInfo === void 0 ? void 0 : userInfo.school_id, warehouseId), setValue: setValue }),
            React.createElement(PHXCombobox, { defaultValue: selectedValues.map((item) => ({
                    id: item.id,
                    name: item.code,
                    ...item,
                })), disabled: !watch(keySearchBook) || disableSelectBook, id: 'book_code', label: 'M\u00E3 s\u00E1ch', listOptions: options.map((item) => ({
                    id: item.id,
                    name: item.code,
                    ...item,
                })), onChange: (values) => {
                    setSelectedValues(values);
                }, optionHeight: 200, placeholder: 'Ch\u1ECDn m\u00E3 s\u00E1ch' }))));
}
//# sourceMappingURL=modal-add-book.js.map