@solidxai/core-ui 0.0.1

package/dist/components/core/kanban/SolidKanbanView.js

@@ -0,0 +1,743 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { permissionExpression } from "../../../helpers/permissions";
+import { createSolidEntityApi } from "../../../redux/api/solidEntityApi";
+import { useGetSolidViewLayoutQuery } from "../../../redux/api/solidViewApi";
+import { useLazyCheckIfPermissionExistsQuery } from "../../../redux/api/userApi";
+import { FilterMatchMode } from "primereact/api";
+import { Button } from "primereact/button";
+import { Dialog } from "primereact/dialog";
+import qs from "qs";
+import { useEffect, useRef, useState } from "react";
+import { SolidCreateButton } from "../common/SolidCreateButton";
+import { SolidGlobalSearchElement } from "../common/SolidGlobalSearchElement";
+import KanbanBoard from "./KanbanBoard";
+import CompactImage from '../../../resources/images/layout/images/compact.png';
+import CozyImage from '../../../resources/images/layout/images/cozy.png';
+import ComfortableImage from '../../../resources/images/layout/images/comfortable.png';
+import { capitalize } from "lodash";
+import Lightbox from "yet-another-react-lightbox";
+import Counter from "yet-another-react-lightbox/plugins/counter";
+import Download from "yet-another-react-lightbox/plugins/download";
+import "yet-another-react-lightbox/styles.css";
+import "yet-another-react-lightbox/plugins/counter.css";
+import { useRouter } from "../../../hooks/useRouter";
+import { SolidKanbanViewConfigure } from "./SolidKanbanViewConfigure";
+import { KanbanUserViewLayout } from "./KanbanUserViewLayout";
+import { useDispatch, useSelector } from "react-redux";
+import { queryObjectToQueryString, queryStringToQueryObject } from "../list/SolidListView";
+import { Toast } from "primereact/toast";
+import { ERROR_MESSAGES } from "../../../constants/error-messages";
+import { showNavbar, toggleNavbar } from "../../../redux/features/navbarSlice";
+import { normalizeSolidListKanbanActionPath } from "../../../helpers/routePaths";
+import showToast from "../../../helpers/showToast";
+export var SolidKanbanView = function (params) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+    var visibleNavbar = useSelector(function (state) { var _a; return (_a = state.navbarState) === null || _a === void 0 ? void 0 : _a.visibleNavbar; });
+    var dispatch = useDispatch();
+    var solidGlobalSearchElementRef = useRef();
+    var router = useRouter();
+    // TODO: The initial filter state will be created based on the fields which are present on this kanban view. 
+    var _t = useState(), filters = _t[0], setFilters = _t[1];
+    var _u = useState([]), toPopulate = _u[0], setToPopulate = _u[1];
+    var _v = useState([]), toPopulateMedia = _v[0], setToPopulateMedia = _v[1];
+    var _w = useState([]), actionsAllowed = _w[0], setActionsAllowed = _w[1];
+    var _x = useState(false), showGlobalSearchElement = _x[0], setShowGlobalSearchElement = _x[1];
+    var _y = useState(false), showArchived = _y[0], setShowArchived = _y[1];
+    var sizeOptions = [
+        { label: 'Compact', value: 'small', image: CompactImage },
+        { label: 'Cozy', value: 'normal', image: CozyImage },
+        { label: 'Comfortable', value: 'large', image: ComfortableImage }
+    ];
+    var _z = useState(sizeOptions[1].value), size = _z[0], setSize = _z[1];
+    var _0 = useState([]), viewModes = _0[0], setViewModes = _0[1];
+    var _1 = useState(""), groupByFieldName = _1[0], setGroupByFieldName = _1[1];
+    var _2 = useState(true), groupedView = _2[0], setGroupedView = _2[1];
+    var triggerCheckIfPermissionExists = useLazyCheckIfPermissionExistsQuery()[0];
+    var _3 = useState(false), openLightbox = _3[0], setOpenLightbox = _3[1];
+    var _4 = useState({}), lightboxUrls = _4[0], setLightboxUrls = _4[1];
+    var _5 = useState(), filterQueryString = _5[0], setFilterQueryString = _5[1];
+    var _6 = useState(false), isLayoutDialogVisible = _6[0], setLayoutDialogVisible = _6[1];
+    var toast = useRef(null);
+    var pushFiltersToRouter = function (filterQueryString) {
+        // @ts-ignore
+        router.push("?".concat(filterQueryString), undefined, { shallow: true });
+    };
+    useEffect(function () {
+        if (filterQueryString) {
+            pushFiltersToRouter(filterQueryString);
+        }
+    }, [filterQueryString]);
+    useEffect(function () {
+        var fetchPermissions = function () { return __awaiter(void 0, void 0, void 0, function () {
+            var permissionNames, queryData, queryString, response;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        if (!params.modelName) return [3 /*break*/, 2];
+                        permissionNames = [
+                            permissionExpression(params.modelName, 'create'),
+                            permissionExpression(params.modelName, 'delete'),
+                            permissionExpression(params.modelName, 'update')
+                        ];
+                        queryData = {
+                            permissionNames: permissionNames
+                        };
+                        queryString = qs.stringify(queryData, {
+                            encodeValuesOnly: true
+                        });
+                        return [4 /*yield*/, triggerCheckIfPermissionExists(queryString)];
+                    case 1:
+                        response = _a.sent();
+                        setActionsAllowed(response.data.data);
+                        _a.label = 2;
+                    case 2: return [2 /*return*/];
+                }
+            });
+        }); };
+        fetchPermissions();
+    }, [params.modelName]);
+    // Create the RTK slices for this entity
+    var entityApi = createSolidEntityApi(params.modelName);
+    var useDeleteMultipleSolidEntitiesMutation = entityApi.useDeleteMultipleSolidEntitiesMutation, useLazyGetSolidEntitiesQuery = entityApi.useLazyGetSolidEntitiesQuery, usePatchUpdateSolidEntityMutation = entityApi.usePatchUpdateSolidEntityMutation;
+    // Get the kanban view layout & metadata first. 
+    var kanbanViewMetaDataQs = qs.stringify(__assign(__assign({}, params), { viewType: 'kanban' }), {
+        encodeValuesOnly: true,
+    });
+    var _7 = useState({}), kanbanViewMetaData = _7[0], setKanbanViewMetaData = _7[1];
+    var solidKanbanViewMetaData = useGetSolidViewLayoutQuery(kanbanViewMetaDataQs).data;
+    var initialFilterMethod = function () {
+        var _a, _b, _c, _d, _e, _f, _g, _h;
+        var solidView = solidKanbanViewMetaData.data.solidView;
+        var solidFieldsMetadata = solidKanbanViewMetaData.data.solidFieldsMetadata;
+        var initialFilters = {};
+        var toPopulate = [];
+        var toPopulateMedia = [];
+        function extractFields(node, result) {
+            if (result === void 0) { result = []; }
+            if (node.type === "field") {
+                result.push(node);
+            }
+            if (node.children) {
+                node.children.forEach(function (child) { return extractFields(child, result); });
+            }
+            return result;
+        }
+        var layoutFields = extractFields(solidView.layout);
+        for (var i = 0; i < layoutFields.length; i++) {
+            var column = layoutFields[i];
+            var fieldMetadata = solidFieldsMetadata[column.attrs.name];
+            if (fieldMetadata) {
+                // Form the initial filters after iterating over the columns and field metadata. 
+                if (['int', 'bigint', 'float', 'decimal'].includes(fieldMetadata.type)) {
+                    // initialFilters[column.attrs.name] = { operator: FilterOperator.OR, constraints: [{ value: null, matchMode: FilterMatchMode.EQUALS }] }
+                    initialFilters[column.attrs.name] = { value: null, matchMode: FilterMatchMode.EQUALS };
+                }
+                else if (['date', 'datetime', 'time', 'boolean'].includes(fieldMetadata.type)) {
+                    // initialFilters[column.attrs.name] = { operator: FilterOperator.OR, constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }] }
+                    initialFilters[column.attrs.name] = { value: null, matchMode: FilterMatchMode.EQUALS };
+                }
+                else if (['relation', 'selectionStatic', 'selectionDynamic'].includes(fieldMetadata.type)) {
+                    initialFilters[column.attrs.name] = { value: null, matchMode: FilterMatchMode.IN };
+                }
+                else {
+                    // initialFilters[column.attrs.name] = { operator: FilterOperator.OR, constraints: [{ value: null, matchMode: FilterMatchMode.STARTS_WITH }] }
+                    initialFilters[column.attrs.name] = { value: null, matchMode: FilterMatchMode.STARTS_WITH };
+                }
+                if (column.attrs.name === 'id') {
+                    initialFilters[column.attrs.name] = { value: null, matchMode: FilterMatchMode.IN };
+                }
+                // Form the "toPopulate" array. 
+                if (fieldMetadata.type === 'relation') {
+                    toPopulate.push(fieldMetadata.name);
+                }
+                if (fieldMetadata.type === 'mediaSingle' || fieldMetadata.type === 'mediaMultiple') {
+                    toPopulateMedia.push(fieldMetadata.name);
+                }
+            }
+        }
+        // setFilters(initialFilters);
+        var recordsInSwimlane = ((_d = (_c = (_b = (_a = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _a === void 0 ? void 0 : _a.solidView) === null || _b === void 0 ? void 0 : _b.layout) === null || _c === void 0 ? void 0 : _c.attrs) === null || _d === void 0 ? void 0 : _d.recordsInSwimlane) ? (_h = (_g = (_f = (_e = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _e === void 0 ? void 0 : _e.solidView) === null || _f === void 0 ? void 0 : _f.layout) === null || _g === void 0 ? void 0 : _g.attrs) === null || _h === void 0 ? void 0 : _h.recordsInSwimlane : 10;
+        // setToPopulate(toPopulate);
+        // setToPopulateMedia(toPopulateMedia);
+        // setRecordsInSwimlane(recordsInSwimlane);
+        // setToPopulate(toPopulate);
+        // setToPopulateMedia(toPopulateMedia);
+        return { recordsInSwimlane: recordsInSwimlane, toPopulate: toPopulate, toPopulateMedia: toPopulateMedia };
+    };
+    // Initial Filter data 
+    useEffect(function () {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
+        if (solidKanbanViewMetaData) {
+            setKanbanViewMetaData(solidKanbanViewMetaData);
+            var viewModes_1 = ((_d = (_c = (_b = (_a = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _a === void 0 ? void 0 : _a.solidView) === null || _b === void 0 ? void 0 : _b.layout) === null || _c === void 0 ? void 0 : _c.attrs) === null || _d === void 0 ? void 0 : _d.allowedViews) && ((_h = (_g = (_f = (_e = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _e === void 0 ? void 0 : _e.solidView) === null || _f === void 0 ? void 0 : _f.layout) === null || _g === void 0 ? void 0 : _g.attrs) === null || _h === void 0 ? void 0 : _h.allowedViews.length) > 0 && ((_m = (_l = (_k = (_j = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _j === void 0 ? void 0 : _j.solidView) === null || _k === void 0 ? void 0 : _k.layout) === null || _l === void 0 ? void 0 : _l.attrs) === null || _m === void 0 ? void 0 : _m.allowedViews.map(function (view) { return { label: capitalize(view), value: view }; }));
+            setViewModes(viewModes_1);
+            if (((_r = (_q = (_p = (_o = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _o === void 0 ? void 0 : _o.solidView) === null || _p === void 0 ? void 0 : _p.layout) === null || _q === void 0 ? void 0 : _q.attrs) === null || _r === void 0 ? void 0 : _r.grouped) !== false) {
+                setGroupByFieldName((_v = (_u = (_t = (_s = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _s === void 0 ? void 0 : _s.solidView) === null || _t === void 0 ? void 0 : _t.layout) === null || _u === void 0 ? void 0 : _u.attrs) === null || _v === void 0 ? void 0 : _v.groupBy);
+            }
+            else {
+                setGroupByFieldName("deletedTracker");
+                setGroupedView(false);
+            }
+        }
+    }, [solidKanbanViewMetaData]);
+    // All kanban view state.
+    var _8 = useState([]), kanbanViewData = _8[0], setKanbanViewData = _8[1];
+    var _9 = useState({}), kanbanLoadMoreData = _9[0], setKanbanLoadMoreData = _9[1];
+    var _10 = useState(10), recordsInSwimlane = _10[0], setRecordsInSwimlane = _10[1];
+    var _11 = useState([]), selectedRecords = _11[0], setSelectedRecords = _11[1];
+    var _12 = useState(true), loading = _12[0], setLoading = _12[1];
+    var _13 = useState(false), isDialogVisible = _13[0], setDialogVisible = _13[1];
+    var _14 = useState(), createButtonUrl = _14[0], setCreateButtonUrl = _14[1];
+    var _15 = useState(), editButtonUrl = _15[0], setEditButtonUrl = _15[1];
+    var _16 = useState({}), createActionQueryParams = _16[0], setCreateActionQueryParams = _16[1];
+    var _17 = useState({}), editActionQueryParams = _17[0], setEditActionQueryParams = _17[1];
+    var _18 = useState(5), columnsCount = _18[0], setColumnsCount = _18[1];
+    var _19 = useState(1), swimLaneCurrentPageNumber = _19[0], setSwimLaneCurrentPageNumber = _19[1];
+    var _20 = useState(false), queryDataLoaded = _20[0], setQueryDataLoaded = _20[1];
+    var _21 = useState(false), showSaveFilterPopup = _21[0], setShowSaveFilterPopup = _21[1];
+    var _22 = useState(0), maxSwimLanesCount = _22[0], setMaxSwimLanesCount = _22[1];
+    // @ts-ignore
+    var editBaseUrl = normalizeSolidListKanbanActionPath(pathname, editButtonUrl || "form");
+    // Get the kanban view data.
+    // const [triggerGetSolidEntitiesForKanban, { data: solidEntityKanbanViewData, isLoading, error }] = useLazyGetSolidKanbanEntitiesQuery();
+    var _23 = useLazyGetSolidEntitiesQuery(), triggerGetSolidEntities = _23[0], solidEntityKanbanViewData = _23[1].data;
+    // Delete mutation 
+    var _24 = useDeleteMultipleSolidEntitiesMutation(), deleteManySolidEntities = _24[0], isDeleteSolidEntitiesSucess = _24[1].isSuccess;
+    var patchKanbanView = usePatchUpdateSolidEntityMutation()[0];
+    // After data is fetched populate the kanban view state so as to be able to render the data. 
+    useEffect(function () {
+        var _a;
+        if (solidEntityKanbanViewData) {
+            // Merge groupRecords by groupName: update existing, add new
+            setMaxSwimLanesCount(((_a = solidEntityKanbanViewData === null || solidEntityKanbanViewData === void 0 ? void 0 : solidEntityKanbanViewData.meta) === null || _a === void 0 ? void 0 : _a.totalRecords) || 0);
+            var groupRecords = (solidEntityKanbanViewData === null || solidEntityKanbanViewData === void 0 ? void 0 : solidEntityKanbanViewData.groupRecords) || [];
+            var groupMap_1 = new Map((kanbanViewData || []).map(function (g) { return [g.groupName, g]; }));
+            groupRecords.forEach(function (newGroup) {
+                groupMap_1.set(newGroup.groupName, newGroup);
+            });
+            var latestKanbanGroupData = Array.from(groupMap_1.values());
+            setKanbanViewData(latestKanbanGroupData);
+            var loadmoredata = Object.entries(latestKanbanGroupData).reduce(function (acc, _a) {
+                var value = _a[1];
+                acc[value.groupName] = {
+                    offset: (value.groupData.meta.currentPage - 1) * value.groupData.meta.perPage,
+                    limit: value.groupData.meta.perPage,
+                    count: value.groupData.meta.totalRecords
+                };
+                return acc;
+            }, {});
+            setKanbanLoadMoreData(loadmoredata);
+            setLoading(false);
+        }
+    }, [solidEntityKanbanViewData]);
+    useEffect(function () {
+        var _a, _b, _c, _d, _e, _f, _g;
+        if (solidKanbanViewMetaData) {
+            var kanbanViewLayoutAttrs = (_c = (_b = (_a = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _a === void 0 ? void 0 : _a.solidView) === null || _b === void 0 ? void 0 : _b.layout) === null || _c === void 0 ? void 0 : _c.attrs;
+            var createActionUrl = (kanbanViewLayoutAttrs === null || kanbanViewLayoutAttrs === void 0 ? void 0 : kanbanViewLayoutAttrs.createAction) && ((_d = kanbanViewLayoutAttrs === null || kanbanViewLayoutAttrs === void 0 ? void 0 : kanbanViewLayoutAttrs.createAction) === null || _d === void 0 ? void 0 : _d.type) === "custom" ? (_e = kanbanViewLayoutAttrs === null || kanbanViewLayoutAttrs === void 0 ? void 0 : kanbanViewLayoutAttrs.createAction) === null || _e === void 0 ? void 0 : _e.customComponent : "form/new";
+            var editActionUrl = (kanbanViewLayoutAttrs === null || kanbanViewLayoutAttrs === void 0 ? void 0 : kanbanViewLayoutAttrs.editAction) && ((_f = kanbanViewLayoutAttrs === null || kanbanViewLayoutAttrs === void 0 ? void 0 : kanbanViewLayoutAttrs.editAction) === null || _f === void 0 ? void 0 : _f.type) === "custom" ? (_g = kanbanViewLayoutAttrs === null || kanbanViewLayoutAttrs === void 0 ? void 0 : kanbanViewLayoutAttrs.editAction) === null || _g === void 0 ? void 0 : _g.customComponent : "form";
+            if (kanbanViewLayoutAttrs === null || kanbanViewLayoutAttrs === void 0 ? void 0 : kanbanViewLayoutAttrs.createAction) {
+                setCreateActionQueryParams({
+                    actionName: kanbanViewLayoutAttrs.createAction.name,
+                    actionType: kanbanViewLayoutAttrs.createAction.type,
+                    actionContext: kanbanViewLayoutAttrs.createAction.context,
+                });
+            }
+            if (kanbanViewLayoutAttrs === null || kanbanViewLayoutAttrs === void 0 ? void 0 : kanbanViewLayoutAttrs.editAction) {
+                setEditActionQueryParams({
+                    actionName: kanbanViewLayoutAttrs.editAction.name,
+                    actionType: kanbanViewLayoutAttrs.editAction.type,
+                    actionContext: kanbanViewLayoutAttrs.editAction.context,
+                });
+            }
+            if (createActionUrl) {
+                setCreateButtonUrl(createActionUrl);
+            }
+            if (editActionUrl) {
+                setEditButtonUrl(editActionUrl);
+            }
+        }
+    }, [solidKanbanViewMetaData]);
+    // Fetch data after toPopulate has been populated...
+    useEffect(function () {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+        if (solidKanbanViewMetaData) {
+            var swimlanesCount = ((_c = (_b = (_a = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data.solidView) === null || _a === void 0 ? void 0 : _a.layout) === null || _b === void 0 ? void 0 : _b.attrs) === null || _c === void 0 ? void 0 : _c.swimlanesCount) || 5;
+            if (groupByFieldName) {
+                var queryObject = queryStringToQueryObject();
+                var queryString = "";
+                if (queryObject) {
+                    var filters_1 = {
+                        $and: []
+                    };
+                    if (queryObject.custom_filter_predicate) {
+                        // @ts-ignore
+                        filters_1.$and.push(queryObject.custom_filter_predicate);
+                    }
+                    if (queryObject.search_predicate) {
+                        // @ts-ignore
+                        filters_1.$and.push(queryObject.search_predicate);
+                    }
+                    // if (queryObject.saved_filter_predicate) {
+                    //   filters.$and.push(queryObject.saved_filter_predicate);
+                    // }
+                    // if (queryObject.predefined_search_predicate) {
+                    //   filters.$and.push(queryObject.predefined_search_predicate);
+                    // }
+                    var queryData = {
+                        offset: 0,
+                        limit: Number(queryObject.limit) + Number(queryObject.offset),
+                        // fields: queryObject.fields || [`${groupByFieldName}`, `count(${groupByFieldName})`],
+                        groupBy: queryObject.groupBy || groupByFieldName,
+                        // @ts-ignore
+                        populateMedia: queryObject.populateMedia || toPopulateMedia_1,
+                        populateGroup: queryObject.populateGroup || true,
+                        groupFilter: {
+                            limit: Number(queryObject.groupFilter.limit) + Number(queryObject.groupFilter.offset) || ((_g = (_f = (_e = (_d = kanbanViewMetaData === null || kanbanViewMetaData === void 0 ? void 0 : kanbanViewMetaData.data) === null || _d === void 0 ? void 0 : _d.solidView) === null || _e === void 0 ? void 0 : _e.layout) === null || _f === void 0 ? void 0 : _f.attrs) === null || _g === void 0 ? void 0 : _g.recordsInSwimlane),
+                            offset: 0,
+                            filters: filters_1,
+                            // @ts-ignore
+                            populate: queryObject.groupFilter.populate || toPopulate_1,
+                            // @ts-ignore
+                            populateMedia: queryObject.groupFilter.populateMedia || toPopulateMedia_1
+                        }
+                        // sort: [`id:desc`],
+                    };
+                    var _m = initialFilterMethod(), recordsInSwimlane_1 = _m.recordsInSwimlane, toPopulate_1 = _m.toPopulate, toPopulateMedia_1 = _m.toPopulateMedia;
+                    setToPopulate(toPopulate_1);
+                    setToPopulateMedia(toPopulateMedia_1);
+                    setRecordsInSwimlane(recordsInSwimlane_1);
+                    // setFilters(filters);
+                    setQueryDataLoaded(true);
+                    queryString = qs.stringify(queryData, {
+                        encodeValuesOnly: true
+                    });
+                }
+                else {
+                    var _o = initialFilterMethod(), recordsInSwimlane_2 = _o.recordsInSwimlane, toPopulate_2 = _o.toPopulate, toPopulateMedia_2 = _o.toPopulateMedia;
+                    var queryData = {
+                        offset: 0,
+                        limit: swimlanesCount,
+                        // fields: [`${groupByFieldName}`, `count(${groupByFieldName})`],
+                        groupBy: groupByFieldName,
+                        populateMedia: toPopulateMedia_2,
+                        populateGroup: true,
+                        groupFilter: {
+                            limit: ((_l = (_k = (_j = (_h = kanbanViewMetaData === null || kanbanViewMetaData === void 0 ? void 0 : kanbanViewMetaData.data) === null || _h === void 0 ? void 0 : _h.solidView) === null || _j === void 0 ? void 0 : _j.layout) === null || _k === void 0 ? void 0 : _k.attrs) === null || _l === void 0 ? void 0 : _l.recordsInSwimlane) || 10,
+                            offset: 0,
+                            filters: filters,
+                            populate: toPopulate_2,
+                            populateMedia: toPopulateMedia_2
+                        }
+                        // sort: [`id:desc`],
+                    };
+                    setRecordsInSwimlane(recordsInSwimlane_2);
+                    setToPopulate(toPopulate_2);
+                    setToPopulateMedia(toPopulateMedia_2);
+                    // fields=status&groupBy=status&fields=count(status)&populateGroup=true
+                    queryString = qs.stringify(queryData, {
+                        encodeValuesOnly: true
+                    });
+                    setQueryDataLoaded(true);
+                }
+                // triggerGetSolidEntities(queryString);
+                setSelectedRecords([]);
+            }
+        }
+    }, [isDeleteSolidEntitiesSucess, groupByFieldName, solidKanbanViewMetaData]);
+    // clickable link allowing one to open the detail / form view.
+    // handle bulk deletion
+    var deleteBulk = function () {
+        var deleteList = [];
+        selectedRecords.forEach(function (element) {
+            deleteList.push(element.id);
+        });
+        deleteManySolidEntities(deleteList);
+        setDialogVisible(false);
+    };
+    // handle closing of the delete dialog...
+    var onDeleteClose = function () {
+        setDialogVisible(false);
+        setSelectedRecords([]);
+    };
+    // Individual Swimlane Load More
+    var handleLoadMore = function (groupByField) { return __awaiter(void 0, void 0, void 0, function () {
+        var _a, offset, limit, queryData, queryString, data, newRecords, mergeData, updatedData, loadmoredata, error_1;
+        var _b;
+        return __generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    _a = kanbanLoadMoreData[groupByField], offset = _a.offset, limit = _a.limit;
+                    kanbanLoadMoreData[groupByField].offset = offset + limit;
+                    _c.label = 1;
+                case 1:
+                    _c.trys.push([1, 3, , 4]);
+                    queryData = {
+                        offset: offset + limit,
+                        limit: limit,
+                        populate: toPopulate,
+                        populateMedia: toPopulateMedia,
+                        populateGroup: true,
+                        filters: __assign((_b = {}, _b[groupByFieldName] = {
+                            $in: [groupByField],
+                        }, _b), filters)
+                    };
+                    queryString = qs.stringify(queryData, {
+                        encodeValuesOnly: true
+                    });
+                    return [4 /*yield*/, triggerGetSolidEntities(queryString)];
+                case 2:
+                    data = _c.sent();
+                    newRecords = data.data.records;
+                    mergeData = function (kanbanViewData, newRecords, groupByField) {
+                        // Find the group matching the specified groupByField
+                        var originalData = structuredClone(kanbanViewData);
+                        var targetGroup = originalData.find(function (group) { return group.groupName === groupByField; });
+                        if (targetGroup) {
+                            var groupData = targetGroup.groupData;
+                            if (targetGroup.groupData) {
+                                // Extract existing records
+                                var existingRecords = targetGroup.groupData.records;
+                                var updatedRecords = __spreadArray(__spreadArray([], existingRecords, true), newRecords, true);
+                                targetGroup.groupData.records = updatedRecords;
+                                // Update the meta data (you can adjust this logic as needed)
+                                groupData.meta.prevPage = groupData.meta.currentPage;
+                                groupData.meta.currentPage = groupData.meta.currentPage + 1;
+                                groupData.meta.nextPage = groupData.meta.currentPage + 1;
+                            }
+                        }
+                        return originalData;
+                    };
+                    updatedData = mergeData(kanbanViewData, newRecords, groupByField);
+                    setKanbanViewData(updatedData);
+                    loadmoredata = Object.entries(updatedData).reduce(function (acc, _a) {
+                        var value = _a[1];
+                        acc[value.groupName] = {
+                            offset: (value.groupData.meta.currentPage - 1) * value.groupData.meta.perPage,
+                            limit: value.groupData.meta.perPage,
+                            count: value.groupData.meta.totalRecords
+                        };
+                        return acc;
+                    }, {});
+                    setKanbanLoadMoreData(loadmoredata);
+                    return [3 /*break*/, 4];
+                case 3:
+                    error_1 = _c.sent();
+                    console.error(ERROR_MESSAGES.LOAD_MORE_DATA, error_1);
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); };
+    // Handle drag-and-drop functionality
+    // @ts-ignore
+    var onDragEnd = function (result) { return __awaiter(void 0, void 0, void 0, function () {
+        var source, destination, sourceGroupName, destinationGroupName, sourceGroupIndex, destinationGroupIndex, sourceGroup, destinationGroup, sourceRecords, destinationRecords, movedItem, updatedItem, oldkanbanViewData, formData, kanbanUpdateResponse, error_2;
+        var _a;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
+                case 0:
+                    source = result.source, destination = result.destination;
+                    if (!destination)
+                        return [2 /*return*/];
+                    sourceGroupName = source.droppableId;
+                    destinationGroupName = destination.droppableId;
+                    sourceGroupIndex = kanbanViewData.findIndex(function (group) { return group.groupName === sourceGroupName; });
+                    destinationGroupIndex = kanbanViewData.findIndex(function (group) { return group.groupName === destinationGroupName; });
+                    if (sourceGroupIndex === -1 || destinationGroupIndex === -1)
+                        return [2 /*return*/];
+                    // If dragging within the same group
+                    if (sourceGroupName === destinationGroupName) {
+                        setKanbanViewData(function (prevData) {
+                            return prevData.map(function (group) {
+                                if (group.groupName === sourceGroupName) {
+                                    var updatedRecords = __spreadArray([], group.groupData.records, true);
+                                    var movedItem_1 = updatedRecords.splice(source.index, 1)[0]; // Remove the item
+                                    updatedRecords.splice(destination.index, 0, movedItem_1); // Insert at the new position
+                                    return __assign(__assign({}, group), { groupData: __assign(__assign({}, group.groupData), { records: updatedRecords }) });
+                                }
+                                return group;
+                            });
+                        });
+                        return [2 /*return*/];
+                    }
+                    sourceGroup = JSON.parse(JSON.stringify(kanbanViewData[sourceGroupIndex]));
+                    destinationGroup = JSON.parse(JSON.stringify(kanbanViewData[destinationGroupIndex]));
+                    sourceRecords = __spreadArray([], sourceGroup.groupData.records, true);
+                    destinationRecords = __spreadArray([], destinationGroup.groupData.records, true);
+                    movedItem = sourceRecords.splice(source.index, 1)[0];
+                    updatedItem = __assign(__assign({}, movedItem), { status: destinationGroupName });
+                    // Add the updated item to the destination
+                    destinationRecords.splice(destination.index, 0, updatedItem);
+                    // Update the group data
+                    sourceGroup.groupData.records = sourceRecords;
+                    destinationGroup.groupData.records = destinationRecords;
+                    oldkanbanViewData = structuredClone(kanbanViewData);
+                    _b.label = 1;
+                case 1:
+                    _b.trys.push([1, 3, , 4]);
+                    formData = new FormData();
+                    formData.append(groupByFieldName, destinationGroupName);
+                    // Update the kanbanViewData state
+                    setKanbanViewData(function (prevData) {
+                        return prevData.map(function (group) {
+                            if (group.groupName === sourceGroupName) {
+                                return sourceGroup;
+                            }
+                            if (group.groupName === destinationGroupName) {
+                                return destinationGroup;
+                            }
+                            return group;
+                        });
+                    });
+                    return [4 /*yield*/, patchKanbanView({ id: +movedItem.id, data: formData }).unwrap()];
+                case 2:
+                    kanbanUpdateResponse = _b.sent();
+                    if ((kanbanUpdateResponse === null || kanbanUpdateResponse === void 0 ? void 0 : kanbanUpdateResponse.statusCode) === 200) {
+                        showToast(toast, "success", ERROR_MESSAGES.IS_SUCCESS, ERROR_MESSAGES.KANBAN_UPDATED);
+                    }
+                    else {
+                        showToast(toast, "error", ERROR_MESSAGES.DUPLICATE_KEY, kanbanUpdateResponse === null || kanbanUpdateResponse === void 0 ? void 0 : kanbanUpdateResponse.error);
+                        // Update the kanbanViewData state
+                        setKanbanViewData(oldkanbanViewData);
+                    }
+                    return [3 /*break*/, 4];
+                case 3:
+                    error_2 = _b.sent();
+                    // 6. Handle 500 or network errors
+                    console.error(ERROR_MESSAGES.API_ERROR, error_2);
+                    showToast(toast, "error", ERROR_MESSAGES.SOMETHING_WRONG, ((_a = error_2 === null || error_2 === void 0 ? void 0 : error_2.data) === null || _a === void 0 ? void 0 : _a.message) || ERROR_MESSAGES.SOMETHING_WRONG);
+                    setKanbanViewData(oldkanbanViewData);
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); };
+    // Handle SwimLane Pagination
+    var handleSwimLanePagination = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var swimlanesCount, queryData, queryString, data, updatedData;
+        var _a, _b, _c, _d;
+        return __generator(this, function (_e) {
+            switch (_e.label) {
+                case 0:
+                    if (!solidKanbanViewMetaData) return [3 /*break*/, 2];
+                    swimlanesCount = ((_c = (_b = (_a = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data.solidView) === null || _a === void 0 ? void 0 : _a.layout) === null || _b === void 0 ? void 0 : _b.attrs) === null || _c === void 0 ? void 0 : _c.swimlanesCount) || 5;
+                    queryData = {
+                        offset: swimLaneCurrentPageNumber * swimlanesCount,
+                        limit: swimlanesCount,
+                        // fields: [`${groupByFieldName}`, `count(${groupByFieldName})`],
+                        groupBy: groupByFieldName,
+                        populateMedia: toPopulateMedia,
+                        populate: toPopulate,
+                        populateGroup: true,
+                        groupFilter: {
+                            limit: recordsInSwimlane,
+                            offset: 0,
+                            filters: filters,
+                            populate: toPopulate,
+                            populateMedia: toPopulateMedia
+                        }
+                        // sort: [`id:desc`],
+                    };
+                    queryString = qs.stringify(queryData, {
+                        encodeValuesOnly: true
+                    });
+                    return [4 /*yield*/, triggerGetSolidEntities(queryString)];
+                case 1:
+                    data = _e.sent();
+                    if (data && ((_d = data === null || data === void 0 ? void 0 : data.data) === null || _d === void 0 ? void 0 : _d.groupRecords.length) > 0) {
+                        updatedData = __spreadArray(__spreadArray([], kanbanViewData, true), data.data.groupRecords, true);
+                        setKanbanViewData(updatedData);
+                    }
+                    setSwimLaneCurrentPageNumber(swimLaneCurrentPageNumber + 1);
+                    _e.label = 2;
+                case 2: return [2 /*return*/];
+            }
+        });
+    }); };
+    // Handle the custom filter and Search Filter
+    var handleApplyCustomFilter = function (transformedFilter) { return __awaiter(void 0, void 0, void 0, function () {
+        var queryfilter, customFilter, updatedFilter, swimlanesCount, queryData, queryString, urlData, data, updatedData;
+        var _a, _b, _c, _d;
+        return __generator(this, function (_e) {
+            switch (_e.label) {
+                case 0:
+                    if (!solidKanbanViewMetaData) return [3 /*break*/, 2];
+                    queryfilter = {
+                        $and: []
+                    };
+                    // if (transformedFilter.s_filter) {
+                    //   queryfilter.$and.push(transformedFilter.s_filter)
+                    // }
+                    // if (transformedFilter.c_filter) {
+                    //   queryfilter.$and.push(transformedFilter.c_filter)
+                    // }
+                    if (transformedFilter.custom_filter_predicate) {
+                        // @ts-ignore
+                        queryfilter.$and.push(transformedFilter.custom_filter_predicate);
+                    }
+                    if (transformedFilter.search_predicate) {
+                        // @ts-ignore
+                        queryfilter.$and.push(transformedFilter.search_predicate);
+                    }
+                    if (transformedFilter.saved_filter_predicate) {
+                        // @ts-ignore
+                        queryfilter.$and.push(transformedFilter.saved_filter_predicate);
+                    }
+                    if (transformedFilter.predefined_search_predicate) {
+                        // @ts-ignore
+                        queryfilter.$and.push(transformedFilter.predefined_search_predicate);
+                    }
+                    customFilter = transformedFilter;
+                    updatedFilter = __assign(__assign({}, (filters || {})), (queryfilter || {}));
+                    // Then update state
+                    setFilters(updatedFilter);
+                    swimlanesCount = ((_c = (_b = (_a = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data.solidView) === null || _a === void 0 ? void 0 : _a.layout) === null || _b === void 0 ? void 0 : _b.attrs) === null || _c === void 0 ? void 0 : _c.swimlanesCount) || 5;
+                    queryData = {
+                        offset: 0,
+                        limit: swimlanesCount,
+                        // fields: [`${groupByFieldName}`, `count(${groupByFieldName})`],
+                        groupBy: groupByFieldName,
+                        populateMedia: toPopulateMedia,
+                        populateGroup: true,
+                        groupFilter: {
+                            limit: recordsInSwimlane,
+                            offset: 0,
+                            filters: updatedFilter,
+                            populate: toPopulate,
+                            populateMedia: toPopulateMedia
+                        }
+                    };
+                    queryString = qs.stringify(queryData, {
+                        encodeValuesOnly: true
+                    });
+                    // s_filter and c_filter format that needs to be passed to the router
+                    // only present if handleCustomFilter is applied
+                    if (customFilter) {
+                        urlData = structuredClone(queryData);
+                        // @ts-ignore
+                        delete urlData.filters;
+                        // urlData.s_filter = customFilter.s_filter || {};
+                        // urlData.c_filter = customFilter.c_filter || {};
+                        // @ts-ignore
+                        urlData.custom_filter_predicate = customFilter.custom_filter_predicate || {};
+                        // @ts-ignore
+                        urlData.search_predicate = customFilter.search_predicate || {};
+                        // @ts-ignore
+                        queryObjectToQueryString(urlData);
+                    }
+                    return [4 /*yield*/, triggerGetSolidEntities(queryString)];
+                case 1:
+                    data = _e.sent();
+                    // Update the kanban view data with the new data based on filter
+                    setSwimLaneCurrentPageNumber(1);
+                    if (data && ((_d = data === null || data === void 0 ? void 0 : data.data) === null || _d === void 0 ? void 0 : _d.groupRecords.length) > 0) {
+                        updatedData = __spreadArray([], data.data.groupRecords, true);
+                        setKanbanViewData(updatedData);
+                    }
+                    setSelectedRecords([]);
+                    _e.label = 2;
+                case 2: return [2 /*return*/];
+            }
+        });
+    }); };
+    useEffect(function () {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15;
+        if (solidKanbanViewMetaData) {
+            var createActionUrl = ((_d = (_c = (_b = (_a = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _a === void 0 ? void 0 : _a.solidView) === null || _b === void 0 ? void 0 : _b.layout) === null || _c === void 0 ? void 0 : _c.attrs) === null || _d === void 0 ? void 0 : _d.createAction) && ((_j = (_h = (_g = (_f = (_e = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _e === void 0 ? void 0 : _e.solidView) === null || _f === void 0 ? void 0 : _f.layout) === null || _g === void 0 ? void 0 : _g.attrs) === null || _h === void 0 ? void 0 : _h.createAction) === null || _j === void 0 ? void 0 : _j.type) === "custom" ? (_p = (_o = (_m = (_l = (_k = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _k === void 0 ? void 0 : _k.solidView) === null || _l === void 0 ? void 0 : _l.layout) === null || _m === void 0 ? void 0 : _m.attrs) === null || _o === void 0 ? void 0 : _o.createAction) === null || _p === void 0 ? void 0 : _p.customComponent : "form/new";
+            var editActionUrl = ((_t = (_s = (_r = (_q = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _q === void 0 ? void 0 : _q.solidView) === null || _r === void 0 ? void 0 : _r.layout) === null || _s === void 0 ? void 0 : _s.attrs) === null || _t === void 0 ? void 0 : _t.editAction) && ((_y = (_x = (_w = (_v = (_u = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _u === void 0 ? void 0 : _u.solidView) === null || _v === void 0 ? void 0 : _v.layout) === null || _w === void 0 ? void 0 : _w.attrs) === null || _x === void 0 ? void 0 : _x.editAction) === null || _y === void 0 ? void 0 : _y.type) === "custom" ? (_3 = (_2 = (_1 = (_0 = (_z = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _z === void 0 ? void 0 : _z.solidView) === null || _0 === void 0 ? void 0 : _0.layout) === null || _1 === void 0 ? void 0 : _1.attrs) === null || _2 === void 0 ? void 0 : _2.editAction) === null || _3 === void 0 ? void 0 : _3.customComponent : "form";
+            var viewModes_2 = ((_7 = (_6 = (_5 = (_4 = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _4 === void 0 ? void 0 : _4.solidView) === null || _5 === void 0 ? void 0 : _5.layout) === null || _6 === void 0 ? void 0 : _6.attrs) === null || _7 === void 0 ? void 0 : _7.allowedViews) && ((_11 = (_10 = (_9 = (_8 = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _8 === void 0 ? void 0 : _8.solidView) === null || _9 === void 0 ? void 0 : _9.layout) === null || _10 === void 0 ? void 0 : _10.attrs) === null || _11 === void 0 ? void 0 : _11.allowedViews.length) > 0 && ((_15 = (_14 = (_13 = (_12 = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _12 === void 0 ? void 0 : _12.solidView) === null || _13 === void 0 ? void 0 : _13.layout) === null || _14 === void 0 ? void 0 : _14.attrs) === null || _15 === void 0 ? void 0 : _15.allowedViews.map(function (view) { return { label: capitalize(view), value: view }; }));
+            setViewModes(viewModes_2);
+            if (createActionUrl) {
+                setCreateButtonUrl(createActionUrl);
+            }
+            if (editActionUrl) {
+                setEditButtonUrl(editActionUrl);
+            }
+        }
+    }, [solidKanbanViewMetaData]);
+    var kanbanViewTitle = (_b = (_a = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _a === void 0 ? void 0 : _a.solidView) === null || _b === void 0 ? void 0 : _b.displayName;
+    var toggleBothSidebars = function () {
+        if (visibleNavbar) {
+            dispatch(toggleNavbar()); // close both
+        }
+        else {
+            dispatch(showNavbar()); // open both
+        }
+    };
+    return (_jsxs("div", { className: "page-parent-wrapper", children: [_jsx(Toast, { ref: toast }), _jsxs("div", { className: "page-header flex-column lg:flex-row", children: [_jsxs("div", { className: "flex justify-content-between w-full ", children: [_jsxs("div", { className: "flex align-items-center solid-header-buttons-wrapper", children: [params.embeded !== true &&
+                                        _jsx("div", { className: "apps-icon block md:hidden cursor-pointer", onClick: toggleBothSidebars, children: _jsx("i", { className: "pi pi-th-large" }) }), _jsx("p", { className: "m-0 view-title solid-text-wrapper", children: kanbanViewTitle }), ((_e = (_d = (_c = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _c === void 0 ? void 0 : _c.solidView) === null || _d === void 0 ? void 0 : _d.layout) === null || _e === void 0 ? void 0 : _e.attrs.enableGlobalSearch) === true &&
+                                        // <SolidGlobalSearchElement viewData={solidKanbanViewMetaData} handleApplyCustomFilter={handleApplyCustomFilter} ></SolidGlobalSearchElement>
+                                        _jsx("div", { className: "hidden lg:flex", children: _jsx(SolidGlobalSearchElement, { showSaveFilterPopup: showSaveFilterPopup, setShowSaveFilterPopup: setShowSaveFilterPopup, ref: solidGlobalSearchElementRef, viewData: solidKanbanViewMetaData, handleApplyCustomFilter: handleApplyCustomFilter }) })] }), _jsxs("div", { className: "flex align-items-center solid-header-buttons-wrapper", children: [((_h = (_g = (_f = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _f === void 0 ? void 0 : _f.solidView) === null || _g === void 0 ? void 0 : _g.layout) === null || _h === void 0 ? void 0 : _h.attrs.enableGlobalSearch) === true &&
+                                        _jsx("div", { className: "flex lg:hidden", children: _jsx(Button, { type: "button", size: "small", icon: "pi pi-search", severity: "secondary", outlined: true, className: "solid-icon-button", onClick: function () { return setShowGlobalSearchElement(!showGlobalSearchElement); } }) }), actionsAllowed.includes("".concat(permissionExpression(params.modelName, 'create'))) && ((_l = (_k = (_j = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _j === void 0 ? void 0 : _j.solidView) === null || _k === void 0 ? void 0 : _k.layout) === null || _l === void 0 ? void 0 : _l.attrs.create) !== false &&
+                                        _jsx(SolidCreateButton, { createButtonUrl: createButtonUrl, createActionQueryParams: createActionQueryParams, responsiveIconOnly: true }), actionsAllowed.includes("".concat(permissionExpression(params.modelName, 'delete'))) && ((_p = (_o = (_m = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _m === void 0 ? void 0 : _m.solidView) === null || _o === void 0 ? void 0 : _o.layout) === null || _p === void 0 ? void 0 : _p.attrs.delete) !== false && selectedRecords.length > 0 && _jsx(Button, { type: "button", label: "Delete", size: "small", onClick: function () { return setDialogVisible(true); }, className: "small-button ", severity: "danger" }), _jsx(Button, { type: "button", size: "small", icon: "pi pi-refresh", severity: "secondary", className: "solid-icon-button", outlined: true, onClick: function () {
+                                            window.location.reload();
+                                        } }), _jsx(SolidKanbanViewConfigure, { solidKanbanViewMetaData: solidKanbanViewMetaData, actionsAllowed: actionsAllowed, viewModes: viewModes, setLayoutDialogVisible: setLayoutDialogVisible, setShowSaveFilterPopup: setShowSaveFilterPopup })] })] }), ((_s = (_r = (_q = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _q === void 0 ? void 0 : _q.solidView) === null || _r === void 0 ? void 0 : _r.layout) === null || _s === void 0 ? void 0 : _s.attrs.enableGlobalSearch) === true && showGlobalSearchElement && (_jsx("div", { className: "flex lg:hidden", children: _jsx(SolidGlobalSearchElement, { showSaveFilterPopup: showSaveFilterPopup, setShowSaveFilterPopup: setShowSaveFilterPopup, ref: solidGlobalSearchElementRef, viewData: solidKanbanViewMetaData, handleApplyCustomFilter: handleApplyCustomFilter }) }))] }), _jsx("style", { children: ".p-datatable .p-datatable-loading-overlay {background-color: rgba(0, 0, 0, 0.0);}" }), solidKanbanViewMetaData && kanbanViewData &&
+                _jsx(KanbanBoard, { groupByFieldName: groupByFieldName, groupedView: groupedView, kanbanViewData: kanbanViewData, maxSwimLanesCount: maxSwimLanesCount, solidKanbanViewMetaData: solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data, setKanbanViewData: setKanbanViewData, handleLoadMore: handleLoadMore, onDragEnd: onDragEnd, handleSwimLanePagination: handleSwimLanePagination, setLightboxUrls: setLightboxUrls, setOpenLightbox: setOpenLightbox, editButtonUrl: editBaseUrl }), _jsx(Dialog, { visible: isDialogVisible, header: "Confirm Delete", modal: true, className: "solid-confirm-dialog", footer: function () { return (_jsxs("div", { className: "flex justify-content-center", children: [_jsx(Button, { label: "Yes", icon: "pi pi-check", className: 'small-button', severity: "danger", autoFocus: true, onClick: deleteBulk }), _jsx(Button, { label: "No", icon: "pi pi-times", className: 'small-button', onClick: onDeleteClose })] })); }, onHide: function () { return setDialogVisible(false); }, children: _jsx("p", { children: "Are you sure you want to delete the selected records?" }) }), openLightbox &&
+                _jsx(Lightbox, { open: openLightbox, plugins: [Counter, Download], close: function () { return setOpenLightbox(false); }, 
+                    // @ts-ignore
+                    slides: lightboxUrls }), _jsx(Dialog, { visible: isLayoutDialogVisible, header: "Change Kanban Layout", modal: true, onHide: function () { return setLayoutDialogVisible(false); }, 
+                // contentStyle={{
+                //   width: 800
+                // }}
+                style: { width: '800px' }, breakpoints: {
+                    '1024px': '75vw', '991px': '86vw', '767px': '92vw', '250px': '96vw'
+                }, children: _jsx(KanbanUserViewLayout, { solidKanbanViewMetaData: solidKanbanViewMetaData, setLayoutDialogVisible: setLayoutDialogVisible }) })] }));
+};
+//# sourceMappingURL=SolidKanbanView.js.map