@solidxai/core-ui 0.1.3 → 0.1.4-beta.1

package/dist/components/core/form/fields/relations/widgets/helpers/useRelationEntityHandler.ts

@@ -2,7 +2,13 @@ import { useState } from "react";
 import qs from "qs";
 import { createSolidEntityApi } from "../../../../../../../redux/api/solidEntityApi";
 
-export const useRelationEntityHandler = ({ fieldContext, formik, autoCompleteLimit = 1000 }: any) => {
+export type RelationItem = {
+  label: string;
+  value: any;
+  original?: any;
+};
+
+export const useRelationEntityHandler = ({ fieldContext, autoCompleteLimit = 1000 }: any) => {
   const fieldMetadata = fieldContext.fieldMetadata;
   const fieldLayoutInfo = fieldContext.field;
 
@@ -10,55 +16,180 @@ export const useRelationEntityHandler = ({ fieldContext, formik, autoCompleteLim
   const { useLazyGetSolidEntitiesQuery } = entityApi;
   const [triggerGetSolidEntities] = useLazyGetSolidEntitiesQuery();
 
-  const [autoCompleteItems, setAutoCompleteItems] = useState([]);
+  const parentEntityApi = createSolidEntityApi(fieldContext.modelName);
+  const { usePatchUpdateSolidEntityMutation, useUpdateSolidEntityMutation } = parentEntityApi;
+  const [updateSolidEntity] = usePatchUpdateSolidEntityMutation();
 
-  const fetchRelationEntities = async (autocompleteQs = "", limit = autoCompleteLimit) => {
-    // const queryData = {
-    //   offset: 0,
-    //   limit: limit,
-    //   filters: {
-    //     [fieldMetadata?.relationModel?.userKeyField?.name]: {
-    //       '$containsi': query
-    //     }
-    //   }
-    // };
+  /**
+   * AUTOCOMPLETE & CHECKBOX:
+   * The currently linked items — drives what chips are shown in the autocomplete
+   * and which checkboxes are checked.
+   */
+  const [currentValues, setCurrentValues] = useState<RelationItem[]>([]);
 
-    // const autocompleteQs = qs.stringify(queryData, { encodeValuesOnly: true });
+  /**
+   * CHECKBOX ONLY:
+   * All possible options to render as checkboxes.
+   * For autocomplete this is not needed — options are fetched on user search input.
+   */
+  const [allOptions, setAllOptions] = useState<RelationItem[]>([]);
 
-    const response = await triggerGetSolidEntities(autocompleteQs);
-    const data = response.data;
-
-    if (data) {
-      const mappedItems = data.records.map((item: any) => ({
-        label: item[fieldMetadata?.relationModel?.userKeyField?.name],
-        value: item['id'],
-        original: item
-      }));
-      setAutoCompleteItems(mappedItems);
+  /**
+   * AUTOCOMPLETE ONLY:
+   * The live suggestion list shown in the dropdown while the user is typing.
+   * Populated by `fetchSuggestions` on each keystroke.
+   */
+  const [suggestions, setSuggestions] = useState<RelationItem[]>([]);
+
+  // ─── Internal ────────────────────────────────────────────────────────────────
+
+  const sendLinkCommand = async (item: RelationItem, command: "link" | "unlink") => {
+    const parentId = fieldContext.data?.id;
+    const fieldName = fieldLayoutInfo.attrs.name;
+
+    if (!parentId || parentId === "new") return;
+
+    const formData = new FormData();
+    formData.append(`${fieldName}Ids[0]`, item.value);
+    formData.append(`${fieldName}Command`, command);
+
+    await updateSolidEntity({ id: parentId, data: formData }).unwrap();
+  };
+
+  // ─── Shared ──────────────────────────────────────────────────────────────────
+
+  /**
+   * Fetch currently linked items and populate `currentValues`.
+   * Call on mount for both autocomplete and checkbox widgets.
+   */
+  const fetchCurrentValues = async () => {
+    const relationFieldName =
+      fieldContext.fieldMetadata?.relationCoModelFieldName ?? fieldContext.modelName;
+
+    const parentId = fieldContext.data?.id ?? -1;
+
+    const queryData = {
+      offset: 0,
+      limit: autoCompleteLimit,
+      filters: {
+        $and: [{ [relationFieldName]: { id: { $eq: parentId } } }],
+      },
+    };
+
+    const response = await triggerGetSolidEntities(qs.stringify(queryData, { encodeValuesOnly: true }));
+    if (!response.data) return;
+
+    const mapped: RelationItem[] = response.data.records.map((item: any) => ({
+      label: item[fieldMetadata?.relationModel?.userKeyField?.name],
+      value: item.id,
+      original: item,
+    }));
+
+    setCurrentValues(mapped);
+  };
+
+  /**
+   * Link an item: fire the API call, and on success update `currentValues`.
+   * Used by both autocomplete (onSelect) and checkbox (onChange when unchecked).
+   */
+  const linkItem = async (item: RelationItem) => {
+    try {
+      await sendLinkCommand(item, "link");
+      setCurrentValues((prev) =>
+        prev.some((s) => s.value === item.value) ? prev : [...prev, item]
+      );
+    } catch (error: any) {
+      console.error(error?.data?.message || error?.message || `Failed to link ${fieldMetadata.displayName}`);
     }
   };
 
-  const addNewRelation = (values: any) => {
-    const currentData = formik.values[fieldLayoutInfo.attrs.name] || [];
+  /**
+   * Unlink an item: fire the API call, and on success update `currentValues`.
+   * Used by both autocomplete (onUnselect) and checkbox (onChange when checked).
+   */
+  const unlinkItem = async (item: RelationItem) => {
+    try {
+      await sendLinkCommand(item, "unlink");
+      setCurrentValues((prev) => prev.filter((s) => s.value !== item.value));
+    } catch (error: any) {
+      console.error(error?.data?.message || error?.message || `Failed to unlink ${fieldMetadata.displayName}`);
+    }
+  };
+
+  // ─── Autocomplete-specific ───────────────────────────────────────────────────
+
+  /**
+   * Fetch suggestions for the autocomplete dropdown based on the user's search query.
+   * Call this inside `completeMethod` of the AutoComplete component.
+   */
+  const fetchSuggestions = async (autocompleteQs = "") => {
+    const response = await triggerGetSolidEntities(autocompleteQs);
+    if (!response.data) return;
+
+    const mapped: RelationItem[] = response.data.records.map((item: any) => ({
+      label: item[fieldMetadata?.relationModel?.userKeyField?.name],
+      value: item["id"],
+      original: item,
+    }));
+
+    setSuggestions(mapped);
+  };
+
+  // ─── Checkbox-specific ───────────────────────────────────────────────────────
+
+  /**
+   * Fetch all possible options for the checkbox list.
+   * Call this on mount for the checkbox widget.
+   */
+  const fetchAllOptions = async (autocompleteQs = "") => {
+    const response = await triggerGetSolidEntities(autocompleteQs);
+    if (!response.data) return;
+
+    const mapped: RelationItem[] = response.data.records.map((item: any) => ({
+      label: item[fieldMetadata?.relationModel?.userKeyField?.name],
+      value: item["id"],
+      original: item,
+    }));
+
+    setAllOptions(mapped);
+  };
+
+  // ─── Inline create ───────────────────────────────────────────────────────────
+
+  /**
+   * Handle an inline-created entity: link it and add to both `currentValues`
+   * and `allOptions` (so it shows up in the checkbox list immediately).
+   */
+  const addNewRelation = async (values: any) => {
     const jsonValues = Object.fromEntries(values.entries());
-    const newItem = {
+    const newItem: RelationItem = {
       label: jsonValues[fieldMetadata?.relationModel?.userKeyField?.name],
       value: "new",
       original: jsonValues,
     };
 
-    formik.setFieldValue(fieldLayoutInfo.attrs.name, [...currentData, newItem]);
+    await linkItem(newItem);
 
-    // Optionally add to autocomplete list
-    setAutoCompleteItems((prev: any) => {
-      const exists = prev.some((item: any) => item.label === newItem.label);
-      return exists ? prev : [...prev, newItem];
-    });
+    // Also add to allOptions so checkbox widget shows the new item
+    setAllOptions((prev) =>
+      prev.some((s) => s.value === newItem.value) ? prev : [...prev, newItem]
+    );
   };
 
   return {
-    autoCompleteItems,
-    fetchRelationEntities,
-    addNewRelation
+    // State
+    currentValues,
+    allOptions,
+    suggestions,
+    // Shared
+    fetchCurrentValues,
+    linkItem,
+    unlinkItem,
+    // Autocomplete-specific
+    fetchSuggestions,
+    // Checkbox-specific
+    fetchAllOptions,
+    // Inline create
+    addNewRelation,
   };
-};
+};

package/dist/components/core/kanban/SolidKanbanView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidKanbanView.d.ts","sourceRoot":"","sources":["../../../../src/components/core/kanban/SolidKanbanView.tsx"],"names":[],"mappings":"AAoBA,OAAO,uCAAuC,CAAC;AAC/C,OAAO,gDAAgD,CAAC;AAaxD,KAAK,qBAAqB,GAAG;IAC3B,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC;AAGF,eAAO,MAAM,eAAe,WAAY,qBAAqB,4CAizB5D,CAAC"}
+{"version":3,"file":"SolidKanbanView.d.ts","sourceRoot":"","sources":["../../../../src/components/core/kanban/SolidKanbanView.tsx"],"names":[],"mappings":"AAoBA,OAAO,uCAAuC,CAAC;AAC/C,OAAO,gDAAgD,CAAC;AAaxD,KAAK,qBAAqB,GAAG;IAC3B,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC;AAGF,eAAO,MAAM,eAAe,WAAY,qBAAqB,4CAkzB5D,CAAC"}

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

@@ -80,7 +80,7 @@ import { useRouter } from "../../../hooks/useRouter";
 import { SolidKanbanViewConfigure } from "./SolidKanbanViewConfigure";
 import { KanbanUserViewLayout } from "./KanbanUserViewLayout";
 import { useDispatch, useSelector } from "react-redux";
-import { queryObjectToQueryString, queryStringToQueryObject } from "../list/SolidListView";
+import { setFilterObjectToLocalStorage, getFilterObjectFromLocalStorage } from "../list/SolidListView";
 import { Toast } from "primereact/toast";
 import { ERROR_MESSAGES } from "../../../constants/error-messages";
 import { showNavbar, toggleNavbar } from "../../../redux/features/navbarSlice";
@@ -222,13 +222,14 @@ export var SolidKanbanView = function (params) {
     };
     // Initial Filter data 
     useEffect(function () {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j;
         if (solidKanbanViewMetaData) {
             setKanbanViewMetaData(solidKanbanViewMetaData);
-            var viewModes_1 = ((_d = (_c = (_b = (_a = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _a === void 0 ? void 0 : _a.solidView) === null || _b === void 0 ? void 0 : _b.layout) === null || _c === void 0 ? void 0 : _c.attrs) === null || _d === void 0 ? void 0 : _d.allowedViews) && ((_h = (_g = (_f = (_e = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _e === void 0 ? void 0 : _e.solidView) === null || _f === void 0 ? void 0 : _f.layout) === null || _g === void 0 ? void 0 : _g.attrs) === null || _h === void 0 ? void 0 : _h.allowedViews.length) > 0 && ((_m = (_l = (_k = (_j = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _j === void 0 ? void 0 : _j.solidView) === null || _k === void 0 ? void 0 : _k.layout) === null || _l === void 0 ? void 0 : _l.attrs) === null || _m === void 0 ? void 0 : _m.allowedViews.map(function (view) { return { label: capitalize(view), value: view }; }));
-            setViewModes(viewModes_1);
-            if (((_r = (_q = (_p = (_o = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _o === void 0 ? void 0 : _o.solidView) === null || _p === void 0 ? void 0 : _p.layout) === null || _q === void 0 ? void 0 : _q.attrs) === null || _r === void 0 ? void 0 : _r.grouped) !== false) {
-                setGroupByFieldName((_v = (_u = (_t = (_s = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _s === void 0 ? void 0 : _s.solidView) === null || _t === void 0 ? void 0 : _t.layout) === null || _u === void 0 ? void 0 : _u.attrs) === null || _v === void 0 ? void 0 : _v.groupBy);
+            // const viewModes = solidKanbanViewMetaData?.data?.solidView?.layout?.attrs?.allowedViews && solidKanbanViewMetaData?.data?.solidView?.layout?.attrs?.allowedViews.length > 0 && solidKanbanViewMetaData?.data?.solidView?.layout?.attrs?.allowedViews.map((view: any) => { return { label: capitalize(view), value: view } });
+            setViewModes((_a = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _a === void 0 ? void 0 : _a.viewModes);
+            // setViewModes(viewModes);
+            if (((_e = (_d = (_c = (_b = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _b === void 0 ? void 0 : _b.solidView) === null || _c === void 0 ? void 0 : _c.layout) === null || _d === void 0 ? void 0 : _d.attrs) === null || _e === void 0 ? void 0 : _e.grouped) !== false) {
+                setGroupByFieldName((_j = (_h = (_g = (_f = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _f === void 0 ? void 0 : _f.solidView) === null || _g === void 0 ? void 0 : _g.layout) === null || _h === void 0 ? void 0 : _h.attrs) === null || _j === void 0 ? void 0 : _j.groupBy);
             }
             else {
                 setGroupByFieldName("deletedTracker");
@@ -320,7 +321,7 @@ export var SolidKanbanView = function (params) {
         if (solidKanbanViewMetaData) {
             var swimlanesCount = ((_c = (_b = (_a = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data.solidView) === null || _a === void 0 ? void 0 : _a.layout) === null || _b === void 0 ? void 0 : _b.attrs) === null || _c === void 0 ? void 0 : _c.swimlanesCount) || 5;
             if (groupByFieldName) {
-                var queryObject = queryStringToQueryObject();
+                var queryObject = getFilterObjectFromLocalStorage();
                 var queryString = "";
                 if (queryObject) {
                     var filters_1 = {
@@ -676,7 +677,7 @@ export var SolidKanbanView = function (params) {
                             // @ts-ignore
                             urlData.search_predicate = customFilter.search_predicate || {};
                             // @ts-ignore
-                            queryObjectToQueryString(urlData);
+                            setFilterObjectToLocalStorage(urlData);
                         }
                         return [4 /*yield*/, triggerGetSolidEntities(queryString)];
                     case 1:
@@ -699,8 +700,8 @@ export var SolidKanbanView = function (params) {
         if (solidKanbanViewMetaData) {
             var createActionUrl = ((_d = (_c = (_b = (_a = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _a === void 0 ? void 0 : _a.solidView) === null || _b === void 0 ? void 0 : _b.layout) === null || _c === void 0 ? void 0 : _c.attrs) === null || _d === void 0 ? void 0 : _d.createAction) && ((_j = (_h = (_g = (_f = (_e = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _e === void 0 ? void 0 : _e.solidView) === null || _f === void 0 ? void 0 : _f.layout) === null || _g === void 0 ? void 0 : _g.attrs) === null || _h === void 0 ? void 0 : _h.createAction) === null || _j === void 0 ? void 0 : _j.type) === "custom" ? (_p = (_o = (_m = (_l = (_k = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _k === void 0 ? void 0 : _k.solidView) === null || _l === void 0 ? void 0 : _l.layout) === null || _m === void 0 ? void 0 : _m.attrs) === null || _o === void 0 ? void 0 : _o.createAction) === null || _p === void 0 ? void 0 : _p.customComponent : "form/new";
             var editActionUrl = ((_t = (_s = (_r = (_q = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _q === void 0 ? void 0 : _q.solidView) === null || _r === void 0 ? void 0 : _r.layout) === null || _s === void 0 ? void 0 : _s.attrs) === null || _t === void 0 ? void 0 : _t.editAction) && ((_y = (_x = (_w = (_v = (_u = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _u === void 0 ? void 0 : _u.solidView) === null || _v === void 0 ? void 0 : _v.layout) === null || _w === void 0 ? void 0 : _w.attrs) === null || _x === void 0 ? void 0 : _x.editAction) === null || _y === void 0 ? void 0 : _y.type) === "custom" ? (_3 = (_2 = (_1 = (_0 = (_z = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _z === void 0 ? void 0 : _z.solidView) === null || _0 === void 0 ? void 0 : _0.layout) === null || _1 === void 0 ? void 0 : _1.attrs) === null || _2 === void 0 ? void 0 : _2.editAction) === null || _3 === void 0 ? void 0 : _3.customComponent : "form";
-            var viewModes_2 = ((_7 = (_6 = (_5 = (_4 = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _4 === void 0 ? void 0 : _4.solidView) === null || _5 === void 0 ? void 0 : _5.layout) === null || _6 === void 0 ? void 0 : _6.attrs) === null || _7 === void 0 ? void 0 : _7.allowedViews) && ((_11 = (_10 = (_9 = (_8 = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _8 === void 0 ? void 0 : _8.solidView) === null || _9 === void 0 ? void 0 : _9.layout) === null || _10 === void 0 ? void 0 : _10.attrs) === null || _11 === void 0 ? void 0 : _11.allowedViews.length) > 0 && ((_15 = (_14 = (_13 = (_12 = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _12 === void 0 ? void 0 : _12.solidView) === null || _13 === void 0 ? void 0 : _13.layout) === null || _14 === void 0 ? void 0 : _14.attrs) === null || _15 === void 0 ? void 0 : _15.allowedViews.map(function (view) { return { label: capitalize(view), value: view }; }));
-            setViewModes(viewModes_2);
+            var viewModes_1 = ((_7 = (_6 = (_5 = (_4 = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _4 === void 0 ? void 0 : _4.solidView) === null || _5 === void 0 ? void 0 : _5.layout) === null || _6 === void 0 ? void 0 : _6.attrs) === null || _7 === void 0 ? void 0 : _7.allowedViews) && ((_11 = (_10 = (_9 = (_8 = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _8 === void 0 ? void 0 : _8.solidView) === null || _9 === void 0 ? void 0 : _9.layout) === null || _10 === void 0 ? void 0 : _10.attrs) === null || _11 === void 0 ? void 0 : _11.allowedViews.length) > 0 && ((_15 = (_14 = (_13 = (_12 = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _12 === void 0 ? void 0 : _12.solidView) === null || _13 === void 0 ? void 0 : _13.layout) === null || _14 === void 0 ? void 0 : _14.attrs) === null || _15 === void 0 ? void 0 : _15.allowedViews.map(function (view) { return { label: capitalize(view), value: view }; }));
+            setViewModes(viewModes_1);
             if (createActionUrl) {
                 setCreateButtonUrl(createActionUrl);
             }
@@ -721,11 +722,11 @@ export var SolidKanbanView = function (params) {
     return (_jsxs("div", { className: "page-parent-wrapper", children: [_jsx(Toast, { ref: toast }), _jsxs("div", { className: "page-header flex-column lg:flex-row", children: [_jsxs("div", { className: "flex justify-content-between w-full ", children: [_jsxs("div", { className: "flex align-items-center solid-header-buttons-wrapper", children: [params.embeded !== true &&
                                         _jsx("div", { className: "apps-icon block md:hidden cursor-pointer", onClick: toggleBothSidebars, children: _jsx("i", { className: "pi pi-th-large" }) }), _jsx("p", { className: "m-0 view-title solid-text-wrapper", children: kanbanViewTitle }), ((_e = (_d = (_c = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _c === void 0 ? void 0 : _c.solidView) === null || _d === void 0 ? void 0 : _d.layout) === null || _e === void 0 ? void 0 : _e.attrs.enableGlobalSearch) === true &&
                                         // <SolidGlobalSearchElement viewData={solidKanbanViewMetaData} handleApplyCustomFilter={handleApplyCustomFilter} ></SolidGlobalSearchElement>
-                                        _jsx("div", { className: "hidden lg:flex", children: _jsx(SolidGlobalSearchElement, { showSaveFilterPopup: showSaveFilterPopup, setShowSaveFilterPopup: setShowSaveFilterPopup, ref: solidGlobalSearchElementRef, viewData: solidKanbanViewMetaData, handleApplyCustomFilter: handleApplyCustomFilter }) })] }), _jsxs("div", { className: "flex align-items-center solid-header-buttons-wrapper", children: [((_h = (_g = (_f = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _f === void 0 ? void 0 : _f.solidView) === null || _g === void 0 ? void 0 : _g.layout) === null || _h === void 0 ? void 0 : _h.attrs.enableGlobalSearch) === true &&
+                                        _jsx("div", { className: "hidden lg:flex", children: _jsx(SolidGlobalSearchElement, { viewType: "kanban", showSaveFilterPopup: showSaveFilterPopup, setShowSaveFilterPopup: setShowSaveFilterPopup, ref: solidGlobalSearchElementRef, viewData: solidKanbanViewMetaData, handleApplyCustomFilter: handleApplyCustomFilter }) })] }), _jsxs("div", { className: "flex align-items-center solid-header-buttons-wrapper", children: [((_h = (_g = (_f = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _f === void 0 ? void 0 : _f.solidView) === null || _g === void 0 ? void 0 : _g.layout) === null || _h === void 0 ? void 0 : _h.attrs.enableGlobalSearch) === true &&
                                         _jsx("div", { className: "flex lg:hidden", children: _jsx(Button, { type: "button", size: "small", icon: "pi pi-search", severity: "secondary", outlined: true, className: "solid-icon-button", onClick: function () { return setShowGlobalSearchElement(!showGlobalSearchElement); } }) }), actionsAllowed.includes("".concat(permissionExpression(params.modelName, 'create'))) && ((_l = (_k = (_j = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _j === void 0 ? void 0 : _j.solidView) === null || _k === void 0 ? void 0 : _k.layout) === null || _l === void 0 ? void 0 : _l.attrs.create) !== false &&
                                         _jsx(SolidCreateButton, { createButtonUrl: createButtonUrl, createActionQueryParams: createActionQueryParams, responsiveIconOnly: true }), actionsAllowed.includes("".concat(permissionExpression(params.modelName, 'delete'))) && ((_p = (_o = (_m = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _m === void 0 ? void 0 : _m.solidView) === null || _o === void 0 ? void 0 : _o.layout) === null || _p === void 0 ? void 0 : _p.attrs.delete) !== false && selectedRecords.length > 0 && _jsx(Button, { type: "button", label: "Delete", size: "small", onClick: function () { return setDialogVisible(true); }, className: "small-button ", severity: "danger" }), _jsx(Button, { type: "button", size: "small", icon: "pi pi-refresh", severity: "secondary", className: "solid-icon-button", outlined: true, onClick: function () {
                                             window.location.reload();
-                                        } }), _jsx(SolidKanbanViewConfigure, { solidKanbanViewMetaData: solidKanbanViewMetaData, actionsAllowed: actionsAllowed, viewModes: viewModes, setLayoutDialogVisible: setLayoutDialogVisible, setShowSaveFilterPopup: setShowSaveFilterPopup })] })] }), ((_s = (_r = (_q = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _q === void 0 ? void 0 : _q.solidView) === null || _r === void 0 ? void 0 : _r.layout) === null || _s === void 0 ? void 0 : _s.attrs.enableGlobalSearch) === true && showGlobalSearchElement && (_jsx("div", { className: "flex lg:hidden", children: _jsx(SolidGlobalSearchElement, { showSaveFilterPopup: showSaveFilterPopup, setShowSaveFilterPopup: setShowSaveFilterPopup, ref: solidGlobalSearchElementRef, viewData: solidKanbanViewMetaData, handleApplyCustomFilter: handleApplyCustomFilter }) }))] }), _jsx("style", { children: ".p-datatable .p-datatable-loading-overlay {background-color: rgba(0, 0, 0, 0.0);}" }), solidKanbanViewMetaData && kanbanViewData &&
+                                        } }), _jsx(SolidKanbanViewConfigure, { solidKanbanViewMetaData: solidKanbanViewMetaData, actionsAllowed: actionsAllowed, viewModes: viewModes, setLayoutDialogVisible: setLayoutDialogVisible, setShowSaveFilterPopup: setShowSaveFilterPopup })] })] }), ((_s = (_r = (_q = solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data) === null || _q === void 0 ? void 0 : _q.solidView) === null || _r === void 0 ? void 0 : _r.layout) === null || _s === void 0 ? void 0 : _s.attrs.enableGlobalSearch) === true && showGlobalSearchElement && (_jsx("div", { className: "flex lg:hidden", children: _jsx(SolidGlobalSearchElement, { viewType: "kanban", showSaveFilterPopup: showSaveFilterPopup, setShowSaveFilterPopup: setShowSaveFilterPopup, ref: solidGlobalSearchElementRef, viewData: solidKanbanViewMetaData, handleApplyCustomFilter: handleApplyCustomFilter }) }))] }), _jsx("style", { children: ".p-datatable .p-datatable-loading-overlay {background-color: rgba(0, 0, 0, 0.0);}" }), solidKanbanViewMetaData && kanbanViewData &&
                 _jsx(KanbanBoard, { groupByFieldName: groupByFieldName, groupedView: groupedView, kanbanViewData: kanbanViewData, maxSwimLanesCount: maxSwimLanesCount, solidKanbanViewMetaData: solidKanbanViewMetaData === null || solidKanbanViewMetaData === void 0 ? void 0 : solidKanbanViewMetaData.data, setKanbanViewData: setKanbanViewData, handleLoadMore: handleLoadMore, onDragEnd: onDragEnd, handleSwimLanePagination: handleSwimLanePagination, setLightboxUrls: setLightboxUrls, setOpenLightbox: setOpenLightbox, editButtonUrl: editBaseUrl }), _jsx(Dialog, { visible: isDialogVisible, header: "Confirm Delete", modal: true, className: "solid-confirm-dialog", footer: function () { return (_jsxs("div", { className: "flex justify-content-center", children: [_jsx(Button, { label: "Yes", icon: "pi pi-check", className: 'small-button', severity: "danger", autoFocus: true, onClick: deleteBulk }), _jsx(Button, { label: "No", icon: "pi pi-times", className: 'small-button', onClick: onDeleteClose })] })); }, onHide: function () { return setDialogVisible(false); }, children: _jsx("p", { children: "Are you sure you want to delete the selected records?" }) }), openLightbox &&
                 _jsx(Lightbox, { open: openLightbox, plugins: [Counter, Download], close: function () { return setOpenLightbox(false); }, 
                     // @ts-ignore