@tap-payments/os-micro-frontend-shared 0.1.136-test.2 → 0.1.136-test.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/build/components/VirtualTables/SheetViewVirtualTable/hooks/usePerformanceOptimizations.js
CHANGED
|
@@ -1,88 +1,22 @@
|
|
|
1
1
|
import { useMemo, useRef } from 'react';
|
|
2
|
-
// Deep comparison helper for filter data
|
|
3
|
-
const areFilterDataEqual = (data1, data2) => {
|
|
4
|
-
if (data1 === data2)
|
|
5
|
-
return true;
|
|
6
|
-
if (!data1 || !data2)
|
|
7
|
-
return false;
|
|
8
|
-
const keys1 = Object.keys(data1);
|
|
9
|
-
const keys2 = Object.keys(data2);
|
|
10
|
-
if (keys1.length !== keys2.length)
|
|
11
|
-
return false;
|
|
12
|
-
return keys1.every((key) => {
|
|
13
|
-
const val1 = data1[key];
|
|
14
|
-
const val2 = data2[key];
|
|
15
|
-
if (Array.isArray(val1) && Array.isArray(val2)) {
|
|
16
|
-
return val1.length === val2.length && val1.every((v, i) => v === val2[i]);
|
|
17
|
-
}
|
|
18
|
-
if (typeof val1 === 'object' && typeof val2 === 'object' && val1 && val2) {
|
|
19
|
-
return JSON.stringify(val1) === JSON.stringify(val2);
|
|
20
|
-
}
|
|
21
|
-
return val1 === val2;
|
|
22
|
-
});
|
|
23
|
-
};
|
|
24
2
|
export const usePerformanceOptimizations = (columns) => {
|
|
25
3
|
// Create stable column references to prevent unnecessary re-renders
|
|
26
4
|
const stableColumnsRef = useRef([]);
|
|
27
|
-
const isFirstRenderRef = useRef(true);
|
|
28
|
-
const filterChangeTrackingRef = useRef(new Map());
|
|
29
5
|
const stableColumns = useMemo(() => {
|
|
30
|
-
//
|
|
31
|
-
|
|
32
|
-
isFirstRenderRef.current = false;
|
|
33
|
-
stableColumnsRef.current = [...columns];
|
|
34
|
-
// Initialize filter tracking
|
|
35
|
-
columns.forEach((col) => {
|
|
36
|
-
var _a;
|
|
37
|
-
filterChangeTrackingRef.current.set(col.id, (_a = col.filter) === null || _a === void 0 ? void 0 : _a.data);
|
|
38
|
-
});
|
|
39
|
-
return stableColumnsRef.current;
|
|
40
|
-
}
|
|
41
|
-
// After first render, only update if structural changes or filter changes occurred
|
|
42
|
-
const structurallyChanged = columns.length !== stableColumnsRef.current.length ||
|
|
6
|
+
// Only update if columns have actually changed (deep comparison of essential properties)
|
|
7
|
+
const hasChanged = columns.length !== stableColumnsRef.current.length ||
|
|
43
8
|
columns.some((col, index) => {
|
|
44
9
|
const prevCol = stableColumnsRef.current[index];
|
|
45
|
-
console.log({ colFilter: col.filter, prevColFilter: prevCol === null || prevCol === void 0 ? void 0 : prevCol.filter });
|
|
46
10
|
return (!prevCol ||
|
|
47
11
|
col.id !== prevCol.id ||
|
|
48
12
|
col.width !== prevCol.width ||
|
|
49
13
|
col.pinned !== prevCol.pinned ||
|
|
50
14
|
col.hidden !== prevCol.hidden ||
|
|
51
|
-
col.order !== prevCol.order
|
|
15
|
+
col.order !== prevCol.order ||
|
|
16
|
+
col.filter !== prevCol.filter);
|
|
52
17
|
});
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
columns.forEach((col) => {
|
|
56
|
-
var _a;
|
|
57
|
-
const colId = col.id;
|
|
58
|
-
const prevFilterData = filterChangeTrackingRef.current.get(colId);
|
|
59
|
-
const currentFilterData = (_a = col.filter) === null || _a === void 0 ? void 0 : _a.data;
|
|
60
|
-
if (!areFilterDataEqual(prevFilterData, currentFilterData)) {
|
|
61
|
-
columnsWithFilterChanges.add(colId);
|
|
62
|
-
filterChangeTrackingRef.current.set(colId, currentFilterData);
|
|
63
|
-
}
|
|
64
|
-
});
|
|
65
|
-
// Only update if there are structural changes or filter changes
|
|
66
|
-
if (structurallyChanged || columnsWithFilterChanges.size > 0) {
|
|
67
|
-
// For filter-only changes, update only the affected columns
|
|
68
|
-
if (!structurallyChanged && columnsWithFilterChanges.size > 0) {
|
|
69
|
-
// Create a new array but preserve references for unchanged columns
|
|
70
|
-
const updatedColumns = stableColumnsRef.current.map((stableCol, index) => {
|
|
71
|
-
const newCol = columns[index];
|
|
72
|
-
const colId = newCol === null || newCol === void 0 ? void 0 : newCol.id;
|
|
73
|
-
// Only replace if this column's filter changed
|
|
74
|
-
if (columnsWithFilterChanges.has(colId)) {
|
|
75
|
-
return newCol;
|
|
76
|
-
}
|
|
77
|
-
// Keep the stable reference for unchanged columns
|
|
78
|
-
return stableCol;
|
|
79
|
-
});
|
|
80
|
-
stableColumnsRef.current = updatedColumns;
|
|
81
|
-
}
|
|
82
|
-
else {
|
|
83
|
-
// Full update for structural changes
|
|
84
|
-
stableColumnsRef.current = [...columns];
|
|
85
|
-
}
|
|
18
|
+
if (hasChanged) {
|
|
19
|
+
stableColumnsRef.current = [...columns];
|
|
86
20
|
}
|
|
87
21
|
return stableColumnsRef.current;
|
|
88
22
|
}, [columns]);
|
package/package.json
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tap-payments/os-micro-frontend-shared",
|
|
3
3
|
"description": "Shared components and utilities for Tap Payments micro frontends",
|
|
4
|
-
"version": "0.1.136-test.
|
|
5
|
-
"testVersion":
|
|
4
|
+
"version": "0.1.136-test.3",
|
|
5
|
+
"testVersion": 3,
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "build/index.js",
|
|
8
8
|
"module": "build/index.js",
|