@bexis2/bexis2-core-ui 0.4.42 → 0.4.43

package/README.md

@@ -1,4 +1,8 @@
 # bexis-core-ui
+## 0.4.43
+- Table
+  - fix header names with dots breaks the table
+
 ## 0.4.42
 ## 0.4.41
 - Multiselect

package/dist/components/Table/TableContent.svelte

@@ -509,7 +509,7 @@ $: $hiddenColumnIds = shownColumns.filter((col) => !col.visible).map((col) => co
 																	? `Remove sorting by ${cell.label} column`
 																	: `Sort by ${cell.label} column in ascending order`}
 															>
-																{cell.render()}
+																{cell.render().replaceAll("%%%", '.')}
 															</span>
 															<div class="w-2">
 																{#if props.sort.order === 'asc'}

package/dist/components/Table/utils.d.ts

@@ -23,7 +23,7 @@ export declare const missingValuesFn: (key: number | string, missingValues: {
 }) => string | number;
 export declare const updateTable: (pageSize: number, pageIndex: number, server: ServerConfig | undefined, filters: {
     [key: string]: { [key in FilterOptionsEnum]?: number | string | Date; };
-}, data: Writable<any[]>, serverItems: Writable<number> | undefined, columns: Columns | undefined, dispatch: any, order?: OrderBy[]) => Promise<Receive>;
+}, data: Writable<any[]>, serverItems: Writable<number> | undefined, columns: Columns | undefined, dispatch: any, order?: OrderBy[]) => Promise<Receive | Writable<any[]>>;
 export declare const convertServerColumns: (serverColumns: ServerColumn[], columns: Columns | undefined) => Columns;
 export declare const getMaxCellHeightInRow: (tableRef: HTMLTableElement, resizable: "columns" | "rows" | "none" | "both", optionsComponent: typeof SvelteComponent | undefined, rowHeights: Writable<{
     [key: number]: {

package/dist/components/Table/utils.js

@@ -46,7 +46,7 @@ export const normalizeFilters = (filters) => {
             .filter((k) => filters[key][k] !== undefined)
             .forEach((k) => {
             filter.push({
-                column: key,
+                column: key.replaceAll('%%%', '.'),
                 filterBy: k,
                 value: filters[key][k]
             });
@@ -151,6 +151,15 @@ export const updateTable = async (pageSize, pageIndex, server, filters, data, se
     sendModel.id = entityId || -1;
     sendModel.filter = normalizeFilters(filters);
     sendModel.order = order;
+    // remove %%% from the columns object
+    if (sendModel.order) {
+        sendModel.order.forEach((order) => {
+            if (order.column.includes("%%%")) {
+                const newKey = order.column.replaceAll('%%%', '.');
+                order.column = newKey;
+            }
+        });
+    }
     let fetchData;
     try {
         fetchData = await fetch(baseUrl || '', {
@@ -170,24 +179,37 @@ export const updateTable = async (pageSize, pageIndex, server, filters, data, se
     const response = await fetchData.json();
     // Format server columns to the client columns
     if (response.columns !== undefined) {
+        console.log('Server columns', response.columns);
         columns = convertServerColumns(response.columns, columns);
         const clientCols = response.columns.reduce((acc, col) => {
+            console.log(col.key, col.column);
+            // replace the . with empty string
+            //const key = col.key.replaceAll('.' ,'');
+            ///console.log(key, col.column);
+            // set the key to the columns object
+            col.column = col.column.replaceAll('.', "%%%");
+            col.key = col.key.replaceAll('.', "%%%");
             acc[col.key] = col.column;
+            //acc[col.column] = col.column;
             return acc;
         }, {});
         const tmpArr = [];
+        // tmp[clientCols["['" + key.replaceAll('.', ",") +"']"]] = row[key];
         response.data.forEach((row, index) => {
             const tmp = {};
             Object.keys(row).forEach((key) => {
-                tmp[clientCols[key]] = row[key];
+                tmp[clientCols[key.replaceAll('.', "%%%")]] = row[key];
             });
             tmpArr.push(tmp);
         });
         dispatch('fetch', columns);
         data.set(tmpArr);
+        console.log('Server data', tmpArr);
+        return data;
     }
     serverItems?.set(response.count);
     console.log('Server data updated');
+    // log the columns object
     console.log(response);
     return response;
 };
@@ -231,17 +253,18 @@ export const convertServerColumns = (serverColumns, columns) => {
             };
         }
         if (columns && col.column in columns) {
-            columnsConfig[col.column] = {
-                ...columns[col.column],
+            columnsConfig[col.column.replaceAll('.', "%%%")] = {
+                ...columns[col.column.replaceAll('.', "%%%")],
                 instructions
             };
         }
         else {
-            columnsConfig[col.column] = {
+            columnsConfig[col.column.replaceAll('.', "%%%")] = {
                 instructions
             };
         }
     });
+    console.log('Columns config', columnsConfig);
     return columnsConfig;
 };
 // Calculates the maximum height of the cells in each row

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bexis2/bexis2-core-ui",
-  "version": "0.4.42",
+  "version": "0.4.43",
   "private": false,
   "scripts": {
     "dev": "vite dev",

package/src/lib/components/Table/TableContent.svelte

@@ -589,7 +589,7 @@
 																	? `Remove sorting by ${cell.label} column`
 																	: `Sort by ${cell.label} column in ascending order`}
 															>
-																{cell.render()}
+																{cell.render().replaceAll("%%%", '.')}
 															</span>
 															<div class="w-2">
 																{#if props.sort.order === 'asc'}

package/src/lib/components/Table/utils.ts

@@ -60,7 +60,7 @@ export const normalizeFilters = (filters: {
 			.filter((k) => filters[key][k] !== undefined)
 			.forEach((k) => {
 				filter.push({
-					column: key,
+					column: key.replaceAll('%%%', '.'),
 					filterBy: k as FilterOptionsEnum,
 					value: filters[key][k]
 				});
@@ -199,6 +199,16 @@ export const updateTable = async (
 	sendModel.filter = normalizeFilters(filters);
 	sendModel.order = order;
 
+	// remove %%% from the columns object
+	if (sendModel.order) {
+		sendModel.order.forEach((order) => {
+			if (order.column.includes("%%%")) {
+				const newKey = order.column.replaceAll('%%%', '.');
+				order.column = newKey;
+			}
+		});
+	}
+
 	let fetchData;
 
 	try {
@@ -221,28 +231,43 @@ export const updateTable = async (
 
 	// Format server columns to the client columns
 	if (response.columns !== undefined) {
+		console.log('Server columns', response.columns);
 		columns = convertServerColumns(response.columns, columns);
 
 		const clientCols = response.columns.reduce((acc, col) => {
-			acc[col.key] = col.column;
+			console.log(col.key, col.column);
+			// replace the . with empty string
+			//const key = col.key.replaceAll('.' ,'');
+			///console.log(key, col.column);
+			// set the key to the columns object
+			col.column = col.column.replaceAll('.', "%%%");
+			col.key = col.key.replaceAll('.', "%%%");
+			acc[col.key] = col.column
+			//acc[col.column] = col.column;
+
 			return acc;
 		}, {});
 
 		const tmpArr: any[] = [];
-
+		// tmp[clientCols["['" + key.replaceAll('.', ",") +"']"]] = row[key];
 		response.data.forEach((row, index) => {
 			const tmp: { [key: string]: any } = {};
 			Object.keys(row).forEach((key) => {
-				tmp[clientCols[key]] = row[key];
+				tmp[clientCols[key.replaceAll('.', "%%%") ]] = row[key]
 			});
 			tmpArr.push(tmp);
 		});
 		dispatch('fetch', columns);
 		data.set(tmpArr);
+		console.log('Server data', tmpArr);
+		return data;
 	}
 
 	serverItems?.set(response.count);
 	console.log('Server data updated');
+
+
+	// log the columns object
 	console.log(response);
 	return response;
 };
@@ -291,17 +316,17 @@ export const convertServerColumns = (
 		}
 
 		if (columns && col.column in columns) {
-			columnsConfig[col.column] = {
-				...columns[col.column],
+			columnsConfig[col.column.replaceAll('.', "%%%")] = {
+				...columns[col.column.replaceAll('.', "%%%")],
 				instructions
 			};
 		} else {
-			columnsConfig[col.column] = {
+			columnsConfig[col.column.replaceAll('.', "%%%") ] = {
 				instructions
 			};
 		}
 	});
-
+	console.log('Columns config', columnsConfig);
 	return columnsConfig;
 };
 // Calculates the maximum height of the cells in each row