"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.TypeTable = void 0;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var v_eris_1 = require("v-eris");
var types_table_params_1 = require("./types.table.params");
var use_storage_1 = require("../utility/use.storage");
var types_appendix_1 = require("./types.appendix");
var types_pagination_1 = require("./types.pagination");
var build_1 = require("../components/Build/build");
var types_remove_1 = require("./types.remove");
var TypeTable = function (props) {
    var params = props.params, icon = props.icon, value = props.value, lang = props.lang, inactive = props.inactive, dynamic = props.dynamic, qs = props.qs, route = props.route, nested = props.nested, filter = props.filter, onChange = props.onChange, rest = tslib_1.__rest(props, ["params", "icon", "value", "lang", "inactive", "dynamic", "qs", "route", "nested", "filter", "onChange"]);
    var _a = (0, react_1.useState)(null), selectedLine = _a[0], setSelectedLine = _a[1];
    var _b = (0, react_1.useState)(null), selectedToken = _b[0], setSelectedToken = _b[1];
    var _c = (0, react_1.useState)(0), offset = _c[0], setOffset = _c[1];
    var _d = (0, react_1.useState)(20), limit = _d[0], setLimit = _d[1];
    var routeStorage = (0, react_1.useContext)(use_storage_1.StorageContext);
    var build = (0, react_1.useContext)(build_1.BuildContext);
    var whereAny = props.group ? { token: props.value } : {};
    var where = (0, react_1.useMemo)(function () {
        return (0, types_appendix_1.ParseWhere)(filter, routeStorage);
        ;
    }, [route, filter, routeStorage.it]);
    (0, v_eris_1.useDelta)(function () {
        setOffset(0);
        setSelectedLine(null);
        setSelectedToken(null);
    }, [where], where);
    (0, react_1.useEffect)(function () {
        setOffset(0);
        setSelectedLine(null);
        setSelectedToken(null);
    }, [route]);
    (0, react_1.useEffect)(function () {
        setSelectedLine(null);
        setSelectedToken(null);
    }, [offset, limit]);
    var storage = (0, use_storage_1.useStorage)({
        token: selectedToken,
        where: where,
        whereAny: whereAny,
        section: route,
        offset: offset,
        limit: limit,
        pagination: true,
        current: selectedToken ? true : false,
    });
    var inList = selectedToken && storage.list.findIndex(function (f) { return f.token == selectedToken; }) > -1;
    var paramsOverride = {
        redirectConfiguration: {
            onChange: function (e, params) {
                e.stopPropagation();
                build.setQueryString("/settings" + build.buildQuery({ token: route + ":" + params.token }));
            }
        }
    };
    return (react_1.default.createElement("div", { className: v_eris_1.Props.className("settings-type-table", { mini: nested }) },
        react_1.default.createElement("table", null,
            react_1.default.createElement("thead", null,
                react_1.default.createElement("tr", { className: "settings-type-table-header" },
                    react_1.default.createElement("th", null,
                        react_1.default.createElement(v_eris_1.Button, { className: inactive || dynamic === false ? "hidden" : "", onClick: function () {
                                setOffset(0);
                                storage.add({ name: "", description: "" }, function (data) {
                                    setSelectedToken(data.token);
                                });
                            } }, "+")),
                    params.map(function (cell) {
                        if (!cell.mini || cell.mini > 1)
                            return null;
                        return react_1.default.createElement("th", { key: cell.key }, lang.get(cell.title) || cell.title);
                    }))),
            react_1.default.createElement("tbody", { className: "settings-type-table-content" }, storage.list.map(function (line) {
                var isSelected = selectedLine == line.token;
                var isSelectedToken = selectedToken == line.token;
                return (react_1.default.createElement("tr", { key: line.key, className: v_eris_1.Props.className("settings-type-table-row", { selected: isSelected, hovered: isSelectedToken }), onClick: function (e) {
                        if (inactive)
                            return;
                        if (v_eris_1.Common.insideClass(e.target, "button"))
                            return;
                        //setSelectedLine( line.token );
                        setSelectedToken(line.token);
                    } },
                    react_1.default.createElement("td", { className: "settings-type-table-cell", key: "index" }, line.index),
                    (params.map(function (cell) {
                        if (isSelected)
                            return null;
                        if (!cell.mini || cell.mini > 1)
                            return null;
                        return react_1.default.createElement("td", { className: "settings-type-table-cell", key: cell.key }, react_1.default.cloneElement(build.types[cell.type], {
                            value: cell.controlled ? (Array.isArray(value) ? !!value.find(function (f) { return f == line.token; }) : false) : (line[cell.key] === undefined ? cell.value : line[cell.key]),
                            k: cell.key,
                            params: cell.params,
                            lang: lang,
                            stack: cell.stack,
                            permissions: null,
                            qs: qs,
                            route: route,
                            inactive: true,
                            token: line.token,
                            paramsOverride: paramsOverride[cell.key],
                            onChange: function (e) {
                                if (!onChange)
                                    return;
                                var list = value ? tslib_1.__spreadArray([], value, true) : [];
                                list = list.filter(function (f) { return f != line.token; });
                                if (e.value)
                                    list.push(line.token);
                                onChange({ value: list });
                            }
                        }));
                    })),
                    react_1.default.createElement("td", { className: "settings-type-table-cell" + (inactive ? " hidden" : ""), key: "remove" },
                        react_1.default.createElement(types_remove_1.TypeRemove, { onClick: function () { return storage.remove({ token: line.token }); } }))));
            }))),
        react_1.default.createElement(types_pagination_1.Pagination, { offset: offset, limit: limit, length: storage.length, autoHide: inactive, onChange: function (e) {
                setOffset(e.offset);
            } }),
        react_1.default.createElement(v_eris_1.Modal, { className: "settings-type-params-modal", bg: true, active: selectedToken && inList, onClose: function () {
                setSelectedToken(null);
                //nav( Common.setQuery( location, { section: qs.section, token: undefined } ) );
            } }, selectedToken ? (react_1.default.createElement(types_table_params_1.TypeTableParams, { title: storage.getValue("name") || storage.getValue("token"), storage: storage, icon: icon, lang: lang, params: params, system: storage.getValue("system"), qs: qs, route: route, nested: true, token: selectedToken, paramsOverride: paramsOverride, onCancel: function () {
                setSelectedToken(null);
            }, onChange: function (e) {
                //setSelectedData( e.value );
            }, onSave: function (e) {
                storage.save({
                    success: e && e.success ? e.success : undefined,
                    failure: e && e.failure ? e.failure : undefined,
                });
            }, onRemove: function (e) {
                storage.remove({ token: selectedToken }, function () {
                    setSelectedToken(null);
                    //nav( Common.setQuery( location, { section: qs.section, token: undefined } ) );
                });
            } }))
            :
                null)));
};
exports.TypeTable = TypeTable;
//# sourceMappingURL=types.table.js.map