var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
import React, { useCallback, useRef, useState } from 'react';
import { ReactComponent as MagnifierIcon } from "../../assets/magnifier.svg";
import { debounceFn, isArrayCount } from "../../utils";
import { findUser } from './AddUsersIn';
import { httpModule } from "../../modules";
import { HTTP_SEARCH_USERS } from "../../constants";
const { URL, OPTIONS, PAGEABLE } = HTTP_SEARCH_USERS;
import { InputBlock, GlobalContentDiv, GlobalSearchDiv } from './styled';
const PersonSearch = ({ allUsersAdd, setSpinner, setUserList, role, hostUrl = '', }) => {
    const http = httpModule(hostUrl, OPTIONS);
    const [searchValue, setSearchValue] = useState('');
    const getData = (query, allUsersAddData) => __awaiter(void 0, void 0, void 0, function* () {
        try {
            setSpinner(true);
            const searchStr = encodeURIComponent(query);
            const data = (yield http.get(`${URL}PERSONS?page=${PAGEABLE.page}&size=${PAGEABLE.size}&query=${searchStr}`)) || {};
            const users = [];
            /*
                      usersChoose - юзеры, которые уже были добавлены
                      data?.persons - то что вернул сервис search
                   */
            if (isArrayCount(data === null || data === void 0 ? void 0 : data.persons)) {
                data.persons.forEach((person) => {
                    // Для списка userList проставляем уже добавленных ранне людей
                    // и по полю isFixed меняем input на серую картинку
                    allUsersAddData.forEach((user) => {
                        // формат мб разный у сохраненных раннее юзеров
                        const addedUser = (user === null || user === void 0 ? void 0 : user.person) ? user.person : user;
                        if (findUser(addedUser, person)) {
                            // указываем что мы его добавляли ранее
                            person.isChecked = true;
                            if ((user === null || user === void 0 ? void 0 : user.role) === role) {
                                // если мы зашли в группу в которой чел и находится
                                // прописываем ему тип и в DropContent проверяем на TYPE.FIXED
                                person.type = user === null || user === void 0 ? void 0 : user.type;
                            }
                            else {
                                // если мы нашли чела который уже добавлен в другую группу
                                person.isFixed = true;
                            }
                        }
                    });
                    users.push(person);
                });
            }
            if (isArrayCount(users)) {
                data.persons = users;
            }
            setSpinner(false);
            setUserList((data === null || data === void 0 ? void 0 : data.persons) || []);
        }
        catch (err) {
            console.error(err);
        }
    });
    const delayedGetData = useRef(debounceFn((query, allUsersAddData) => {
        if (query.length >= 3) {
            getData(query, allUsersAddData);
        }
    }, 500)).current;
    const onChangeValueSearch = useCallback((value) => {
        setSearchValue(value);
        delayedGetData(value, allUsersAdd);
    }, [delayedGetData, allUsersAdd]);
    const handleClickClean = () => {
        setSearchValue('');
        setUserList([]);
    };
    return (React.createElement(GlobalSearchDiv, null,
        React.createElement(GlobalContentDiv, null,
            React.createElement(MagnifierIcon, null),
            React.createElement(InputBlock, { name: "searchUsers", placeholder: "\u041D\u0430\u0447\u043D\u0438\u0442\u0435 \u0432\u0432\u043E\u0434\u0438\u0442\u044C \u0424\u0418\u041E \u0441\u043E\u0442\u0440\u0443\u0434\u043D\u0438\u043A\u0430", onChange: onChangeValueSearch, value: searchValue, autoFocus: true, clearValue: handleClickClean }))));
};
export default PersonSearch;
