@solidxai/core-ui 0.0.1

package/dist/components/core/list/SolidListView.js

@@ -0,0 +1,1321 @@
+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, Fragment as _Fragment } from "react/jsx-runtime";
+// @ts-nocheck
+import { useState, useEffect, useRef, useMemo } from "react";
+import { DataTable, } from "primereact/datatable";
+import { Column } from "primereact/column";
+import { FilterMatchMode } from "primereact/api";
+import qs from "qs";
+import { Button } from "primereact/button";
+import { Dialog } from "primereact/dialog";
+import { createSolidEntityApi } from "../../../redux/api/solidEntityApi";
+import { useGetSolidViewLayoutQuery } from "../../../redux/api/solidViewApi";
+import { SolidListViewColumn } from "./SolidListViewColumn";
+// import { SolidListViewOptions } from "../common/SolidListviewOptions";
+import { SolidCreateButton } from "../common/SolidCreateButton";
+import { SolidGlobalSearchElement } from "../common/SolidGlobalSearchElement";
+import { useLazyCheckIfPermissionExistsQuery } from "../../../redux/api/userApi";
+import { permissionExpression } from "../../../helpers/permissions";
+import { usePathname } from "../../../hooks/usePathname";
+import { useRouter } from "../../../hooks/useRouter";
+import { useSearchParams } from "../../../hooks/useSearchParams";
+import { ListViewRowActionPopup } from "./ListViewRowActionPopup";
+import { FilterIcon } from '../../../components/modelsComponents/filterIcon';
+import { OverlayPanel } from "primereact/overlaypanel";
+import { Toast } from "primereact/toast";
+import { Divider } from "primereact/divider";
+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 Video from "yet-another-react-lightbox/plugins/video";
+import "yet-another-react-lightbox/styles.css";
+import "yet-another-react-lightbox/plugins/counter.css";
+import { SolidListViewConfigure } from "./SolidListViewConfigure";
+import { SolidListViewShimmerLoading } from "./SolidListViewShimmerLoading";
+import { SolidEmptyListViewPlaceholder } from "./SolidEmptyListViewPlaceholder";
+import { useHandleListCustomButtonClick } from "../../../components/common/useHandleListCustomButtonClick";
+import { hasAnyRole } from "../../../helpers/rolesHelper";
+import { SolidListViewHeaderButton } from "./SolidListViewHeaderButton";
+import { SolidListViewRowButtonContextMenu } from "./SolidListViewRowButtonContextMenu";
+import { useDispatch, useSelector } from "react-redux";
+import styles from "./SolidListViewWrapper.module.css";
+import { SolidXAIIcon } from "../solid-ai/SolidXAIIcon";
+import { getExtensionFunction } from "../../../helpers/registry";
+import { useSession } from "../../../hooks/useSession";
+import { ERROR_MESSAGES } from "../../../constants/error-messages";
+import { SolidAiMainWrapper } from "../solid-ai/SolidAiMainWrapper";
+import { showNavbar, toggleNavbar } from "../../../redux/features/navbarSlice";
+import { useLazyGetMcpUrlQuery, useLazyGetSolidSettingsQuery } from "../../../redux/api/solidSettingsApi";
+import { normalizeSolidListKanbanActionPath } from "../../../helpers/routePaths";
+// import { ERROR_MESSAGES } from "../../../constants/error-messages";
+var getRandomInt = function (min, max) {
+    return Math.floor(Math.random() * (max - min + 1)) + min;
+};
+export var queryStringToQueryObject = function () {
+    var currentPageUrl = window.location.pathname; // Get the current page URL
+    var encodedQueryString = localStorage.getItem(currentPageUrl); // Retrieve the encoded query string from local storage
+    if (encodedQueryString) {
+        try {
+            var decodedQueryString = atob(encodedQueryString); // Base64 decode the string
+            var parsedParams = JSON.parse(decodedQueryString); // Parse the decoded string into an object
+            return parsedParams;
+        }
+        catch (error) {
+            console.error(ERROR_MESSAGES.ERROR_DECODING, error);
+        }
+    }
+};
+export var queryStringToQueryObjectByUrl = function (url) {
+    var currentPageUrl = url; // Get the current page URL
+    var encodedQueryString = localStorage.getItem(currentPageUrl); // Retrieve the encoded query string from local storage
+    if (encodedQueryString) {
+        try {
+            var decodedQueryString = atob(encodedQueryString); // Base64 decode the string
+            var parsedParams = JSON.parse(decodedQueryString); // Parse the decoded string into an object
+            return parsedParams;
+        }
+        catch (error) {
+            console.error(ERROR_MESSAGES.ERROR_DECODING, error);
+        }
+    }
+};
+export var queryObjectToQueryString = function (queryObject) {
+    if (queryObject) {
+        var stringifiedObject = JSON.stringify(queryObject);
+        // const stringifiedObject = qs.stringify(queryObject, { encodeValuesOnly: true, arrayFormat: "brackets" });
+        var encodedQueryString = btoa(stringifiedObject); // Base64 encode the stringified object
+        var currentPageUrl = window.location.pathname; // Get the current page URL
+        localStorage.setItem(currentPageUrl, encodedQueryString); // Store in local storage with the URL as the key
+        return encodedQueryString;
+    }
+    return null;
+};
+export var queryObjectToQueryStringByUrl = function (url, queryObject) {
+    if (queryObject) {
+        var stringifiedObject = JSON.stringify(queryObject);
+        // const stringifiedObject = qs.stringify(queryObject, { encodeValuesOnly: true, arrayFormat: "brackets" });
+        var encodedQueryString = btoa(stringifiedObject); // Base64 encode the stringified object
+        var currentPageUrl = url; // Get the current page URL
+        localStorage.setItem(currentPageUrl, encodedQueryString); // Store in local storage with the URL as the key
+        return encodedQueryString;
+    }
+    return null;
+};
+export var SolidListView = function (params) {
+    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, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31;
+    var session = useSession();
+    var user = (_a = session === null || session === void 0 ? void 0 : session.data) === null || _a === void 0 ? void 0 : _a.user;
+    var dispatch = useDispatch();
+    var visibleNavbar = useSelector(function (state) { var _a; return (_a = state.navbarState) === null || _a === void 0 ? void 0 : _a.visibleNavbar; });
+    var pathname = usePathname();
+    var solidGlobalSearchElementRef = useRef();
+    var router = useRouter();
+    var searchParams = useSearchParams();
+    var localeName = searchParams.get("locale");
+    var _32 = useState(params.customFilter || null), filters = _32[0], setFilters = _32[1];
+    // const [customFilter, setCustomFilter] = useState<FilterRule[]>(initialState);
+    // const [showGlobalSearchElement, setShowGlobalSearchElement] = useState<boolean>(false);
+    var _33 = useState([]), toPopulate = _33[0], setToPopulate = _33[1];
+    var _34 = useState([]), toPopulateMedia = _34[0], setToPopulateMedia = _34[1];
+    var _35 = useState([]), actionsAllowed = _35[0], setActionsAllowed = _35[1];
+    var _36 = useState(false), isOpenSolidXAiPanel = _36[0], setIsOpenSolidXAiPanel = _36[1];
+    var _37 = useState(380), chatterWidth = _37[0], setChatterWidth = _37[1];
+    var _38 = useState(false), isResizing = _38[0], setIsResizing = _38[1];
+    var triggerCheckIfPermissionExists = useLazyCheckIfPermissionExistsQuery()[0];
+    var handleCustomButtonClick = useHandleListCustomButtonClick();
+    var _39 = useState(null), mcpUrl = _39[0], setMcpUrl = _39[1];
+    var getMcpUrl = useLazyGetMcpUrlQuery()[0];
+    var _40 = useLazyGetSolidSettingsQuery(), trigger = _40[0], solidSettingsData = _40[1].data;
+    useEffect(function () {
+        trigger(""); // Fetch settings on mount
+    }, []);
+    var editBaseUrl = useMemo(function () { return normalizeSolidListKanbanActionPath(pathname, editButtonUrl || "form"); }, [editButtonUrl, pathname]);
+    useEffect(function () {
+        var _a, _b;
+        if (((_a = solidSettingsData === null || solidSettingsData === void 0 ? void 0 : solidSettingsData.data) === null || _a === void 0 ? void 0 : _a.mcpEnabled) && ((_b = solidSettingsData === null || solidSettingsData === void 0 ? void 0 : solidSettingsData.data) === null || _b === void 0 ? void 0 : _b.mcpServerUrl)) {
+            enableSolidXAiPanel();
+        }
+    }, [solidSettingsData]);
+    var enableSolidXAiPanel = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var queryData, queryString, response, error_1;
+        var _a, _b;
+        return __generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    _c.trys.push([0, 2, , 3]);
+                    queryData = {
+                        showHeader: "true",
+                        inListView: "true"
+                    };
+                    queryString = qs.stringify(__assign({}, queryData), { encodeValuesOnly: true });
+                    return [4 /*yield*/, getMcpUrl(queryString).unwrap()];
+                case 1:
+                    response = _c.sent();
+                    console.log("response", response);
+                    if (response && ((_a = response === null || response === void 0 ? void 0 : response.data) === null || _a === void 0 ? void 0 : _a.mcpUrl)) {
+                        setMcpUrl((_b = response === null || response === void 0 ? void 0 : response.data) === null || _b === void 0 ? void 0 : _b.mcpUrl);
+                    }
+                    return [3 /*break*/, 3];
+                case 2:
+                    error_1 = _c.sent();
+                    return [3 /*break*/, 3];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    useEffect(function () {
+        var storedOpen = localStorage.getItem("l_solidxai_open");
+        var storedWidth = localStorage.getItem("l_solidxai_width");
+        if (storedOpen !== null) {
+            setIsOpenSolidXAiPanel(storedOpen === "true");
+        }
+        if (storedWidth !== null) {
+            var width = parseInt(storedWidth, 10);
+            if (!isNaN(width)) {
+                setChatterWidth(width);
+            }
+        }
+    }, []);
+    useEffect(function () {
+        if (isResizing) {
+            var handleMouseMove_1 = function (e) {
+                var newWidth = window.innerWidth - e.clientX;
+                var clampedWidth = Math.max(280, Math.min(newWidth, 700));
+                setChatterWidth(clampedWidth);
+                localStorage.setItem("l_solidxai_width", clampedWidth.toString());
+            };
+            var handleMouseUp_1 = function () {
+                setIsResizing(false);
+            };
+            window.addEventListener("mousemove", handleMouseMove_1);
+            window.addEventListener("mouseup", handleMouseUp_1);
+            return function () {
+                window.removeEventListener("mousemove", handleMouseMove_1);
+                window.removeEventListener("mouseup", handleMouseUp_1);
+            };
+        }
+    }, [isResizing]);
+    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'),
+                            permissionExpression(params.modelName, 'deleteMany'),
+                            permissionExpression(params.modelName, 'findOne'),
+                            permissionExpression(params.modelName, 'findMany'),
+                            permissionExpression(params.modelName, 'insertMany'),
+                            permissionExpression('importTransaction', 'create'),
+                            permissionExpression('exportTransaction', 'create'),
+                            permissionExpression('userViewMetadata', 'create'),
+                            permissionExpression('savedFilters', 'create')
+                        ];
+                        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]);
+    var isFilterApplied = filters ? true : false;
+    // Create the RTK slices for this entity
+    var entityApi = createSolidEntityApi(params.modelName);
+    var useCreateSolidEntityMutation = entityApi.useCreateSolidEntityMutation, useDeleteMultipleSolidEntitiesMutation = entityApi.useDeleteMultipleSolidEntitiesMutation, useDeleteSolidEntityMutation = entityApi.useDeleteSolidEntityMutation, useGetSolidEntitiesQuery = entityApi.useGetSolidEntitiesQuery, useGetSolidEntityByIdQuery = entityApi.useGetSolidEntityByIdQuery, useLazyGetSolidEntitiesQuery = entityApi.useLazyGetSolidEntitiesQuery, useLazyGetSolidEntityByIdQuery = entityApi.useLazyGetSolidEntityByIdQuery, usePrefetch = entityApi.usePrefetch, useUpdateSolidEntityMutation = entityApi.useUpdateSolidEntityMutation, useRecoverSolidEntityByIdQuery = entityApi.useRecoverSolidEntityByIdQuery, useLazyRecoverSolidEntityByIdQuery = entityApi.useLazyRecoverSolidEntityByIdQuery, useRecoverSolidEntityMutation = entityApi.useRecoverSolidEntityMutation;
+    var menuItemId = searchParams.get("menuItemId");
+    var menuItemName = searchParams.get("menuItemName");
+    var actionId = searchParams.get("actionId");
+    var actionName = searchParams.get("actionName");
+    // Get the list view layout & metadata first.
+    var listViewMetaDataQs = qs.stringify({
+        modelName: params.modelName,
+        moduleName: params.moduleName,
+        viewType: "list",
+        menuItemId: menuItemId,
+        menuItemName: menuItemName,
+        actionId: actionId,
+        actionName: actionName,
+    }, {
+        encodeValuesOnly: true,
+    });
+    var _41 = useState(null), solidListViewMetaData = _41[0], setSolidListViewMetaData = _41[1];
+    var _42 = useState(null), solidListViewLayout = _42[0], setSolidListViewLayout = _42[1];
+    var _43 = useState(false), isDraftPublishWorkflowEnabled = _43[0], setIsDraftPublishWorkflowEnabled = _43[1];
+    var _44 = useGetSolidViewLayoutQuery(listViewMetaDataQs), solidListViewInitialMetaData = _44.data, solidListViewMetaDataError = _44.error, solidListViewMetaDataIsLoading = _44.isLoading, solidListViewMetaDataIsError = _44.isError, refetch = _44.refetch;
+    var initialFilterMethod = function () {
+        var _a, _b, _c, _d;
+        var solidView = (_a = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _a === void 0 ? void 0 : _a.solidView;
+        var solidFieldsMetadata = (_b = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _b === void 0 ? void 0 : _b.solidFieldsMetadata;
+        var initialFilters = {};
+        var toPopulate = [];
+        var toPopulateMedia = [];
+        var currentLayout = params.customLayout ? params.customLayout : solidView === null || solidView === void 0 ? void 0 : solidView.layout;
+        for (var i = 0; i < (currentLayout === null || currentLayout === void 0 ? void 0 : currentLayout.children.length); i++) {
+            var column = currentLayout === null || currentLayout === void 0 ? void 0 : currentLayout.children[i];
+            var fieldMetadata = solidFieldsMetadata === null || solidFieldsMetadata === void 0 ? void 0 : solidFieldsMetadata[column.attrs.name];
+            if (!(fieldMetadata === null || fieldMetadata === void 0 ? void 0 : fieldMetadata.type)) {
+                console.log("Some problem in rendering column: ", column);
+                showFieldError(ERROR_MESSAGES.FIELD_NOT_IN_METADATA(column.attrs.label));
+                // return;
+            }
+            if (fieldMetadata) {
+                // Form the initial filters after iterating over the columns and field metadata.
+                if (["int", "bigint", "float", "decimal"].includes(fieldMetadata === null || fieldMetadata === void 0 ? void 0 : 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 === null || fieldMetadata === void 0 ? void 0 : 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 === null || fieldMetadata === void 0 ? void 0 : 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") {
+                    if (!toPopulate.includes(fieldMetadata.name)) {
+                        toPopulate.push(fieldMetadata.name);
+                    }
+                }
+                if (fieldMetadata.type === "mediaSingle" ||
+                    fieldMetadata.type === "mediaMultiple") {
+                    if (!toPopulateMedia.includes(fieldMetadata.name)) {
+                        toPopulateMedia.push(fieldMetadata.name);
+                    }
+                }
+            }
+        }
+        var populate = toPopulate;
+        var populateMedia = toPopulateMedia;
+        var rows = (_d = (_c = currentLayout === null || currentLayout === void 0 ? void 0 : currentLayout.attrs) === null || _c === void 0 ? void 0 : _c.defaultPageSize) !== null && _d !== void 0 ? _d : 25;
+        var sortField = "id";
+        var sortOrder = -1;
+        // setRows(rows);
+        // setToPopulate(populate);
+        // setToPopulateMedia(populateMedia);
+        // setSortField("id");
+        // setSortOrder(-1);
+        return { sortField: sortField, sortOrder: sortOrder, rows: rows, populate: populate, populateMedia: populateMedia };
+    };
+    // Set the initial filter state based on the metadata.
+    useEffect(function () {
+        var _a, _b, _c;
+        // refetch();
+        if (solidListViewInitialMetaData) {
+            if (params.customLayout) {
+                setSolidListViewLayout(params.customLayout);
+            }
+            else {
+                setSolidListViewLayout(solidListViewInitialMetaData === null || solidListViewInitialMetaData === void 0 ? void 0 : solidListViewInitialMetaData.data.solidView.layout);
+            }
+            setSolidListViewMetaData(solidListViewInitialMetaData);
+            setIsDraftPublishWorkflowEnabled(((_c = (_b = (_a = solidListViewInitialMetaData === null || solidListViewInitialMetaData === void 0 ? void 0 : solidListViewInitialMetaData.data) === null || _a === void 0 ? void 0 : _a.solidView) === null || _b === void 0 ? void 0 : _b.model) === null || _c === void 0 ? void 0 : _c.draftPublishWorkflow) === true);
+        }
+    }, [solidListViewInitialMetaData]);
+    // set layout and actions for create and edit buttons and view modes
+    // useEffect(() => {
+    //   if (solidListViewMetaData) {
+    //     const listLayoutAttrs = solidListViewMetaData?.data?.solidView?.layout?.attrs;
+    //     const createActionUrl = listLayoutAttrs?.createAction && listLayoutAttrs?.createAction?.type === "custom" ? listLayoutAttrs?.createAction?.customComponent : "form/new";
+    //     const editActionUrl = listLayoutAttrs?.editAction && listLayoutAttrs?.editAction?.type === "custom" ? listLayoutAttrs?.editAction?.customComponent : "form";
+    //     if (listLayoutAttrs?.createAction) {
+    //       setCreateActionQueryParams({
+    //         actionName: listLayoutAttrs.createAction.name,
+    //         actionType: listLayoutAttrs.createAction.type,
+    //         actionContext: listLayoutAttrs.createAction.context,
+    //       });
+    //     }
+    //     if (listLayoutAttrs?.editAction) {
+    //       setEditActionQueryParams({
+    //         actionName: listLayoutAttrs.editAction.name,
+    //         actionType: listLayoutAttrs.editAction.type,
+    //         actionContext: listLayoutAttrs.editAction.context,
+    //       });
+    //     }
+    //     const viewModes = listLayoutAttrs?.allowedViews && listLayoutAttrs?.allowedViews.length > 0 && listLayoutAttrs?.allowedViews.map((view: any) => { return { label: capitalize(view), value: view }; });
+    //     setViewModes(viewModes);
+    //     if (createActionUrl) {
+    //       setCreateButtonUrl(createActionUrl);
+    //     }
+    //     if (editActionUrl) {
+    //       setEditButtonUrl(editActionUrl);
+    //     }
+    //   }
+    // }, [solidListViewMetaData]);
+    // set layout and actions for create and edit buttons and view modes
+    useEffect(function () {
+        var _a, _b, _c, _d;
+        if (solidListViewLayout) {
+            var listLayoutAttrs = solidListViewLayout.attrs;
+            var createActionUrl = (listLayoutAttrs === null || listLayoutAttrs === void 0 ? void 0 : listLayoutAttrs.createAction) && ((_a = listLayoutAttrs === null || listLayoutAttrs === void 0 ? void 0 : listLayoutAttrs.createAction) === null || _a === void 0 ? void 0 : _a.type) === "custom" ? (_b = listLayoutAttrs === null || listLayoutAttrs === void 0 ? void 0 : listLayoutAttrs.createAction) === null || _b === void 0 ? void 0 : _b.customComponent : "form/new";
+            var editActionUrl = (listLayoutAttrs === null || listLayoutAttrs === void 0 ? void 0 : listLayoutAttrs.editAction) && ((_c = listLayoutAttrs === null || listLayoutAttrs === void 0 ? void 0 : listLayoutAttrs.editAction) === null || _c === void 0 ? void 0 : _c.type) === "custom" ? (_d = listLayoutAttrs === null || listLayoutAttrs === void 0 ? void 0 : listLayoutAttrs.editAction) === null || _d === void 0 ? void 0 : _d.customComponent : "form";
+            if (listLayoutAttrs === null || listLayoutAttrs === void 0 ? void 0 : listLayoutAttrs.createAction) {
+                setCreateActionQueryParams({
+                    actionName: listLayoutAttrs.createAction.name,
+                    actionType: listLayoutAttrs.createAction.type,
+                    actionContext: listLayoutAttrs.createAction.context,
+                });
+            }
+            if (listLayoutAttrs === null || listLayoutAttrs === void 0 ? void 0 : listLayoutAttrs.editAction) {
+                setEditActionQueryParams({
+                    actionName: listLayoutAttrs.editAction.name,
+                    actionType: listLayoutAttrs.editAction.type,
+                    actionContext: listLayoutAttrs.editAction.context,
+                });
+            }
+            var viewModes_1 = (listLayoutAttrs === null || listLayoutAttrs === void 0 ? void 0 : listLayoutAttrs.allowedViews) && (listLayoutAttrs === null || listLayoutAttrs === void 0 ? void 0 : listLayoutAttrs.allowedViews.length) > 0 && (listLayoutAttrs === null || listLayoutAttrs === void 0 ? void 0 : listLayoutAttrs.allowedViews.map(function (view) { return { label: capitalize(view), value: view }; }));
+            setViewModes(viewModes_1);
+            if (createActionUrl) {
+                setCreateButtonUrl(createActionUrl);
+            }
+            if (editActionUrl) {
+                setEditButtonUrl(editActionUrl);
+            }
+        }
+    }, [solidListViewLayout]);
+    // All list view state.
+    var _45 = useState([]), listViewData = _45[0], setListViewData = _45[1];
+    var _46 = useState(0), first = _46[0], setFirst = _46[1];
+    var _47 = useState(((_b = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _b === void 0 ? void 0 : _b.defaultPageSize) ? (_c = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _c === void 0 ? void 0 : _c.defaultPageSize : 10), rows = _47[0], setRows = _47[1];
+    var _48 = useState(0), totalRecords = _48[0], setTotalRecords = _48[1];
+    var _49 = useState("id"), sortField = _49[0], setSortField = _49[1];
+    var _50 = useState(-1), sortOrder = _50[0], setSortOrder = _50[1];
+    var _51 = useState([]), selectedRecords = _51[0], setSelectedRecords = _51[1];
+    var _52 = useState([]), selectedRecoverRecords = _52[0], setSelectedRecoverRecords = _52[1];
+    var _53 = useState(true), loading = _53[0], setLoading = _53[1];
+    var _54 = useState(false), isDialogVisible = _54[0], setDialogVisible = _54[1];
+    var _55 = useState(false), isRecoverDialogVisible = _55[0], setRecoverDialogVisible = _55[1];
+    var _56 = useState(), createButtonUrl = _56[0], setCreateButtonUrl = _56[1];
+    var _57 = useState(), editButtonUrl = _57[0], setEditButtonUrl = _57[1];
+    var _58 = useState({}), createActionQueryParams = _58[0], setCreateActionQueryParams = _58[1];
+    var _59 = useState({}), editActionQueryParams = _59[0], setEditActionQueryParams = _59[1];
+    var _60 = useState(false), showArchived = _60[0], setShowArchived = _60[1];
+    var _61 = useState(false), queryDataLoaded = _61[0], setQueryDataLoaded = _61[1];
+    var _62 = useState(null), customFilter = _62[0], setCustomFilter = _62[1];
+    var _63 = useState(false), showSaveFilterPopup = _63[0], setShowSaveFilterPopup = _63[1];
+    var sizeOptions = [
+        { label: "Compact", value: "small", image: CompactImage },
+        { label: "Cozy", value: "normal", image: CozyImage },
+        { label: "Comfortable", value: "large", image: ComfortableImage },
+    ];
+    // const viewModes = [
+    //   { label: 'List ', value: 'list', image: ListImage },
+    //   { label: 'Kanban', value: 'kanban', image: KanbanImage },
+    // ]
+    var _64 = useState(sizeOptions[1].value), size = _64[0], setSize = _64[1];
+    var _65 = useState([]), viewModes = _65[0], setViewModes = _65[1];
+    // Custom Row Action
+    var _66 = useState(false), listViewRowActionPopupState = _66[0], setListViewRowActionPopupState = _66[1];
+    var _67 = useState(), listViewRowActionData = _67[0], setListRowActionData = _67[1];
+    var toast = useRef(null);
+    // Get the list view data.
+    var _68 = useLazyGetSolidEntitiesQuery(), triggerGetSolidEntities = _68[0], _69 = _68[1], solidEntityListViewData = _69.data, isLoading = _69.isLoading, error = _69.error;
+    var _70 = useLazyRecoverSolidEntityByIdQuery(), triggerRecoverSolidEntitiesById = _70[0], _71 = _70[1], recoverByIdData = _71.data, recoverByIdIsLoading = _71.isLoading, recoverByIdError = _71.error, recoverByIdIsError = _71.isError, recoverByIdIsSuccess = _71.isSuccess;
+    var _72 = useRecoverSolidEntityMutation(), triggerRecoverSolidEntities = _72[0], _73 = _72[1], recoverByData = _73.data, recoverByIsLoading = _73.isLoading, recoverError = _73.error, recoverIsError = _73.isError, recoverByIsSuccess = _73.isSuccess;
+    // After data is fetched populate the list view state so as to be able to render the data.
+    useEffect(function () {
+        if (solidEntityListViewData) {
+            setLoading(true);
+            var cleanedRecords = solidEntityListViewData.records.map(function (record) {
+                var newRecord = __assign({}, record);
+                Object.entries(newRecord).forEach(function (_a) {
+                    var key = _a[0], value = _a[1];
+                    if (typeof value === "string") {
+                        try {
+                            var parsed = JSON.parse(value);
+                            if (Array.isArray(parsed)) {
+                                newRecord[key] = parsed.join(", ");
+                            }
+                        }
+                        catch (_b) {
+                            // If not valid JSON array, optionally strip brackets/quotes
+                            if (/^\[.*\]$/.test(value)) {
+                                newRecord[key] = value.replace(/[\[\]"]+/g, "");
+                            }
+                        }
+                    }
+                });
+                return newRecord;
+            });
+            setListViewData(cleanedRecords);
+            // setListViewData(solidEntityListViewData?.records);
+            setTotalRecords(solidEntityListViewData === null || solidEntityListViewData === void 0 ? void 0 : solidEntityListViewData.meta.totalRecords);
+            setLoading(false);
+        }
+    }, [solidEntityListViewData]);
+    var _74 = useDeleteSolidEntityMutation(), deleteSolidSingleEntiry = _74[0], isDeleteSolidSingleEntitySuccess = _74[1].isSuccess;
+    // Delete mutation
+    var _75 = useDeleteMultipleSolidEntitiesMutation(), deleteManySolidEntities = _75[0], _76 = _75[1], isSolidEntitiesDeleted = _76.isLoading, isDeleteSolidEntitiesSucess = _76.isSuccess, isSolidEntitiesDeleteError = _76.isError, SolidEntitiesDeleteError = _76.error, DeletedSolidEntities = _76.data;
+    // Fetch data after toPopulate has been populated...
+    useEffect(function () {
+        var _a, _b, _c;
+        console.log("useEffect: [isDeleteSolidEntitiesSucess, isDeleteSolidSingleEntitySuccess, recoverByIdIsSuccess, recoverByIsSuccess, solidListViewMetaData]");
+        if (solidListViewMetaData && solidListViewLayout) {
+            var queryObject = queryStringToQueryObject();
+            if (queryObject) {
+                var queryData = {
+                    offset: queryObject.offset || 0,
+                    limit: queryObject.limit || 25,
+                    populate: queryObject.populate,
+                    populateMedia: queryObject.populateMedia,
+                    sort: queryObject.sort
+                        ? (_a = queryObject.sort) === null || _a === void 0 ? void 0 : _a.map(function (sortItem) {
+                            var _a = sortItem.split(":"), field = _a[0], order = _a[1];
+                            return { field: field, order: order };
+                        })
+                        : ["id:desc"],
+                    filters: queryObject.filters,
+                };
+                var filters_1 = {
+                    $and: [],
+                };
+                if (queryObject.custom_filter_predicate) {
+                    filters_1.$and.push(queryObject.custom_filter_predicate);
+                }
+                if (queryObject.search_predicate) {
+                    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);
+                // }
+                // if (queryObject.s_filter) {
+                //   filters.$and.push(queryObject.s_filter);
+                // }
+                // if (queryObject.c_filter) {
+                //   filters.$and.push(queryObject.c_filter);
+                // }
+                setRows(Number(queryData.limit));
+                setFirst(Number(queryData === null || queryData === void 0 ? void 0 : queryData.offset));
+                setSortField((_b = queryData === null || queryData === void 0 ? void 0 : queryData.sort[0]) === null || _b === void 0 ? void 0 : _b.field);
+                setSortOrder((_c = queryData === null || queryData === void 0 ? void 0 : queryData.sort[0]) === null || _c === void 0 ? void 0 : _c.order);
+                // latestFiltersRef.current = filters;
+                // setFilters(filters);
+                var _d = initialFilterMethod(), sortField_1 = _d.sortField, sortOrder_1 = _d.sortOrder, rows_1 = _d.rows, populate = _d.populate, populateMedia = _d.populateMedia;
+                setToPopulate(populate);
+                setToPopulateMedia(populateMedia);
+                setQueryDataLoaded(true);
+            }
+            else {
+                var _e = initialFilterMethod(), sortField_2 = _e.sortField, sortOrder_2 = _e.sortOrder, rows_2 = _e.rows, populate = _e.populate, populateMedia = _e.populateMedia;
+                setRows(rows_2);
+                setSortField(sortField_2);
+                setSortOrder(sortOrder_2);
+                setQueryDataLoaded(true);
+                setToPopulate(populate);
+                setToPopulateMedia(populateMedia);
+                setFirst(0);
+            }
+            setSelectedRecords([]);
+            setSelectedRecoverRecords([]);
+        }
+    }, [
+        isDeleteSolidEntitiesSucess,
+        isDeleteSolidSingleEntitySuccess,
+        recoverByIdIsSuccess,
+        recoverByIsSuccess,
+        solidListViewMetaData,
+        solidListViewLayout
+    ]);
+    useEffect(function () {
+        if (solidListViewMetaData && (solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) && !loading) {
+            var handleDynamicFunction = function () { return __awaiter(void 0, void 0, void 0, function () {
+                var dynamicHeader, dynamicExtensionFunction, listViewRecords, listLayout, event, updatedListData;
+                var _a, _b, _c, _d, _e, _f, _g;
+                return __generator(this, function (_h) {
+                    switch (_h.label) {
+                        case 0:
+                            dynamicHeader = (_c = (_b = (_a = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _a === void 0 ? void 0 : _a.solidView) === null || _b === void 0 ? void 0 : _b.layout) === null || _c === void 0 ? void 0 : _c.onListLoad;
+                            dynamicExtensionFunction = null;
+                            listViewRecords = listViewData;
+                            listLayout = (_e = (_d = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _d === void 0 ? void 0 : _d.solidView) === null || _e === void 0 ? void 0 : _e.layout;
+                            if (params.customLayout) {
+                                listLayout = params.customLayout;
+                            }
+                            event = {
+                                fieldsMetadata: (_f = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _f === void 0 ? void 0 : _f.solidFieldsMetadata,
+                                listData: listViewData,
+                                totalRecords: totalRecords,
+                                type: "onListLoad",
+                                viewMetadata: (_g = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _g === void 0 ? void 0 : _g.solidView,
+                                listViewLayout: listLayout,
+                                queryParams: {
+                                    menuItemId: menuItemId,
+                                    menuItemName: menuItemName,
+                                    actionId: actionId,
+                                    actionName: actionName,
+                                },
+                                user: user,
+                                session: session.data,
+                                params: params
+                            };
+                            if (!dynamicHeader) return [3 /*break*/, 3];
+                            dynamicExtensionFunction = getExtensionFunction(dynamicHeader);
+                            if (!dynamicExtensionFunction) return [3 /*break*/, 2];
+                            return [4 /*yield*/, dynamicExtensionFunction(event)];
+                        case 1:
+                            updatedListData = _h.sent();
+                            if (updatedListData && (updatedListData === null || updatedListData === void 0 ? void 0 : updatedListData.dataChanged) && (updatedListData === null || updatedListData === void 0 ? void 0 : updatedListData.newListData)) {
+                                listViewRecords = updatedListData.newListData;
+                            }
+                            if (updatedListData && (updatedListData === null || updatedListData === void 0 ? void 0 : updatedListData.layoutChanged) && (updatedListData === null || updatedListData === void 0 ? void 0 : updatedListData.newLayout)) {
+                                listLayout = updatedListData.newLayout;
+                            }
+                            _h.label = 2;
+                        case 2:
+                            if (listViewRecords) {
+                                setListViewData(listViewRecords);
+                            }
+                            if (listLayout) {
+                                setSolidListViewLayout(listLayout);
+                            }
+                            _h.label = 3;
+                        case 3: return [2 /*return*/];
+                    }
+                });
+            }); };
+            handleDynamicFunction();
+        }
+    }, [solidListViewMetaData, loading]);
+    // Create a ref that always has the latest filters
+    var latestFiltersRef = useRef(filters);
+    var latestCustomFilterRef = useRef(customFilter);
+    // Keep refs in sync
+    useEffect(function () {
+        latestFiltersRef.current = filters;
+    }, [filters]);
+    useEffect(function () {
+        latestCustomFilterRef.current = customFilter;
+    }, [customFilter]);
+    useEffect(function () {
+        console.log("useEffect: [first- ".concat(first, ", rows- ").concat(rows, ", sortField- ").concat(sortField, ", sortOrder- ").concat(sortOrder, ", showArchived- ").concat(showArchived, ", toPopulate- ").concat(toPopulate, ", toPopulateMedia- ").concat(toPopulateMedia, ", queryDataLoaded- ").concat(queryDataLoaded, "]"));
+        if (queryDataLoaded && filters) {
+            setQueryString();
+        }
+    }, [
+        first,
+        rows,
+        sortField,
+        sortOrder,
+        filters,
+        showArchived,
+        toPopulate,
+        toPopulateMedia,
+        queryDataLoaded
+    ]);
+    // Handle pagination event.
+    var onPageChange = function (event) {
+        setFirst(event.first);
+        setRows(event.rows);
+    };
+    // Handle sort event.
+    var onSort = function (event) {
+        var sortField = event.sortField, sortOrder = event.sortOrder;
+        var validSortOrder = sortOrder === 1 || sortOrder === -1 ? sortOrder : 0;
+        setSortField(sortField);
+        setSortOrder(validSortOrder);
+        setFirst(0);
+    };
+    // handle change in the records which are currently selected...
+    var onSelectionChange = function (event) {
+        var value = event.value;
+        var activeRecords = value.filter(function (record) { return record.deletedAt === null; });
+        var deletedRecords = value.filter(function (record) { return record.deletedAt !== null; });
+        setSelectedRecords(activeRecords);
+        setSelectedRecoverRecords(deletedRecords);
+    };
+    var setQueryString = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var solidFieldsMetadata, queryData, sortFieldMetadata, dynamicHeader, dynamicExtensionFunction, event, updatedListData, err_1, queryString, url, urlData;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+        return __generator(this, function (_k) {
+            switch (_k.label) {
+                case 0:
+                    solidFieldsMetadata = (_a = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _a === void 0 ? void 0 : _a.solidFieldsMetadata;
+                    queryData = {
+                        offset: first,
+                        limit: rows,
+                        filters: (_b = latestFiltersRef.current) !== null && _b !== void 0 ? _b : latestFiltersRef.current,
+                        populate: toPopulate,
+                        populateMedia: toPopulateMedia,
+                        locale: localeName ? localeName : "en",
+                    };
+                    if (sortField && solidFieldsMetadata && solidFieldsMetadata[sortField]) {
+                        sortFieldMetadata = solidFieldsMetadata[sortField];
+                        if ((sortFieldMetadata === null || sortFieldMetadata === void 0 ? void 0 : sortFieldMetadata.type) === "relation" &&
+                            (sortFieldMetadata === null || sortFieldMetadata === void 0 ? void 0 : sortFieldMetadata.relationType) === "many-to-one") {
+                            sortField = "".concat(sortField, ".").concat((_d = (_c = sortFieldMetadata === null || sortFieldMetadata === void 0 ? void 0 : sortFieldMetadata.relationModel) === null || _c === void 0 ? void 0 : _c.userKeyField) === null || _d === void 0 ? void 0 : _d.name);
+                        }
+                        queryData.sort = [
+                            "".concat(sortField, ":").concat(sortOrder == 0 ? null : sortOrder == 1 ? "asc" : "desc"),
+                        ];
+                    }
+                    else {
+                        queryData.sort = ["id:desc"];
+                    }
+                    if (showArchived) {
+                        queryData.showSoftDeleted = "inclusive";
+                    }
+                    dynamicHeader = (_g = (_f = (_e = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _e === void 0 ? void 0 : _e.solidView) === null || _f === void 0 ? void 0 : _f.layout) === null || _g === void 0 ? void 0 : _g.onBeforeListDataLoad;
+                    dynamicExtensionFunction = null;
+                    event = {
+                        type: "onBeforeListDataLoad",
+                        fieldsMetadata: (_h = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _h === void 0 ? void 0 : _h.solidFieldsMetadata,
+                        viewMetadata: (_j = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _j === void 0 ? void 0 : _j.solidView,
+                        listViewLayout: solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data.solidView.layout,
+                        filter: structuredClone(queryData),
+                        queryParams: {
+                            menuItemId: menuItemId,
+                            menuItemName: menuItemName,
+                            actionId: actionId,
+                            actionName: actionName,
+                        },
+                        user: user,
+                        session: session.data,
+                        params: params
+                    };
+                    if (!dynamicHeader) return [3 /*break*/, 4];
+                    dynamicExtensionFunction = getExtensionFunction(dynamicHeader);
+                    if (!dynamicExtensionFunction) return [3 /*break*/, 4];
+                    _k.label = 1;
+                case 1:
+                    _k.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, dynamicExtensionFunction(event)];
+                case 2:
+                    updatedListData = _k.sent();
+                    if (updatedListData && (updatedListData === null || updatedListData === void 0 ? void 0 : updatedListData.filterApplied) && (updatedListData === null || updatedListData === void 0 ? void 0 : updatedListData.newFilter)) {
+                        queryData = updatedListData === null || updatedListData === void 0 ? void 0 : updatedListData.newFilter;
+                    }
+                    return [3 /*break*/, 4];
+                case 3:
+                    err_1 = _k.sent();
+                    console.error("Error executing onBeforeListDataLoad extension:", err_1);
+                    return [3 /*break*/, 4];
+                case 4:
+                    queryString = qs.stringify(queryData, { encodeValuesOnly: true });
+                    if (latestCustomFilterRef.current) {
+                        url = void 0;
+                        urlData = structuredClone(queryData);
+                        delete urlData.filters;
+                        urlData.custom_filter_predicate = latestCustomFilterRef.current.custom_filter_predicate || null;
+                        urlData.search_predicate = latestCustomFilterRef.current.search_predicate || null;
+                        queryObjectToQueryString(urlData);
+                    }
+                    triggerGetSolidEntities(queryString);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    // handle filter...
+    var handleApplyCustomFilter = function (transformedFilter) {
+        var queryfilter = params.customFilter || {
+            $and: [],
+        };
+        // custom_filter_predicate
+        // search_predicate
+        // saved_filter_predicate
+        // predefined_search_predicate
+        if (transformedFilter.custom_filter_predicate) {
+            queryfilter.$and.push(transformedFilter.custom_filter_predicate);
+        }
+        if (transformedFilter.search_predicate) {
+            queryfilter.$and.push(transformedFilter.search_predicate);
+        }
+        if (transformedFilter.saved_filter_predicate) {
+            queryfilter.$and.push(transformedFilter.saved_filter_predicate);
+        }
+        if (transformedFilter.predefined_search_predicate) {
+            queryfilter.$and.push(transformedFilter.predefined_search_predicate);
+        }
+        var customFilter = transformedFilter;
+        var updatedFilter = __assign(__assign({}, (filters || {})), (queryfilter || {}));
+        // Update refs IMMEDIATELY (synchronously)
+        latestFiltersRef.current = updatedFilter;
+        latestCustomFilterRef.current = transformedFilter;
+        // Then update state
+        setFilters(updatedFilter);
+        setCustomFilter(transformedFilter);
+        // Force synchronous state updates
+    };
+    // clear Filter
+    var clearFilter = function () {
+        if (solidListViewMetaData) {
+            var _a = initialFilterMethod(), sortField_3 = _a.sortField, sortOrder_3 = _a.sortOrder, rows_3 = _a.rows, populate = _a.populate, populateMedia = _a.populateMedia;
+            setRows(rows_3);
+            setSortField(sortField_3);
+            setSortOrder(sortOrder_3);
+            setToPopulate(populate);
+            setToPopulateMedia(populateMedia);
+        }
+        latestFiltersRef.current = {
+            $and: []
+        };
+        setFilters({
+            $and: []
+        });
+        solidGlobalSearchElementRef.current.clearFilter();
+    };
+    var _77 = useState(), selectedSolidViewData = _77[0], setSelectedSolidViewData = _77[1];
+    var selectedDataRef = useRef();
+    var op = useRef(null);
+    var _78 = useState(false), deleteEntity = _78[0], setDeleteEntity = _78[1];
+    // clickable link allowing one to open the detail / form view.
+    var detailsBodyTemplate = function (solidViewData) {
+        return (_jsx("div", { children: _jsx(Button, { type: "button", text: true, size: "small", className: "", onClick: function (e) {
+                    e.stopPropagation();
+                    selectedDataRef.current = solidViewData;
+                    setSelectedSolidViewData(solidViewData);
+                    op.current.toggle(e);
+                }, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "3", height: "10", viewBox: "0 0 4 16", fill: "none", children: _jsx("path", { d: "M4 14C4 14.55 3.80417 15.0208 3.4125 15.4125C3.02083 15.8042 2.55 16 2 16C1.45 16 0.979167 15.8042 0.5875 15.4125C0.195833 15.0208 0 14.55 0 14C0 13.45 0.195833 12.9792 0.5875 12.5875C0.979167 12.1958 1.45 12 2 12C2.55 12 3.02083 12.1958 3.4125 12.5875C3.80417 12.9792 4 13.45 4 14ZM4 8C4 8.55 3.80417 9.02083 3.4125 9.4125C3.02083 9.80417 2.55 10 2 10C1.45 10 0.979167 9.80417 0.5875 9.4125C0.195833 9.02083 0 8.55 0 8C0 7.45 0.195833 6.97917 0.5875 6.5875C0.979167 6.19583 1.45 6 2 6C2.55 6 3.02083 6.19583 3.4125 6.5875C3.80417 6.97917 4 7.45 4 8ZM4 2C4 2.55 3.80417 3.02083 3.4125 3.4125C3.02083 3.80417 2.55 4 2 4C1.45 4 0.979167 3.80417 0.5875 3.4125C0.195833 3.02083 0 2.55 0 2C0 1.45 0.195833 0.979166 0.5875 0.5875C0.979167 0.195833 1.45 0 2 0C2.55 0 3.02083 0.195833 3.4125 0.5875C3.80417 0.979166 4 1.45 4 2Z", fill: "#666666" }) }) }) })
+        // <a onClick={() => {
+        //   if (params.embeded == true) {
+        //     params.handlePopUpOpen(solidViewData.id);
+        //   } else {
+        //     router.push(`${editButtonUrl}/${solidViewData.id}`)
+        //   }
+        // }} rel="noopener noreferrer" className="text-sm font-bold p-0" style={{ color: "#12415D" }}>
+        //   <i className="pi pi-pencil" style={{ fontSize: "1rem" }}></i>
+        // </a>
+        );
+    };
+    // Recover functions
+    var recoverById = function (id) {
+        triggerRecoverSolidEntitiesById(id);
+    };
+    var recoverAll = function () {
+        var recoverList = [];
+        selectedRecoverRecords.forEach(function (element) {
+            recoverList.push(element.id);
+        });
+        triggerRecoverSolidEntities(recoverList);
+        setRecoverDialogVisible(false);
+    };
+    useEffect(function () {
+        var _a;
+        if (recoverByIdIsSuccess && recoverByIdData) {
+            (_a = toast.current) === null || _a === void 0 ? void 0 : _a.show({
+                severity: "success",
+                summary: "Success",
+                detail: recoverByIdData.data.message,
+                life: 3000,
+            });
+            return;
+        }
+        if (recoverByIdIsError && recoverByIdError) {
+            showError(recoverByIdError);
+            return;
+        }
+        if (recoverIsError && recoverError) {
+            showError(recoverError);
+        }
+    }, [recoverByIdIsSuccess, recoverByIdData, recoverByIdIsError, recoverByIdError, recoverIsError, recoverError]);
+    var showError = function (error) { return __awaiter(void 0, void 0, void 0, function () {
+        var errorMessages, messages;
+        var _a, _b;
+        return __generator(this, function (_c) {
+            errorMessages = (_a = error === null || error === void 0 ? void 0 : error.data) === null || _a === void 0 ? void 0 : _a.message;
+            messages = Array.isArray(errorMessages)
+                ? errorMessages
+                : errorMessages
+                    ? [errorMessages]
+                    : [];
+            if (messages.length > 0) {
+                (_b = toast === null || toast === void 0 ? void 0 : toast.current) === null || _b === void 0 ? void 0 : _b.show({
+                    severity: "error",
+                    summary: ERROR_MESSAGES.SEND_REPORT,
+                    sticky: true,
+                    //@ts-ignore
+                    content: function (props) { return (_jsx("div", { className: "flex flex-column align-items-left", style: { flex: "1" }, children: messages.map(function (m, index) { return (_jsx("div", { className: "flex align-items-center gap-2", children: _jsx("span", { className: "font-bold text-900", children: String(m) }) }, index)); }) })); },
+                });
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    var showFieldError = function (error) { return __awaiter(void 0, void 0, void 0, function () {
+        var _a;
+        return __generator(this, function (_b) {
+            if (error) {
+                (_a = toast === null || toast === void 0 ? void 0 : toast.current) === null || _a === void 0 ? void 0 : _a.show({
+                    severity: "error",
+                    summary: ERROR_MESSAGES.SEND_REPORT,
+                    // sticky: true,
+                    life: 3000,
+                    //@ts-ignore
+                    content: function (props) { return (_jsx("div", { className: "flex flex-column align-items-left", style: { flex: "1" }, children: _jsx("div", { className: "flex align-items-center gap-2", children: _jsx("span", { className: "font-bold text-900", children: String(error) }) }) })); },
+                });
+            }
+            return [2 /*return*/];
+        });
+    }); };
+    // handle bulk deletion
+    var deleteBulk = function () {
+        var deleteList = [];
+        selectedRecords.forEach(function (element) {
+            deleteList.push(element.id);
+        });
+        deleteManySolidEntities(deleteList)
+            .unwrap()
+            .then(function () {
+            var _a;
+            (_a = toast.current) === null || _a === void 0 ? void 0 : _a.show({
+                severity: 'success',
+                summary: 'Deleted',
+                detail: ERROR_MESSAGES.RECORD_DELETE,
+                life: 3000
+            });
+            setDialogVisible(false);
+        })
+            .catch(function (error) {
+            var _a, _b;
+            (_a = toast.current) === null || _a === void 0 ? void 0 : _a.show({
+                severity: 'error',
+                summary: 'Delete Failed',
+                detail: (_b = error === null || error === void 0 ? void 0 : error.data) === null || _b === void 0 ? void 0 : _b.message,
+                life: 4000
+            });
+        });
+    };
+    // handle closing of the delete dialog...
+    var onDeleteClose = function () {
+        setDialogVisible(false);
+        setSelectedRecords([]);
+        setSelectedRecoverRecords([]);
+    };
+    var _79 = useState(false), openLightbox = _79[0], setOpenLightbox = _79[1];
+    var _80 = useState({}), lightboxUrls = _80[0], setLightboxUrls = _80[1];
+    var _81 = useState(false), showGlobalSearchElement = _81[0], setShowGlobalSearchElement = _81[1];
+    // Render columns dynamically based on metadata
+    var renderColumnsDynamically = function (solidListViewMetaData, solidListViewLayout) {
+        var _a;
+        if (!solidListViewMetaData) {
+            return;
+        }
+        if (!solidListViewMetaData.data) {
+            return;
+        }
+        var solidView = solidListViewMetaData.data.solidView;
+        var solidFieldsMetadata = solidListViewMetaData.data.solidFieldsMetadata;
+        if (!solidView || !solidFieldsMetadata) {
+            return;
+        }
+        var currentLayout = solidListViewLayout;
+        return (_a = currentLayout.children) === null || _a === void 0 ? void 0 : _a.map(function (column) {
+            var _a;
+            var fieldMetadata = solidFieldsMetadata[column.attrs.name];
+            if (!fieldMetadata) {
+                return;
+            }
+            var visibleToRole = ((_a = column === null || column === void 0 ? void 0 : column.attrs) === null || _a === void 0 ? void 0 : _a.roles) || [];
+            if (visibleToRole.length > 0) {
+                if (hasAnyRole(user === null || user === void 0 ? void 0 : user.roles, visibleToRole)) {
+                    return SolidListViewColumn({
+                        solidListViewMetaData: solidListViewMetaData,
+                        fieldMetadata: fieldMetadata,
+                        column: column,
+                        setLightboxUrls: setLightboxUrls,
+                        setOpenLightbox: setOpenLightbox,
+                    });
+                }
+                else {
+                    return null;
+                }
+            }
+            else {
+                return SolidListViewColumn({
+                    solidListViewMetaData: solidListViewMetaData,
+                    fieldMetadata: fieldMetadata,
+                    column: column,
+                    setLightboxUrls: setLightboxUrls,
+                    setOpenLightbox: setOpenLightbox,
+                });
+            }
+        });
+    };
+    //Note -  Custom Row Action Popup
+    var closeListViewRowActionPopup = function () {
+        setListViewRowActionPopupState(false);
+    };
+    // if (loading || isLoading) {
+    //   return <SolidListViewShimmerLoading />;
+    // }
+    var viewMode = searchParams.get("viewMode");
+    // if (
+    //   (loading || isLoading) && params.embeded == false && viewMode !== "view"
+    // ) {
+    //   return <SolidListViewShimmerLoading />;
+    // }
+    var isListViewEmptyWithoutFilters = !loading &&
+        (!filters || Object.keys(filters).length === 0) &&
+        listViewData.length === 0;
+    // if (isListViewEmptyWithoutFilters) {
+    //   return (
+    //     <SolidEmptyListViewPlaceholder
+    //       createButtonUrl={createButtonUrl}
+    //       actionsAllowed={actionsAllowed}
+    //       params={params}
+    //       solidListViewMetaData={solidListViewMetaData}
+    //     />
+    //   );
+    // }
+    var handleFetchUpdatedRecords = function () {
+        setQueryString();
+    };
+    var handleOpenSolidXAIPanel = function () {
+        setIsOpenSolidXAiPanel(true);
+        localStorage.setItem("l_solidxai_open", "true");
+    };
+    var handleCloseSolidXAIPanel = function () {
+        setIsOpenSolidXAiPanel(false);
+        localStorage.setItem("l_solidxai_open", "false");
+    };
+    var handleDeleteEntity = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var response, error_2;
+        var _a, _b, _c, _d, _e, _f;
+        return __generator(this, function (_g) {
+            switch (_g.label) {
+                case 0:
+                    _g.trys.push([0, 2, , 3]);
+                    if (!(selectedSolidViewData === null || selectedSolidViewData === void 0 ? void 0 : selectedSolidViewData.id)) {
+                        throw new Error(ERROR_MESSAGES.NO_ENTITY_SELECTED);
+                    }
+                    return [4 /*yield*/, deleteSolidSingleEntiry(selectedSolidViewData.id)];
+                case 1:
+                    response = _g.sent();
+                    if (((_a = response === null || response === void 0 ? void 0 : response.data) === null || _a === void 0 ? void 0 : _a.statusCode) === 200) {
+                        setDeleteEntity(false);
+                        (_b = toast.current) === null || _b === void 0 ? void 0 : _b.show(__assign({ severity: "success", summary: ERROR_MESSAGES.DELETED, detail: ERROR_MESSAGES.ENTITY_DELETE }, (severity === "error"
+                            ? { sticky: true } // stays until user closes
+                            : { life: 3000 })));
+                    }
+                    else {
+                        (_c = toast.current) === null || _c === void 0 ? void 0 : _c.show(__assign({ severity: "error", summary: ERROR_MESSAGES.DELETE_FAIELD, detail: (_e = (_d = response === null || response === void 0 ? void 0 : response.error) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.error }, (severity === "error"
+                            ? { sticky: true } // stays until user closes
+                            : { life: 3000 })));
+                    }
+                    return [3 /*break*/, 3];
+                case 2:
+                    error_2 = _g.sent();
+                    (_f = toast.current) === null || _f === void 0 ? void 0 : _f.show(__assign({ severity: "error", summary: ERROR_MESSAGES.DELETE_FAIELD, detail: ERROR_MESSAGES.SOMETHING_WRONG }, (severity === "error"
+                        ? { sticky: true } // stays until user closes
+                        : { life: 3000 })));
+                    return [3 /*break*/, 3];
+                case 3: return [2 /*return*/];
+            }
+        });
+    }); };
+    var isVideoOrAudio = function (url) {
+        var _a;
+        // Remove query params if present
+        var cleanUrl = url.split("?")[0];
+        var ext = (_a = cleanUrl.split(".").pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase();
+        var mediaExt = ["mp4", "webm", "ogg", "mov", "mp3", "wav", "m4a", "aac"];
+        return ext ? mediaExt.includes(ext) : false;
+    };
+    var controlsList = ["nodownload", "nofullscreen", "noremoteplayback"];
+    var slides = Array.isArray(lightboxUrls)
+        ? lightboxUrls.map(function (item) {
+            var url = (item === null || item === void 0 ? void 0 : item.src) || (item === null || item === void 0 ? void 0 : item.downloadUrl) || "";
+            if (isVideoOrAudio(url)) {
+                return {
+                    type: "video",
+                    sources: [{ src: url, type: "video/mp4" }],
+                };
+            }
+            return { src: url };
+        })
+        : [];
+    var hasMedia = slides.some(function (s) { return s.type === "video"; });
+    var hasEditInContextMenu = actionsAllowed.includes("".concat(permissionExpression(params.modelName, 'update'))) &&
+        ((_d = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _d === void 0 ? void 0 : _d.edit) !== false &&
+        ((_e = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _e === void 0 ? void 0 : _e.showDefaultEditButton) !== false &&
+        ((_f = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _f === void 0 ? void 0 : _f.showRowEditInContextMenu) !== false &&
+        !(isDraftPublishWorkflowEnabled && ((_g = selectedDataRef.current) === null || _g === void 0 ? void 0 : _g.publishedAt));
+    var hasDeleteInContextMenu = actionsAllowed.includes("".concat(permissionExpression(params.modelName, 'delete'))) &&
+        ((_h = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _h === void 0 ? void 0 : _h.delete) !== false &&
+        ((_j = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _j === void 0 ? void 0 : _j.showRowDeleteInContextMenu) !== false &&
+        !(isDraftPublishWorkflowEnabled && ((_k = selectedDataRef.current) === null || _k === void 0 ? void 0 : _k.publishedAt));
+    var hasCustomContextMenuButtons = (_m = (_l = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _l === void 0 ? void 0 : _l.rowButtons) === null || _m === void 0 ? void 0 : _m.some(function (rb) { var _a; return ((_a = rb === null || rb === void 0 ? void 0 : rb.attrs) === null || _a === void 0 ? void 0 : _a.actionInContextMenu) === true; });
+    var hasAnyContextMenuActions = hasEditInContextMenu || hasDeleteInContextMenu || hasCustomContextMenuButtons;
+    var toggleBothSidebars = function () {
+        if (visibleNavbar) {
+            dispatch(toggleNavbar()); // close both
+        }
+        else {
+            dispatch(showNavbar()); // open both
+        }
+    };
+    return (_jsxs("div", { className: "page-parent-wrapper flex", children: [_jsxs("div", { className: "h-full flex-grow-1 ".concat(styles.ListContentWrapper), children: [solidListViewInitialMetaData && queryDataLoaded &&
+                        _jsxs("div", { className: "page-header flex-column lg:flex-row", children: [_jsx(Toast, { ref: toast }), _jsxs("div", { className: "flex justify-content-between w-full", children: [_jsxs("div", { className: "flex gap-3 align-items-center w-full ", children: [_jsxs("div", { className: 'flex align-items-center gap-2', 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: ((_q = (_p = (_o = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _o === void 0 ? void 0 : _o.solidView) === null || _p === void 0 ? void 0 : _p.action) === null || _q === void 0 ? void 0 : _q.displayName) || ((_s = (_r = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _r === void 0 ? void 0 : _r.solidView) === null || _s === void 0 ? void 0 : _s.displayName) })] }), ((_t = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _t === void 0 ? void 0 : _t.enableGlobalSearch) === true &&
+                                                    params.embeded === false && (_jsx("div", { className: "hidden lg:flex", children: _jsx(SolidGlobalSearchElement, { showSaveFilterPopup: showSaveFilterPopup, setShowSaveFilterPopup: setShowSaveFilterPopup, filters: filters, clearFilter: clearFilter, ref: solidGlobalSearchElementRef, viewData: solidListViewMetaData, handleApplyCustomFilter: handleApplyCustomFilter }) }))] }), _jsxs("div", { className: "flex align-items-center solid-header-buttons-wrapper", children: [((_u = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _u === void 0 ? void 0 : _u.enableGlobalSearch) === true &&
+                                                    params.embeded === false && (_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); } }) })), _jsx("div", { className: "hidden lg:flex align-items-center solid-header-buttons-wrapper", children: (_x = (_w = (_v = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _v === void 0 ? void 0 : _v.headerButtons) === null || _w === void 0 ? void 0 : _w.filter(function (rb) { return rb.attrs.actionInContextMenu != true; })) === null || _x === void 0 ? void 0 : _x.map(function (button, index) { return (_jsx(SolidListViewHeaderButton, { button: button, params: params, solidListViewMetaData: solidListViewMetaData, handleCustomButtonClick: handleCustomButtonClick, selectedRecords: selectedRecords, filters: filters }, index)); }) }), actionsAllowed.includes("".concat(permissionExpression(params.modelName, 'create'))) &&
+                                                    ((_y = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _y === void 0 ? void 0 : _y.create) !== false &&
+                                                    params.embeded !== true &&
+                                                    ((_1 = (_0 = (_z = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.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.showDefaultAddButton) !== false && (_jsx(SolidCreateButton, { createButtonUrl: createButtonUrl, createActionQueryParams: createActionQueryParams, solidListViewLayout: solidListViewLayout, responsiveIconOnly: true })), actionsAllowed.includes("".concat(permissionExpression(params.modelName, 'create'))) &&
+                                                    ((_2 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _2 === void 0 ? void 0 : _2.create) !== false &&
+                                                    params.embeded == true &&
+                                                    params.inlineCreate == true &&
+                                                    searchParams.get("viewMode") !== "view" && (_jsx(Button, { type: "button", icon: ((_3 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _3 === void 0 ? void 0 : _3.addButtonIcon) ? (_4 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _4 === void 0 ? void 0 : _4.addButtonIcon : "pi pi-plus", label: ((_5 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _5 === void 0 ? void 0 : _5.addButtonTitle) ? (_6 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _6 === void 0 ? void 0 : _6.addButtonTitle : "Add", className: "".concat((_7 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _7 === void 0 ? void 0 : _7.addButtonClassName), size: "small", onClick: function () { return params.handlePopUpOpen("new"); } })), params.embeded !== true && (_jsx(Button, { type: "button", size: "small", icon: "pi pi-refresh", severity: "secondary", className: "solid-icon-button ", outlined: true, onClick: function () {
+                                                        setQueryString();
+                                                    } })), showArchived && (_jsx(Button, { type: "button", icon: "pi pi-refresh", label: "Recover", size: "small", severity: "secondary", className: "hidden lg:flex solid-icon-button ", onClick: function () { return setRecoverDialogVisible(true); } })), params.embeded === false &&
+                                                    ((_8 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _8 === void 0 ? void 0 : _8.configureView) !== false && (_jsx(SolidListViewConfigure, { listViewMetaData: solidListViewMetaData, solidListViewLayout: solidListViewLayout, setShowArchived: setShowArchived, showArchived: showArchived, viewData: solidListViewMetaData, sizeOptions: sizeOptions, setSize: setSize, size: size, viewModes: viewModes, params: params, actionsAllowed: actionsAllowed, selectedRecords: selectedRecords, setDialogVisible: setDialogVisible, setShowSaveFilterPopup: setShowSaveFilterPopup, filters: filters, handleFetchUpdatedRecords: handleFetchUpdatedRecords, setRecoverDialogVisible: setRecoverDialogVisible }))] })] }), ((_9 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _9 === void 0 ? void 0 : _9.enableGlobalSearch) === true && showGlobalSearchElement &&
+                                    params.embeded === false && (_jsx("div", { className: "flex lg:hidden", children: _jsx(SolidGlobalSearchElement, { showSaveFilterPopup: showSaveFilterPopup, setShowSaveFilterPopup: setShowSaveFilterPopup, filters: filters, clearFilter: clearFilter, ref: solidGlobalSearchElementRef, viewData: solidListViewMetaData, handleApplyCustomFilter: handleApplyCustomFilter }) }))] }), (loading || isLoading) && params.embeded == false && viewMode !== "view" ?
+                        _jsx(SolidListViewShimmerLoading, {})
+                        :
+                            _jsx(_Fragment, { children: isListViewEmptyWithoutFilters ? (_jsx(SolidEmptyListViewPlaceholder, { createButtonUrl: createButtonUrl, createActionQueryParams: createActionQueryParams, actionsAllowed: actionsAllowed, params: params, solidListViewMetaData: solidListViewMetaData })) : (_jsx("div", { className: "solid-datatable-wrapper flex-1 min-h-0 overflow-auto", children: _jsxs(DataTable, { value: listViewData, rowClassName: function (rowData) {
+                                            return rowData.deletedAt ? "greyed-out-row" : "";
+                                        }, showGridlines: false, lazy: true, scrollable: true, 
+                                        // scrollHeight="90vh"
+                                        size: size, resizableColumns: true, columnResizeMode: "expand", paginator: true, rows: rows, rowsPerPageOptions: (_10 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _10 === void 0 ? void 0 : _10.pageSizeOptions, dataKey: "id", emptyMessage: ((_13 = (_12 = (_11 = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _11 === void 0 ? void 0 : _11.solidView) === null || _12 === void 0 ? void 0 : _12.model) === null || _13 === void 0 ? void 0 : _13.description) ||
+                                            "No Entities found", filterDisplay: "menu", totalRecords: totalRecords, first: first, onPage: onPageChange, onSort: function (e) { return onSort(e); }, sortField: sortField, sortOrder: sortOrder === 1 || sortOrder === -1 ? sortOrder : 0, loading: false, 
+                                        // loading={loading || isLoading}
+                                        // loadingIcon="pi pi-spinner"
+                                        selection: params.embeded === true
+                                            ? null
+                                            : __spreadArray(__spreadArray([], selectedRecords, true), selectedRecoverRecords, true), onSelectionChange: params.embeded === true ? undefined : onSelectionChange, selectionMode: params.embeded === true ? null : "checkbox", removableSort: true, filterIcon: _jsx(FilterIcon, {}), tableClassName: "solid-data-table", paginatorClassName: "solid-paginator", paginatorTemplate: "RowsPerPageDropdown CurrentPageReport PrevPageLink NextPageLink", currentPageReportTemplate: "{first} - {last} of {totalRecords}", onRowClick: function (e) {
+                                            var _a, _b;
+                                            var rowData = e.data;
+                                            if (((_a = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _a === void 0 ? void 0 : _a.disableRowClick) === true)
+                                                return;
+                                            var hasFindPermission = actionsAllowed.includes(permissionExpression(params.modelName, 'findOne'));
+                                            var hasUpdatePermission = actionsAllowed.includes(permissionExpression(params.modelName, 'update')) &&
+                                                ((_b = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _b === void 0 ? void 0 : _b.edit) !== false;
+                                            if (!(hasFindPermission || hasUpdatePermission))
+                                                return;
+                                            if (params.embeded === true) {
+                                                params.handlePopUpOpen(rowData === null || rowData === void 0 ? void 0 : rowData.id);
+                                            }
+                                            else {
+                                                if (typeof window !== "undefined") {
+                                                    // store a simple marker for the caller
+                                                    // also store the full current URL so Back can restore exact state (including action params)
+                                                    try {
+                                                        sessionStorage.setItem("fromView", "list");
+                                                        sessionStorage.setItem("fromViewUrl", window.location.pathname + window.location.search);
+                                                    }
+                                                    catch (e) {
+                                                        // ignore storage errors
+                                                    }
+                                                }
+                                                router.push("".concat(editBaseUrl, "/").concat(rowData === null || rowData === void 0 ? void 0 : rowData.id, "?viewMode=view&").concat(new URLSearchParams(editActionQueryParams).toString()));
+                                            }
+                                        }, children: [params.embeded === true ? null : (_jsx(Column, { selectionMode: "multiple", headerStyle: { width: "3em" } })), solidListViewMetaData && solidListViewLayout && renderColumnsDynamically(solidListViewMetaData, solidListViewLayout), ((_14 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _14 === void 0 ? void 0 : _14.rowButtons) &&
+                                                ((_15 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _15 === void 0 ? void 0 : _15.rowButtons.filter(function (rb) {
+                                                    var _a, _b;
+                                                    var roles = ((_a = rb === null || rb === void 0 ? void 0 : rb.attrs) === null || _a === void 0 ? void 0 : _a.roles) || [];
+                                                    var isInContextMenu = rb.attrs.actionInContextMenu === true;
+                                                    // Only check hasAnyRole if roles are provided
+                                                    var isAllowed = roles.length === 0 ||
+                                                        hasAnyRole(user === null || user === void 0 ? void 0 : user.roles, roles);
+                                                    var isVisible = ((_b = rb === null || rb === void 0 ? void 0 : rb.attrs) === null || _b === void 0 ? void 0 : _b.visible) !== false;
+                                                    return !isInContextMenu && isAllowed && isVisible;
+                                                }).map(function (button, index) {
+                                                    return (_jsx(Column, { header: button.attrs.label, body: function (rowData) {
+                                                            var _a, _b, _c, _d;
+                                                            return (_jsx(Button, { type: "button", icon: ((_a = button === null || button === void 0 ? void 0 : button.attrs) === null || _a === void 0 ? void 0 : _a.icon)
+                                                                    ? (_b = button === null || button === void 0 ? void 0 : button.attrs) === null || _b === void 0 ? void 0 : _b.icon
+                                                                    : "pi pi-pencil", className: "w-full text-left gap-2 ".concat(((_c = button === null || button === void 0 ? void 0 : button.attrs) === null || _c === void 0 ? void 0 : _c.className)
+                                                                    ? (_d = button === null || button === void 0 ? void 0 : button.attrs) === null || _d === void 0 ? void 0 : _d.className
+                                                                    : ""), label: button.attrs.showLabel !== false
+                                                                    ? button.attrs.label
+                                                                    : "", size: "small", iconPos: "left", onClick: function () {
+                                                                    var event = {
+                                                                        params: params,
+                                                                        rowData: rowData,
+                                                                        solidListViewMetaData: solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data,
+                                                                    };
+                                                                    handleCustomButtonClick(button.attrs, event);
+                                                                } }));
+                                                        } }, index));
+                                                })), actionsAllowed.includes("".concat(permissionExpression(params.modelName, 'update'))) &&
+                                                ((_16 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _16 === void 0 ? void 0 : _16.edit) !== false &&
+                                                ((_17 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _17 === void 0 ? void 0 : _17.showRowEditInContextMenu) ===
+                                                    false && (_jsx(Column, { header: "Edit", body: function (rowData) {
+                                                    var shouldHideEditOrDeleteButton = isDraftPublishWorkflowEnabled && (rowData === null || rowData === void 0 ? void 0 : rowData.publishedAt);
+                                                    return (_jsx(_Fragment, { children: !shouldHideEditOrDeleteButton && (_jsx(Button, { text: true, type: "button", severity: "secondary", className: "", label: "", size: "small", iconPos: "left", icon: "pi pi-pencil", onClick: function () {
+                                                                if (params.embeded == true) {
+                                                                    params.handlePopUpOpen(rowData === null || rowData === void 0 ? void 0 : rowData.id);
+                                                                }
+                                                                else {
+                                                                    if (typeof window !== "undefined") {
+                                                                        try {
+                                                                            sessionStorage.setItem("fromView", "list");
+                                                                            sessionStorage.setItem("fromViewUrl", window.location.pathname + window.location.search);
+                                                                        }
+                                                                        catch (e) { }
+                                                                    }
+                                                                    router.push("".concat(editBaseUrl, "/").concat(rowData === null || rowData === void 0 ? void 0 : rowData.id, "?viewMode=edit&").concat(new URLSearchParams(editActionQueryParams).toString()));
+                                                                }
+                                                            } })) }));
+                                                } })), actionsAllowed.includes("".concat(permissionExpression(params.modelName, 'delete'))) &&
+                                                ((_18 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _18 === void 0 ? void 0 : _18.delete) !== false &&
+                                                ((_19 = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _19 === void 0 ? void 0 : _19.showRowDeleteInContextMenu) ===
+                                                    false && (_jsx(Column, { header: "Delete", body: function (rowData) {
+                                                    var shouldHideEditOrDeleteButton = isDraftPublishWorkflowEnabled && (rowData === null || rowData === void 0 ? void 0 : rowData.publishedAt);
+                                                    return (_jsx(_Fragment, { children: !shouldHideEditOrDeleteButton && (_jsx(Button, { text: true, type: "button", className: "", size: "small", iconPos: "left", severity: "danger", icon: "pi pi-trash", onClick: function () {
+                                                                setSelectedSolidViewData(rowData);
+                                                                setDeleteEntity(true);
+                                                            } })) }));
+                                                } })), hasAnyContextMenuActions && (_jsx(Column, { frozen: true, alignFrozen: "right", body: function (rowData) {
+                                                    var _a, _b, _c;
+                                                    return (rowData === null || rowData === void 0 ? void 0 : rowData.deletedAt) ? (_jsx("a", { onClick: function (event) {
+                                                            event.stopPropagation();
+                                                            recoverById(rowData.id);
+                                                        }, className: "retrieve-button", children: _jsx("i", { className: "pi pi-refresh", style: { fontSize: "1rem" } }) })) : (_jsx(_Fragment, { children: ((_a = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _a === void 0 ? void 0 : _a.showRowContextMenu) !==
+                                                            false && (_jsxs(_Fragment, { children: [detailsBodyTemplate(rowData), _jsx(OverlayPanel, { ref: op, className: "solid-custom-overlay", style: { top: 10, minWidth: 120 }, children: _jsxs("div", { className: "flex flex-column gap-1 p-1", children: [hasEditInContextMenu && (_jsx(Button, { type: "button", className: "w-full text-left gap-1", label: "Edit", size: "small", iconPos: "left", icon: "pi pi-pencil", onClick: function () {
+                                                                                    var _a, _b;
+                                                                                    if (params.embeded == true) {
+                                                                                        params.handlePopUpOpen((_a = selectedDataRef.current) === null || _a === void 0 ? void 0 : _a.id);
+                                                                                    }
+                                                                                    else {
+                                                                                        try {
+                                                                                            sessionStorage.setItem("fromView", "list");
+                                                                                            sessionStorage.setItem("fromViewUrl", window.location.pathname + window.location.search);
+                                                                                        }
+                                                                                        catch (e) { }
+                                                                                        router.push("".concat(editBaseUrl, "/").concat((_b = selectedDataRef.current) === null || _b === void 0 ? void 0 : _b.id, "?viewMode=edit&").concat(new URLSearchParams(editActionQueryParams).toString()));
+                                                                                    }
+                                                                                } })), hasDeleteInContextMenu && (_jsx(Button, { text: true, type: "button", className: "w-full text-left gap-1", label: "Delete", size: "small", iconPos: "left", severity: "danger", icon: "pi pi-trash", onClick: function () { return setDeleteEntity(true); } })), hasCustomContextMenuButtons && ((_c = (_b = solidListViewLayout === null || solidListViewLayout === void 0 ? void 0 : solidListViewLayout.attrs) === null || _b === void 0 ? void 0 : _b.rowButtons) === null || _c === void 0 ? void 0 : _c.filter(function (rb) {
+                                                                                var _a, _b;
+                                                                                return ((_a = rb === null || rb === void 0 ? void 0 : rb.attrs) === null || _a === void 0 ? void 0 : _a.actionInContextMenu) === true &&
+                                                                                    ((_b = rb === null || rb === void 0 ? void 0 : rb.attrs) === null || _b === void 0 ? void 0 : _b.visible) !== false;
+                                                                            }).map(function (button, index) {
+                                                                                var _a;
+                                                                                return (_jsx(SolidListViewRowButtonContextMenu, { button: button, params: params, getSelectedSolidViewData: function () { return selectedDataRef.current; }, 
+                                                                                    // selectedSolidViewData={selectedSolidViewData}
+                                                                                    solidListViewMetaData: solidListViewMetaData, handleCustomButtonClick: handleCustomButtonClick }, "".concat(index, "-").concat(((_a = selectedDataRef === null || selectedDataRef === void 0 ? void 0 : selectedDataRef.current) === null || _a === void 0 ? void 0 : _a.id) || '')));
+                                                                            }))] }) })] })) }));
+                                                } }))] }) })) })] }), mcpUrl &&
+                params.embeded !== true && (_jsxs("div", { className: "chatter-section ".concat(isOpenSolidXAiPanel === false ? "collapsed" : "open"), style: { width: chatterWidth }, children: [isOpenSolidXAiPanel && (_jsx("div", { style: {
+                            width: 5,
+                            cursor: "col-resize",
+                            position: "absolute",
+                            left: 0,
+                            top: 0,
+                            bottom: 0,
+                            height: "100%",
+                            zIndex: 9,
+                        }, onMouseDown: function () { return setIsResizing(true); } })), isOpenSolidXAiPanel && (_jsx(Button, { icon: "pi pi-angle-double-right", size: "small", text: true, className: "chatter-collapse-btn", style: { width: 30, height: 30, aspectRatio: "1/1" }, onClick: handleCloseSolidXAIPanel })), isOpenSolidXAiPanel === false ? (_jsxs("div", { className: "flex flex-column gap-2 justify-content-center p-2", children: [_jsx("div", { className: "chatter-collapsed-content", onClick: handleOpenSolidXAIPanel, children: _jsxs("div", { className: "flex gap-2", children: [" ", _jsx(SolidXAIIcon, {}), " SolidX AI", " "] }) }), _jsx(Button, { icon: "pi pi-chevron-left", size: "small", className: "px-0", style: { width: 30 }, onClick: handleOpenSolidXAIPanel })] })) : (_jsx(SolidAiMainWrapper, { mcpUrl: mcpUrl }))] })), _jsxs(Dialog, { visible: isDialogVisible, header: "Confirm Delete", onHide: function () { return setDialogVisible(false); }, headerClassName: "py-2", contentClassName: "px-0 pb-0", 
+                // style={{ width: '20vw' }}
+                breakpoints: { '1199px': '30rem', '550px': '85vw' }, children: [_jsx(Divider, { className: "m-0" }), _jsxs("div", { className: "p-4", children: [_jsx("p", { className: "m-0 solid-primary-title", style: { fontSize: 16 }, children: "Are you sure you want to delete the selected records?" }), _jsxs("div", { className: "flex align-items-center gap-2 mt-3", children: [_jsx(Button, { label: "Delete", severity: "danger", size: "small", onClick: handleDeleteEntity, autoFocus: true, onClick: deleteBulk }), _jsx(Button, { label: "Cancel", size: "small", onClick: onDeleteClose, outlined: true, className: 'bg-primary-reverse' })] })] })] }), _jsx(Dialog, { visible: isRecoverDialogVisible, header: "Confirm Recover", 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", severity: "danger", autoFocus: true, onClick: recoverAll }), _jsx(Button, { label: "No", icon: "pi pi-times", onClick: function () { return setRecoverDialogVisible(false); } })] })); }, onHide: function () { return setRecoverDialogVisible(false); }, children: _jsx("p", { children: "Are you sure you want to recover all records?" }) }), listViewRowActionData && (_jsx(Dialog, { visible: listViewRowActionPopupState, modal: true, onHide: closeListViewRowActionPopup, children: _jsx(ListViewRowActionPopup, { context: listViewRowActionData }) })), _jsxs(Dialog, { header: "Delete ".concat(((_22 = (_21 = (_20 = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _20 === void 0 ? void 0 : _20.solidView) === null || _21 === void 0 ? void 0 : _21.model) === null || _22 === void 0 ? void 0 : _22.displayName)
+                    ? (_25 = (_24 = (_23 = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _23 === void 0 ? void 0 : _23.solidView) === null || _24 === void 0 ? void 0 : _24.model) === null || _25 === void 0 ? void 0 : _25.displayName
+                    : params === null || params === void 0 ? void 0 : params.modelName), headerClassName: "py-2", contentClassName: "px-0 pb-0", visible: deleteEntity, style: { width: "20vw" }, onHide: function () {
+                    if (!deleteEntity)
+                        return;
+                    setDeleteEntity(false);
+                }, className: "solid-confirm-dialog", children: [_jsx(Divider, { className: "m-0" }), _jsxs("div", { className: "p-4", children: [_jsx("p", { className: "m-0 solid-primary-title", style: { fontSize: 16 }, children: "Are you sure you want to delete this ".concat(((_28 = (_27 = (_26 = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _26 === void 0 ? void 0 : _26.solidView) === null || _27 === void 0 ? void 0 : _27.model) === null || _28 === void 0 ? void 0 : _28.displayName)
+                                    ? (_31 = (_30 = (_29 = solidListViewMetaData === null || solidListViewMetaData === void 0 ? void 0 : solidListViewMetaData.data) === null || _29 === void 0 ? void 0 : _29.solidView) === null || _30 === void 0 ? void 0 : _30.model) === null || _31 === void 0 ? void 0 : _31.displayName
+                                    : params === null || params === void 0 ? void 0 : params.modelName, "?") }), _jsxs("div", { className: "flex align-items-center gap-2 mt-3", children: [_jsx(Button, { label: "Delete", severity: "danger", size: "small", onClick: handleDeleteEntity }), _jsx(Button, { label: "Cancel", size: "small", onClick: function () { return setDeleteEntity(false); }, outlined: true, className: 'bg-primary-reverse' })] })] })] }), openLightbox && (_jsx(Lightbox, __assign({ open: openLightbox, plugins: hasMedia
+                    ? [Counter, Download, Video] // add Video plugin if needed
+                    : [Counter, Download], close: function () { return setOpenLightbox(false); }, slides: __spreadArray([], slides, true) }, (hasMedia && {
+                video: {
+                    controls: true,
+                    playsInline: true,
+                    autoPlay: false,
+                    loop: false,
+                    muted: false,
+                    disablePictureInPicture: false,
+                    disableRemotePlayback: false,
+                    controlsList: controlsList.join(" "),
+                    crossOrigin: "anonymous",
+                    preload: "auto",
+                },
+            }))))] }));
+};
+//# sourceMappingURL=SolidListView.js.map