@solidxai/core-ui 0.1.2 → 0.1.4-beta.0

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

@@ -66,7 +66,7 @@ const getRandomInt = (min: number, max: number) => {
   return Math.floor(Math.random() * (max - min + 1)) + min;
 };
 
-export const queryStringToQueryObject = () => {
+export const getFilterObjectFromLocalStorage = () => {
   const currentPageUrl = window.location.pathname; // Get the current page URL
   const encodedQueryString = localStorage.getItem(currentPageUrl); // Retrieve the encoded query string from local storage
 
@@ -85,7 +85,7 @@ export const queryStringToQueryObject = () => {
 };
 
 
-export const queryStringToQueryObjectByUrl = (url) => {
+export const getFilterObjectFromLocalStorageByUrl = (url) => {
   const currentPageUrl = url; // Get the current page URL
   const encodedQueryString = localStorage.getItem(currentPageUrl); // Retrieve the encoded query string from local storage
 
@@ -103,7 +103,7 @@ export const queryStringToQueryObjectByUrl = (url) => {
   }
 };
 
-export const queryObjectToQueryString = (queryObject: string) => {
+export const setFilterObjectToLocalStorage = (queryObject: string) => {
   if (queryObject) {
     const stringifiedObject = JSON.stringify(queryObject);
     // const stringifiedObject = qs.stringify(queryObject, { encodeValuesOnly: true, arrayFormat: "brackets" });
@@ -116,7 +116,7 @@ export const queryObjectToQueryString = (queryObject: string) => {
 };
 
 
-export const queryObjectToQueryStringByUrl = (url, queryObject: string) => {
+export const setFilterObjectToLocalStorageByUrl = (url, queryObject: string) => {
   if (queryObject) {
     const stringifiedObject = JSON.stringify(queryObject);
     // const stringifiedObject = qs.stringify(queryObject, { encodeValuesOnly: true, arrayFormat: "brackets" });
@@ -175,7 +175,7 @@ export type SolidListViewHandle = {
    * Updates sorting state and resets page offset to the first page.
    * Use this for programmatic sort controls to match DataTable behavior.
    */
-  setSort: (nextSortField: string, nextSortOrder: 1 | -1 | 0) => void;
+  setSort: (nextMultiSortMeta: { field: string; order: 1 | -1 }[]) => void;
   /**
    * Toggles inclusion of archived/soft-deleted records.
    * Use this to switch between active-only and inclusive list views.
@@ -188,8 +188,7 @@ export type SolidListViewHandle = {
   getState: () => {
     first: number;
     rows: number;
-    sortField: string;
-    sortOrder: 1 | -1 | 0;
+    multiSortMeta: { field: string; order: 1 | -1 }[];
     showArchived: boolean;
     filters: any;
     filterPredicates: any;
@@ -217,8 +216,7 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
   const [totalRecords, setTotalRecords] = useState(0);
   const [first, setFirst] = useState(0);
   const [rows, setRows] = useState(solidListViewLayout?.attrs?.defaultPageSize ? solidListViewLayout?.attrs?.defaultPageSize : 10);
-  const [sortField, setSortField] = useState("id");
-  const [sortOrder, setSortOrder] = useState(-1);
+  const [multiSortMeta, setMultiSortMeta] = useState<{ field: string; order: 1 | -1 }[]>([{ field: "id", order: -1 }]);
   const [toPopulate, setToPopulate] = useState<string[]>([]);
   const [toPopulateMedia, setToPopulateMedia] = useState<string[]>([]);
 
@@ -488,9 +486,8 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
     const populate = toPopulate;
     const populateMedia = toPopulateMedia;
     const rows = currentLayout?.attrs?.defaultPageSize ?? 25;
-    const sortField = "id";
-    const sortOrder = -1;
-    return { sortField, sortOrder, rows, populate, populateMedia };
+    const multiSortMeta = [{ field: "id", order: -1 }];
+    return { multiSortMeta, rows, populate, populateMedia };
   };
 
 
@@ -646,7 +643,7 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
     );
     setQueryDataLoaded(false)
     if (solidListViewMetaData && solidListViewLayout) {
-      const queryObject = queryStringToQueryObject();
+      const queryObject = getFilterObjectFromLocalStorage();
 
       if (queryObject) {
         const queryData = {
@@ -654,57 +651,37 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
           limit: queryObject.limit || 25,
           populate: queryObject.populate,
           populateMedia: queryObject.populateMedia,
-          sort: queryObject.sort
-            ? queryObject.sort?.map((sortItem: string) => {
-              const [field, order] = sortItem.split(":");
-              return { field, order };
-            })
-            : [`id:desc`],
+          sort: queryObject.sort,
           filters: queryObject.filters,
         };
-        // const filters = {
-        //   $and: [],
-        // };
-
-        // if (queryObject.custom_filter_predicate) {
-        //   filters.$and.push(queryObject.custom_filter_predicate);
-        // }
-        // if (queryObject.search_predicate) {
-        //   filters.$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?.offset));
-        setSortField(queryData?.sort[0]?.field);
-        setSortOrder(queryData?.sort[0]?.order);
-        // latestFiltersRef.current = filters;
-        const { sortField, sortOrder, rows, populate, populateMedia } = initialFilterMethod();
+        const parsedMultiSortMeta: { field: string; order: 1 | -1 }[] =
+          Array.isArray(queryData.sort) && queryData.sort.length > 0
+            ? queryData.sort.map((sortItem: string) => {
+              const [field, order] = sortItem.split(":");
+              return { field, order: order === "asc" ? 1 : -1 } as { field: string; order: 1 | -1 };
+            })
+            : [{ field: "id", order: -1 }];
+
+        setMultiSortMeta(parsedMultiSortMeta);
+        const { multiSortMeta, rows, populate, populateMedia } = initialFilterMethod();
         setToPopulate(populate);
         setToPopulateMedia(populateMedia);
 
       } else {
-        const { sortField, sortOrder, rows, populate, populateMedia } = initialFilterMethod();
+        const { multiSortMeta, rows, populate, populateMedia } = initialFilterMethod();
         setRows(rows);
-        setSortField(sortField);
-        setSortOrder(sortOrder);
+        setMultiSortMeta(multiSortMeta);
         setToPopulate(populate);
         setToPopulateMedia(populateMedia);
         setFirst(0);
       }
+      //below line was added to handle state stale issue when we converted boilerplate to vite 
+      //since now we dont need it becuase our component is remounted on every router change
       setFilters(params.customFilter || { $and: [] })
-      setFilterPredicates(null);
+      //setFilterPredicates(null);
       setSelectedRecords([]);
       setSelectedRecoverRecords([]);
       setQueryDataLoaded(true);
@@ -775,6 +752,13 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
   // Create a ref that always has the latest filters
   const latestFiltersRef = useRef(filters);
   const latestFilterPredicatesRef = useRef(filterPredicates);
+  // 1. Add the ref (near the other latestXxxRef declarations)
+  const latestMultiSortMetaRef = useRef(multiSortMeta);
+
+  // 2. Keep it in sync
+  useEffect(() => {
+    latestMultiSortMetaRef.current = multiSortMeta;
+  }, [multiSortMeta]);
 
   // Keep refs in sync
   useEffect(() => {
@@ -787,20 +771,20 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
 
 
   useEffect(() => {
-    console.log(`useEffect: [first- ${first}, rows- ${rows}, sortField- ${sortField}, sortOrder- ${sortOrder}, showArchived- ${showArchived}, toPopulate- ${toPopulate}, toPopulateMedia- ${toPopulateMedia}, queryDataLoaded- ${queryDataLoaded}]`);
+    console.log(`useEffect: [first- ${first}, rows- ${rows}, multiSortMeta- ${multiSortMeta}, showArchived- ${showArchived}, toPopulate- ${toPopulate}, toPopulateMedia- ${toPopulateMedia}, queryDataLoaded- ${queryDataLoaded}, filterPredicates- ${filterPredicates}]`);
     if (queryDataLoaded && filters && (filterPredicates || params.embeded == true)) {
       setQueryString();
     }
   }, [
     first,
     rows,
-    sortField,
-    sortOrder,
-    filters,
+    multiSortMeta,
     showArchived,
     toPopulate,
     toPopulateMedia,
-    queryDataLoaded
+    queryDataLoaded,
+    filters,
+    filterPredicates
   ]);
 
   // Handle pagination event.
@@ -810,13 +794,27 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
   };
 
   // Handle sort event.
+  // const onSort = (event: DataTableStateEvent) => {
+  //   const { sortField, sortOrder } = event;
+  //   const validSortOrder = sortOrder === 1 || sortOrder === -1 ? sortOrder : 0;
+  //   setSortField(sortField);
+  //   setSortOrder(validSortOrder);
+  //   setFirst(0);
+
+  // };
+
   const onSort = (event: DataTableStateEvent) => {
-    const { sortField, sortOrder } = event;
-    const validSortOrder = sortOrder === 1 || sortOrder === -1 ? sortOrder : 0;
-    setSortField(sortField);
-    setSortOrder(validSortOrder);
-    setFirst(0);
+    const meta = event.multiSortMeta || [];
 
+    const validMeta = meta
+      .filter((m) => m.order === 1 || m.order === -1)
+      .map((m) => ({
+        field: m.field,
+        order: m.order as 1 | -1,
+      }));
+
+    setMultiSortMeta(validMeta);
+    setFirst(0);
   };
 
   // handle change in the records which are currently selected...
@@ -850,22 +848,23 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
 
 
 
-    if (sortField && solidFieldsMetadata && solidFieldsMetadata[sortField]) {
-      const sortFieldMetadata = solidFieldsMetadata[sortField];
-      if (
-        sortFieldMetadata?.type === "relation" &&
-        sortFieldMetadata?.relationType === "many-to-one"
-      ) {
-        sortField = `${sortField}.${sortFieldMetadata?.relationModel?.userKeyField?.name}`;
-      }
-      queryData.sort = [
-        `${sortField}:${sortOrder == 0 ? null : sortOrder == 1 ? "asc" : "desc"
-        }`,
-      ];
+    // ✅ Use ref instead of stale closure value
+    const currentSortMeta = latestMultiSortMetaRef.current;
+
+    if (currentSortMeta && currentSortMeta.length > 0) {
+      queryData.sort = currentSortMeta.map(({ field, order }) => {
+        const meta = solidFieldsMetadata?.[field];
+        let resolvedField = field;
+        if (meta?.type === "relation" && meta?.relationType === "many-to-one") {
+          resolvedField = `${field}.${meta?.relationModel?.userKeyField?.name}`;
+        }
+        return `${resolvedField}:${order === 1 ? "asc" : "desc"}`;
+      });
     } else {
       queryData.sort = [`id:desc`];
     }
 
+
     if (showArchived) {
       queryData.showSoftDeleted = "inclusive";
     }
@@ -907,14 +906,13 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
     const queryString = qs.stringify(queryData, { encodeValuesOnly: true });
 
     if (latestFilterPredicatesRef.current && latestFilterPredicatesRef.current.persistFilter) {
-      let url;
-      const urlData = structuredClone(queryData);
-      delete urlData.filters;
-      urlData.custom_filter_predicate = latestFilterPredicatesRef.current.custom_filter_predicate || null;
-      urlData.search_predicate = latestFilterPredicatesRef.current.search_predicate || null;
-      urlData.saved_filter_predicate = latestFilterPredicatesRef.current.saved_filter_predicate || null;
-      urlData.predefined_search_predicate = latestFilterPredicatesRef.current.predefined_search_predicate || null;
-      queryObjectToQueryString(urlData);
+      const fileterTobeStored = structuredClone(queryData);
+      delete fileterTobeStored.filters;
+      fileterTobeStored.custom_filter_predicate = latestFilterPredicatesRef.current.custom_filter_predicate || null;
+      fileterTobeStored.search_predicate = latestFilterPredicatesRef.current.search_predicate || null;
+      fileterTobeStored.saved_filter_predicate = latestFilterPredicatesRef.current.saved_filter_predicate || null;
+      fileterTobeStored.predefined_search_predicate = latestFilterPredicatesRef.current.predefined_search_predicate || null;
+      setFilterObjectToLocalStorage(fileterTobeStored);
     }
     triggerGetSolidEntities(queryString);
   };
@@ -946,7 +944,6 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
 
     // Then update state
     setFilters(updatedFilter);
-    setPersistFilter(persistFilter);
     setFilterPredicates(updatedFilterPredicates);
     // Force synchronous state updates
   };
@@ -954,10 +951,9 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
   // clear Filter
   const clearFilter = () => {
     if (solidListViewMetaData) {
-      const { sortField, sortOrder, rows, populate, populateMedia } = initialFilterMethod();
+      const { multiSortMeta, rows, populate, populateMedia } = initialFilterMethod();
       setRows(rows);
-      setSortField(sortField);
-      setSortOrder(sortOrder);
+      setMultiSortMeta(multiSortMeta);
       setToPopulate(populate);
       setToPopulateMedia(populateMedia);
     }
@@ -991,9 +987,8 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
       setFirst(nextFirst);
       setRows(nextRows);
     },
-    setSort: (nextSortField, nextSortOrder) => {
-      setSortField(nextSortField);
-      setSortOrder(nextSortOrder);
+    setSort: (nextMultiSortMeta) => {
+      setMultiSortMeta(nextMultiSortMeta);
       setFirst(0);
     },
     setShowArchived: (value) => {
@@ -1002,8 +997,7 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
     getState: () => ({
       first,
       rows,
-      sortField,
-      sortOrder,
+      multiSortMeta,
       showArchived,
       filters,
       filterPredicates,
@@ -1014,8 +1008,7 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
   }), [
     first,
     rows,
-    sortField,
-    sortOrder,
+    multiSortMeta,
     showArchived,
     filters,
     filterPredicates,
@@ -1406,6 +1399,7 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
                     <div className="hidden lg:flex">
                       <SolidGlobalSearchElement
                         key={params.modelName}
+                        viewType="list"
                         showSaveFilterPopup={showSaveFilterPopup}
                         setShowSaveFilterPopup={setShowSaveFilterPopup}
                         ref={solidGlobalSearchElementRef}
@@ -1535,6 +1529,7 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
               params.embeded === false && (
                 <div className="flex lg:hidden">
                   <SolidGlobalSearchElement
+                    viewType="list"
                     showSaveFilterPopup={showSaveFilterPopup}
                     setShowSaveFilterPopup={setShowSaveFilterPopup}
                     ref={solidGlobalSearchElementRef}
@@ -1610,8 +1605,7 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
                   first={first}
                   onPage={onPageChange}
                   onSort={(e: DataTableStateEvent) => onSort(e)}
-                  sortField={sortField}
-                  sortOrder={sortOrder === 1 || sortOrder === -1 ? sortOrder : 0}
+                  multiSortMeta={multiSortMeta}
                   loading={false}
                   // loading={loading || isLoading}
                   // loadingIcon="pi pi-spinner"
@@ -1624,7 +1618,8 @@ export const SolidListView = forwardRef<SolidListViewHandle, SolidListViewParams
                     params.embeded === true ? undefined : onSelectionChange
                   }
                   selectionMode={params.embeded === true ? null : "checkbox"}
-                  removableSort
+                  removableSort={solidListViewLayout?.attrs?.removableSort ?? true}
+                  sortMode={solidListViewLayout?.attrs?.sortMode ?? "multiple"}
                   filterIcon={<FilterIcon />}
                   tableClassName="solid-data-table"
                   paginatorClassName="solid-paginator"

package/dist/components/core/list/columns/SolidMediaMultipleColumn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidMediaMultipleColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/list/columns/SolidMediaMultipleColumn.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAEnE,OAAO,EAAE,8BAA8B,EAAE,MAAM,8BAA8B,CAAC;AAoG9E,QAAA,MAAM,wBAAwB,uFAAwF,yBAAyB,4CAyC9I,CAAC;AAEF,eAAe,wBAAwB,CAAC;AAGxC,eAAO,MAAM,8BAA8B,iEAAkE,8BAA8B,mDAqJ1I,CAAC"}
+{"version":3,"file":"SolidMediaMultipleColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/list/columns/SolidMediaMultipleColumn.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAEnE,OAAO,EAAE,8BAA8B,EAAE,MAAM,8BAA8B,CAAC;AAuG9E,QAAA,MAAM,wBAAwB,uFAAwF,yBAAyB,4CAyC9I,CAAC;AAEF,eAAe,wBAAwB,CAAC;AAGxC,eAAO,MAAM,8BAA8B,iEAAkE,8BAA8B,mDAoJ1I,CAAC"}

package/dist/components/core/list/columns/SolidMediaMultipleColumn.js

@@ -17,10 +17,15 @@ import { getExtensionComponent } from '../../../../helpers/registry';
 import { classNames } from 'primereact/utils';
 import { FileReaderExt } from '../../../../components/common/FileReaderExt';
 import { Dialog } from 'primereact/dialog';
-// Helpers
-var isImageFile = function (url) { return /\.(jpg|jpeg|png|gif|bmp|webp)$/i.test(url); };
-var isVideoFile = function (url) { return /\.(mp4|webm|ogg)$/i.test(url); };
-var isAudioFile = function (url) { return /\.(mp3|wav|ogg)$/i.test(url); };
+var getCleanUrl = function (url) { return url.split("?")[0]; };
+var isImageFile = function (url) { return /\.(jpg|jpeg|png|gif|bmp|webp)$/i.test(getCleanUrl(url)); };
+var isVideoFile = function (url) { return /\.(mp4|webm|ogg)$/i.test(getCleanUrl(url)); };
+var isAudioFile = function (url) { return /\.(mp3|wav|ogg)$/i.test(getCleanUrl(url)); };
+var isDocumentType = function (url) {
+    var _a;
+    var ext = (_a = getCleanUrl(url).split(".").pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase();
+    return ext ? downloadOnlyExt.includes(ext) : false;
+};
 var downloadOnlyExt = [
     "txt", "zip", "rar",
     "doc", "docx",
@@ -28,11 +33,6 @@ var downloadOnlyExt = [
     "ppt", "pptx",
     "pdf", "csv"
 ];
-var isDocumentType = function (url) {
-    var _a;
-    var ext = (_a = url.split("?")[0].split(".").pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase();
-    return ext ? downloadOnlyExt.includes(ext) : false;
-};
 var downloadFile = function (url, name) {
     if (name === void 0) { name = ""; }
     var link = document.createElement("a");
@@ -107,11 +107,10 @@ export var DefaultMediaMultipleListWidget = function (_a) {
         return size >= 1024 * 1024 ? "".concat((size / (1024 * 1024)).toFixed(1), " MB") : "".concat((size / 1024).toFixed(1), " KB");
     };
     var handleFileView = function (file) {
-        var _a;
         var fileUrl = (file === null || file === void 0 ? void 0 : file.fileUrl) || "";
-        var cleanUrl = fileUrl.split("?")[0];
-        var ext = (_a = cleanUrl.split(".").pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase();
-        if (ext && downloadOnlyExt.includes(ext)) {
+        // const cleanUrl = fileUrl.split("?")[0];
+        // const ext = cleanUrl.split(".").pop()?.toLowerCase();
+        if (isDocumentType(fileUrl)) {
             downloadFile(file === null || file === void 0 ? void 0 : file.fileUrl, "");
         }
         else {
@@ -122,13 +121,13 @@ export var DefaultMediaMultipleListWidget = function (_a) {
     return fullrecord.length > 0 ? (_jsxs("div", { className: 'flex gap-2 align-items-end', children: [_jsx(MediaPreview, { src: (_d = fullrecord[0]) === null || _d === void 0 ? void 0 : _d.fileUrl, onClick: function (event) {
                     var _a, _b, _c;
                     event.stopPropagation();
-                    var cleanUrl = (_a = fullrecord[0]) === null || _a === void 0 ? void 0 : _a.fileUrl.split("?")[0];
-                    var ext = (_b = cleanUrl.split(".").pop()) === null || _b === void 0 ? void 0 : _b.toLowerCase();
-                    if (ext && downloadOnlyExt.includes(ext) && (fullrecord === null || fullrecord === void 0 ? void 0 : fullrecord.length) > 1) {
+                    // const cleanUrl = fullrecord[0]?.fileUrl.split("?")[0];
+                    // const ext = cleanUrl.split(".").pop()?.toLowerCase();
+                    if (isDocumentType((_a = fullrecord[0]) === null || _a === void 0 ? void 0 : _a.fileUrl) && (fullrecord === null || fullrecord === void 0 ? void 0 : fullrecord.length) > 1) {
                         setShowAllFiles(true);
                         return;
                     }
-                    else if (ext && downloadOnlyExt.includes(ext)) {
+                    else if (isDocumentType((_b = fullrecord[0]) === null || _b === void 0 ? void 0 : _b.fileUrl)) {
                         downloadFile((_c = fullrecord[0]) === null || _c === void 0 ? void 0 : _c.fileUrl, "");
                         return;
                     }

package/dist/components/core/list/columns/SolidMediaMultipleColumn.js.map

@@ -1 +1 @@
-{"version":3,"file":"SolidMediaMultipleColumn.js","sourceRoot":"","sources":["../../../../../src/components/core/list/columns/SolidMediaMultipleColumn.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport React, { useState } from 'react';\nimport { Column } from \"primereact/column\";\nimport { SolidListViewColumnParams } from '../SolidListViewColumn';\nimport { Button } from 'primereact/button';\nimport { SolidMediaListFieldWidgetProps } from '../../../../types/solid-core';\nimport { getExtensionComponent } from '../../../../helpers/registry';\nimport { classNames } from 'primereact/utils';\nimport { FileReaderExt } from '../../../../components/common/FileReaderExt';\nimport { Dialog } from 'primereact/dialog';\n\n// Helpers\nconst isImageFile = (url: string) => /\\.(jpg|jpeg|png|gif|bmp|webp)$/i.test(url);\nconst isVideoFile = (url: string) => /\\.(mp4|webm|ogg)$/i.test(url);\nconst isAudioFile = (url: string) => /\\.(mp3|wav|ogg)$/i.test(url);\n\nconst downloadOnlyExt = [\n    \"txt\", \"zip\", \"rar\",\n    \"doc\", \"docx\",\n    \"xls\", \"xlsx\",\n    \"ppt\", \"pptx\",\n    \"pdf\", \"csv\"\n];\n\nconst isDocumentType = (url: string) => {\n    const ext = url.split(\"?\")[0].split(\".\").pop()?.toLowerCase();\n    return ext ? downloadOnlyExt.includes(ext) : false;\n};\n\nconst downloadFile = (url: string, name: string = \"\") => {\n    const link = document.createElement(\"a\");\n    link.href = url;\n    link.download = name;\n    link.target = \"_blank\";\n    document.body.appendChild(link);\n    link.click();\n    document.body.removeChild(link);\n};\n\n\n\n// Thumbnail preview component\nconst MediaPreview = ({ src, onClick }: { src: string; onClick: (event: React.MouseEvent) => void }) => {\n    const [isBroken, setIsBroken] = useState(false);\n\n    const handleClick = (event: React.MouseEvent) => {\n        onClick(event);\n    };\n\n    if (!isBroken) {\n        if (isImageFile(src)) {\n            return (\n                <img\n                    src={src}\n                    alt=\"media\"\n                    className=\"shadow-2 border-round\"\n                    width={40}\n                    height={40}\n                    style={{ objectFit: \"cover\" }}\n                    onError={() => setIsBroken(true)}\n                    onClick={handleClick}\n                />\n            );\n        }\n\n        if (isVideoFile(src)) {\n            return (\n                <video\n                    src={src}\n                    width={40}\n                    height={40}\n                    className=\"shadow-2 border-round\"\n                    style={{ objectFit: \"cover\" }}\n                    onError={() => setIsBroken(true)}\n                    onClick={handleClick}\n                    muted\n                />\n            );\n        }\n\n        if (isAudioFile(src)) {\n            return (\n                <div\n                    className=\"shadow-2 border-round flex align-items-center justify-content-center bg-gray-100\"\n                    style={{ width: 40, height: 40 }}\n                    onClick={handleClick}\n                >\n                    <i className=\"pi pi-volume-up text-xl text-gray-600\"></i>\n                </div>\n            );\n        }\n    }\n\n    return (\n        <div\n            style={{ width: 40, height: 40, display: \"flex\", alignItems: \"center\", justifyContent: \"center\" }}\n            onClick={handleClick}\n        >\n            <i className={classNames(\"pi pi-file\", \"text-3xl text-gray-400\")}></i>\n        </div>\n    );\n};\n\n\n// Column Component\nconst SolidMediaMultipleColumn = ({ solidListViewMetaData, fieldMetadata, column, setLightboxUrls, setOpenLightbox }: SolidListViewColumnParams) => {\n    const filterable = false;\n    const showFilterOperator = false;\n    const columnDataType = undefined;\n    const header = column.attrs.label ?? fieldMetadata.displayName;\n\n    return (\n        <Column\n            key={fieldMetadata.name}\n            field={fieldMetadata.name}\n            header={header}\n            body={(rowData) => {\n                let viewWidget = column.attrs.viewWidget;\n                if (!viewWidget) {\n                    viewWidget = 'DefaultMediaMultipleListWidget';\n                }\n                let DynamicWidget = getExtensionComponent(viewWidget);\n                const widgetProps: SolidMediaListFieldWidgetProps = {\n                    rowData,\n                    solidListViewMetaData,\n                    fieldMetadata,\n                    column,\n                    setLightboxUrls,\n                    setOpenLightbox\n                }\n                return (\n                    <>\n                        {\n                            DynamicWidget && <DynamicWidget {...widgetProps} />\n                        }\n                    </>\n                )\n            }}\n            sortable={column.attrs.sortable}\n            dataType={columnDataType}\n            showFilterOperator={showFilterOperator}\n            filterPlaceholder={`Search by ${fieldMetadata.displayName}`}\n            style={{ minWidth: \"12rem\" }}\n            headerClassName=\"table-header-fs\"\n        />\n    );\n};\n\nexport default SolidMediaMultipleColumn;\n\n// Default multiple widget\nexport const DefaultMediaMultipleListWidget = ({ rowData, fieldMetadata, setLightboxUrls, setOpenLightbox }: SolidMediaListFieldWidgetProps) => {\n    const [isShowAllFiles, setShowAllFiles] = useState(false);\n\n    if (!rowData?._media?.[fieldMetadata.name]) return null;\n\n    const fullrecord = rowData._media[fieldMetadata.name]?.map((file: any) => ({\n        name: file.originalFileName,\n        type: file.mimeType,\n        size: file.fileSize,\n        id: file.id,\n        fileUrl: file._full_url\n    }));\n\n\n    const formatFileSize = (size: number) =>\n        size >= 1024 * 1024 ? `${(size / (1024 * 1024)).toFixed(1)} MB` : `${(size / 1024).toFixed(1)} KB`;\n\n\n    const handleFileView = (file: any) => {\n        const fileUrl = file?.fileUrl || \"\";\n        const cleanUrl = fileUrl.split(\"?\")[0];\n        const ext = cleanUrl.split(\".\").pop()?.toLowerCase();\n\n        if (ext && downloadOnlyExt.includes(ext)) {\n            downloadFile(file?.fileUrl, \"\")\n\n        } else {\n            setLightboxUrls?.([{ src: file.fileUrl, downloadUrl: file.fileUrl }]);\n            setOpenLightbox?.(true);\n        }\n    };\n\n\n\n    return fullrecord.length > 0 ? (\n        <div className='flex gap-2 align-items-end'>\n\n            {/* THUMBNAIL - FIXED BEHAVIOR */}\n            <MediaPreview\n                src={fullrecord[0]?.fileUrl}\n                onClick={(event) => {\n                    event.stopPropagation();\n\n                    const cleanUrl = fullrecord[0]?.fileUrl.split(\"?\")[0];\n                    const ext = cleanUrl.split(\".\").pop()?.toLowerCase();\n\n                    if (ext && downloadOnlyExt.includes(ext) && fullrecord?.length > 1) {\n                        setShowAllFiles(true)\n                        return;\n                    }\n\n                    else if (ext && downloadOnlyExt.includes(ext)) {\n                        downloadFile(fullrecord[0]?.fileUrl, \"\")\n                        return;\n                    }\n\n                    // FIRST FILE IS MEDIA ⇒ OPEN LIGHTBOX\n                    const urlsWithType = fullrecord.map((file: any) => ({\n                        src: file.fileUrl,\n                        downloadUrl: file.fileUrl,\n                    }));\n                    setLightboxUrls(urlsWithType);\n                    setOpenLightbox(true);\n                }}\n            />\n\n                {fullrecord?.length > 1 && <span\n                        style={{\n                            color: \"#0895CD\",\n                            fontWeight: \"bold\",\n                            cursor: \"pointer\",\n                            marginLeft: \"4px\"\n                        }}\n                        onClick={(event) => {\n                            event.stopPropagation();\n    \n                            if (isDocumentType(fullrecord[0]?.fileUrl)) {\n                                setShowAllFiles(true);\n                            } else {\n                                const urlsWithType = fullrecord.map((file: any) => ({\n                                    src: file.fileUrl,\n                                    downloadUrl: file.fileUrl\n                                }));\n                                setLightboxUrls(urlsWithType);\n                                setOpenLightbox(true);\n                            }\n                        }}\n                    >\n                        +{fullrecord.length - 1}\n                   </span>\n                }\n\n             \n\n            {/* VIEW ALL DIALOG */}\n            <Dialog\n                visible={isShowAllFiles}\n                header=\"Items Uploaded\"\n                modal\n                onHide={() => setShowAllFiles(false)}\n                // style={{ minWidth: 450 }}\n                style={{ width: '32rem' }}\n                onClick={(event) => event.stopPropagation()}\n                breakpoints={{ '591px': '94vw'}}\n            >\n                {fullrecord?.map((file: any) => {\n                    const fileId = `${file.name}-${file.size}`;\n                    return (\n                        <div key={fileId} className=\"solid-file-upload-wrapper mb-3\">\n                            <div className=\"flex align-items-center gap-2\">\n\n                                <FileReaderExt fileDetails={file} />\n\n                                <div className=\"w-full flex flex-column gap-1\">\n                                    <div className=\"flex align-items-center justify-content-between\">\n\n                                        <p\n                                            className=\"font-normal w-11 text-primary m-0\"\n                                            style={{ cursor: \"pointer\" }}\n                                            onClick={() => handleFileView(file)}\n                                        >\n                                            {file?.name}\n                                        </p>\n\n                                        <Button\n                                            type=\"button\"\n                                            text\n                                            icon=\"pi pi-download\"\n                                            size=\"small\"\n                                            onClick={() => {\n                                                downloadFile(file?.fileUrl, \"\")\n                                            }}\n                                            style={{ height: 16, width: 16 }}\n                                        />\n                                    </div>\n\n                                    <div className=\"text-sm\">{formatFileSize(file.size)}</div>\n                                </div>\n\n                            </div>\n                        </div>\n                    )\n                }\n                )}\n            </Dialog>\n        </div>\n    ) : (\n        <div style={{ height: 40, width: 40 }} />\n    );\n};\n"]}
+{"version":3,"file":"SolidMediaMultipleColumn.js","sourceRoot":"","sources":["../../../../../src/components/core/list/columns/SolidMediaMultipleColumn.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport React, { useState } from 'react';\nimport { Column } from \"primereact/column\";\nimport { SolidListViewColumnParams } from '../SolidListViewColumn';\nimport { Button } from 'primereact/button';\nimport { SolidMediaListFieldWidgetProps } from '../../../../types/solid-core';\nimport { getExtensionComponent } from '../../../../helpers/registry';\nimport { classNames } from 'primereact/utils';\nimport { FileReaderExt } from '../../../../components/common/FileReaderExt';\nimport { Dialog } from 'primereact/dialog';\n\nconst getCleanUrl = (url: string) => url.split(\"?\")[0];\n\nconst isImageFile = (url: string) => /\\.(jpg|jpeg|png|gif|bmp|webp)$/i.test(getCleanUrl(url));\n\nconst isVideoFile = (url: string) => /\\.(mp4|webm|ogg)$/i.test(getCleanUrl(url));\n\nconst isAudioFile = (url: string) => /\\.(mp3|wav|ogg)$/i.test(getCleanUrl(url));\n\nconst isDocumentType = (url: string) => {\n    const ext = getCleanUrl(url).split(\".\").pop()?.toLowerCase();\n    return ext ? downloadOnlyExt.includes(ext) : false;\n};\n\nconst downloadOnlyExt = [\n    \"txt\", \"zip\", \"rar\",\n    \"doc\", \"docx\",\n    \"xls\", \"xlsx\",\n    \"ppt\", \"pptx\",\n    \"pdf\", \"csv\"\n];\n\nconst downloadFile = (url: string, name: string = \"\") => {\n    const link = document.createElement(\"a\");\n    link.href = url;\n    link.download = name;\n    link.target = \"_blank\";\n    document.body.appendChild(link);\n    link.click();\n    document.body.removeChild(link);\n};\n\n\n\n// Thumbnail preview component\nconst MediaPreview = ({ src, onClick }: { src: string; onClick: (event: React.MouseEvent) => void }) => {\n    const [isBroken, setIsBroken] = useState(false);\n\n    const handleClick = (event: React.MouseEvent) => {\n        onClick(event);\n    };\n\n    if (!isBroken) {\n        if (isImageFile(src)) {\n            return (\n                <img\n                    src={src}\n                    alt=\"media\"\n                    className=\"shadow-2 border-round\"\n                    width={40}\n                    height={40}\n                    style={{ objectFit: \"cover\" }}\n                    onError={() => setIsBroken(true)}\n                    onClick={handleClick}\n                />\n            );\n        }\n\n        if (isVideoFile(src)) {\n            return (\n                <video\n                    src={src}\n                    width={40}\n                    height={40}\n                    className=\"shadow-2 border-round\"\n                    style={{ objectFit: \"cover\" }}\n                    onError={() => setIsBroken(true)}\n                    onClick={handleClick}\n                    muted\n                />\n            );\n        }\n\n        if (isAudioFile(src)) {\n            return (\n                <div\n                    className=\"shadow-2 border-round flex align-items-center justify-content-center bg-gray-100\"\n                    style={{ width: 40, height: 40 }}\n                    onClick={handleClick}\n                >\n                    <i className=\"pi pi-volume-up text-xl text-gray-600\"></i>\n                </div>\n            );\n        }\n    }\n\n    return (\n        <div\n            style={{ width: 40, height: 40, display: \"flex\", alignItems: \"center\", justifyContent: \"center\" }}\n            onClick={handleClick}\n        >\n            <i className={classNames(\"pi pi-file\", \"text-3xl text-gray-400\")}></i>\n        </div>\n    );\n};\n\n\n// Column Component\nconst SolidMediaMultipleColumn = ({ solidListViewMetaData, fieldMetadata, column, setLightboxUrls, setOpenLightbox }: SolidListViewColumnParams) => {\n    const filterable = false;\n    const showFilterOperator = false;\n    const columnDataType = undefined;\n    const header = column.attrs.label ?? fieldMetadata.displayName;\n\n    return (\n        <Column\n            key={fieldMetadata.name}\n            field={fieldMetadata.name}\n            header={header}\n            body={(rowData) => {\n                let viewWidget = column.attrs.viewWidget;\n                if (!viewWidget) {\n                    viewWidget = 'DefaultMediaMultipleListWidget';\n                }\n                let DynamicWidget = getExtensionComponent(viewWidget);\n                const widgetProps: SolidMediaListFieldWidgetProps = {\n                    rowData,\n                    solidListViewMetaData,\n                    fieldMetadata,\n                    column,\n                    setLightboxUrls,\n                    setOpenLightbox\n                }\n                return (\n                    <>\n                        {\n                            DynamicWidget && <DynamicWidget {...widgetProps} />\n                        }\n                    </>\n                )\n            }}\n            sortable={column.attrs.sortable}\n            dataType={columnDataType}\n            showFilterOperator={showFilterOperator}\n            filterPlaceholder={`Search by ${fieldMetadata.displayName}`}\n            style={{ minWidth: \"12rem\" }}\n            headerClassName=\"table-header-fs\"\n        />\n    );\n};\n\nexport default SolidMediaMultipleColumn;\n\n// Default multiple widget\nexport const DefaultMediaMultipleListWidget = ({ rowData, fieldMetadata, setLightboxUrls, setOpenLightbox }: SolidMediaListFieldWidgetProps) => {\n    const [isShowAllFiles, setShowAllFiles] = useState(false);\n\n    if (!rowData?._media?.[fieldMetadata.name]) return null;\n\n    const fullrecord = rowData._media[fieldMetadata.name]?.map((file: any) => ({\n        name: file.originalFileName,\n        type: file.mimeType,\n        size: file.fileSize,\n        id: file.id,\n        fileUrl: file._full_url\n    }));\n\n\n    const formatFileSize = (size: number) =>\n        size >= 1024 * 1024 ? `${(size / (1024 * 1024)).toFixed(1)} MB` : `${(size / 1024).toFixed(1)} KB`;\n\n\n    const handleFileView = (file: any) => {\n        const fileUrl = file?.fileUrl || \"\";\n        // const cleanUrl = fileUrl.split(\"?\")[0];\n        // const ext = cleanUrl.split(\".\").pop()?.toLowerCase();\n\n        if (isDocumentType(fileUrl)) {\n            downloadFile(file?.fileUrl, \"\")\n\n        } else {\n            setLightboxUrls?.([{ src: file.fileUrl, downloadUrl: file.fileUrl }]);\n            setOpenLightbox?.(true);\n        }\n    };\n\n\n\n    return fullrecord.length > 0 ? (\n        <div className='flex gap-2 align-items-end'>\n\n            {/* THUMBNAIL - FIXED BEHAVIOR */}\n            <MediaPreview\n                src={fullrecord[0]?.fileUrl}\n                onClick={(event) => {\n                    event.stopPropagation();\n\n                    // const cleanUrl = fullrecord[0]?.fileUrl.split(\"?\")[0];\n                    // const ext = cleanUrl.split(\".\").pop()?.toLowerCase();\n\n                    if (isDocumentType(fullrecord[0]?.fileUrl) && fullrecord?.length > 1) {\n                        setShowAllFiles(true)\n                        return;\n                    }\n\n                    else if (isDocumentType(fullrecord[0]?.fileUrl)) {\n                        downloadFile(fullrecord[0]?.fileUrl, \"\")\n                        return;\n                    }\n                    // FIRST FILE IS MEDIA ⇒ OPEN LIGHTBOX\n                    const urlsWithType = fullrecord.map((file: any) => ({\n                        src: file.fileUrl,\n                        downloadUrl: file.fileUrl,\n                    }));\n                    setLightboxUrls(urlsWithType);\n                    setOpenLightbox(true);\n                }}\n            />\n\n            {fullrecord?.length > 1 && <span\n                style={{\n                    color: \"#0895CD\",\n                    fontWeight: \"bold\",\n                    cursor: \"pointer\",\n                    marginLeft: \"4px\"\n                }}\n                onClick={(event) => {\n                    event.stopPropagation();\n\n                    if (isDocumentType(fullrecord[0]?.fileUrl)) {\n                        setShowAllFiles(true);\n                    } else {\n                        const urlsWithType = fullrecord.map((file: any) => ({\n                            src: file.fileUrl,\n                            downloadUrl: file.fileUrl\n                        }));\n                        setLightboxUrls(urlsWithType);\n                        setOpenLightbox(true);\n                    }\n                }}\n            >\n                +{fullrecord.length - 1}\n            </span>\n            }\n\n\n\n            {/* VIEW ALL DIALOG */}\n            <Dialog\n                visible={isShowAllFiles}\n                header=\"Items Uploaded\"\n                modal\n                onHide={() => setShowAllFiles(false)}\n                // style={{ minWidth: 450 }}\n                style={{ width: '32rem' }}\n                onClick={(event) => event.stopPropagation()}\n                breakpoints={{ '591px': '94vw' }}\n            >\n                {fullrecord?.map((file: any) => {\n                    const fileId = `${file.name}-${file.size}`;\n                    return (\n                        <div key={fileId} className=\"solid-file-upload-wrapper mb-3\">\n                            <div className=\"flex align-items-center gap-2\">\n\n                                <FileReaderExt fileDetails={file} />\n\n                                <div className=\"w-full flex flex-column gap-1\">\n                                    <div className=\"flex align-items-center justify-content-between\">\n\n                                        <p\n                                            className=\"font-normal w-11 text-primary m-0\"\n                                            style={{ cursor: \"pointer\" }}\n                                            onClick={() => handleFileView(file)}\n                                        >\n                                            {file?.name}\n                                        </p>\n\n                                        <Button\n                                            type=\"button\"\n                                            text\n                                            icon=\"pi pi-download\"\n                                            size=\"small\"\n                                            onClick={() => {\n                                                downloadFile(file?.fileUrl, \"\")\n                                            }}\n                                            style={{ height: 16, width: 16 }}\n                                        />\n                                    </div>\n\n                                    <div className=\"text-sm\">{formatFileSize(file.size)}</div>\n                                </div>\n\n                            </div>\n                        </div>\n                    )\n                }\n                )}\n            </Dialog>\n        </div>\n    ) : (\n        <div style={{ height: 40, width: 40 }} />\n    );\n};\n"]}