pixel-react 1.10.21 → 1.10.22
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.
|
@@ -5,46 +5,28 @@ import TableHead from './Components/TableHead';
|
|
|
5
5
|
import TableBody from './Components/TableBody';
|
|
6
6
|
import { throttle } from '../../utils/throttle/throttle';
|
|
7
7
|
const TreeTable = ({ treeData, columnsData, selected = [], select = null, onChange, onClick, onExpand, loadMore = () => { }, tableBorder, height = 'auto', newNode = {}, onAddConfirm = (_name) => { }, onAddCancel = () => { }, }) => {
|
|
8
|
+
console.log('🚀 ~ treeData:', treeData);
|
|
8
9
|
const [expanding, setExpanding] = useState(null);
|
|
9
10
|
const observerRef = useRef(null);
|
|
10
|
-
const isTriggeredAbove = useRef(false);
|
|
11
|
-
const isTriggeredBelow = useRef(false);
|
|
11
|
+
const isTriggeredAbove = useRef(false); // Track if pagination for "above" direction has been triggered
|
|
12
|
+
const isTriggeredBelow = useRef(false); // Track if pagination for "below" direction has been triggered
|
|
13
|
+
const isTriggeredOnce = useRef(false); // Ensure 2-second delay triggers only once
|
|
12
14
|
// Throttled version of loadMore
|
|
13
15
|
const throttledLoadMore = useRef(throttle((direction) => {
|
|
14
16
|
loadMore(direction);
|
|
15
17
|
}, 300)).current;
|
|
16
|
-
useEffect(() => {
|
|
17
|
-
// Reset flags only if first or last node has `lastResource: false`
|
|
18
|
-
const isLastResourceAbove = !!treeData[0]?.lastResource;
|
|
19
|
-
const isLastResourceBelow = !!treeData[treeData.length - 1]?.lastResource;
|
|
20
|
-
if (!isLastResourceAbove) {
|
|
21
|
-
isTriggeredAbove.current = false;
|
|
22
|
-
}
|
|
23
|
-
if (!isLastResourceBelow) {
|
|
24
|
-
isTriggeredBelow.current = false;
|
|
25
|
-
}
|
|
26
|
-
const scrollContainer = document.getElementById('ff-table-tree-scroll-container');
|
|
27
|
-
const firstNode = document.getElementById('ff-table-tree-first-node');
|
|
28
|
-
const lastNode = document.getElementById('ff-table-tree-last-node');
|
|
29
|
-
if (!scrollContainer || !firstNode || !lastNode || !treeData?.length)
|
|
30
|
-
return;
|
|
31
|
-
// Reattach observers only if needed
|
|
32
|
-
if (!isLastResourceAbove)
|
|
33
|
-
observerRef.current?.observe(firstNode);
|
|
34
|
-
if (!isLastResourceBelow)
|
|
35
|
-
observerRef.current?.observe(lastNode);
|
|
36
|
-
return () => {
|
|
37
|
-
observerRef.current?.disconnect();
|
|
38
|
-
};
|
|
39
|
-
}, [treeData]);
|
|
40
18
|
useEffect(() => {
|
|
41
19
|
const scrollContainer = document.getElementById('ff-table-tree-scroll-container');
|
|
42
20
|
const firstNode = document.getElementById('ff-table-tree-first-node');
|
|
43
21
|
const lastNode = document.getElementById('ff-table-tree-last-node');
|
|
22
|
+
// Exit early if essential elements or data are missing
|
|
44
23
|
if (!scrollContainer || !firstNode || !lastNode || !treeData?.length)
|
|
45
24
|
return;
|
|
46
25
|
const isLastResourceAbove = !!treeData[0]?.lastResource;
|
|
47
26
|
const isLastResourceBelow = !!treeData[treeData.length - 1]?.lastResource;
|
|
27
|
+
console.log(isLastResourceAbove, 'isLastResourceAbove');
|
|
28
|
+
console.log(isLastResourceBelow, 'isLastResourceBelow');
|
|
29
|
+
// Skip pagination if both last resources are present
|
|
48
30
|
if (isLastResourceAbove && isLastResourceBelow)
|
|
49
31
|
return;
|
|
50
32
|
const observerCallback = (entries) => {
|
|
@@ -52,6 +34,7 @@ const TreeTable = ({ treeData, columnsData, selected = [], select = null, onChan
|
|
|
52
34
|
const nodeId = entry.target.id;
|
|
53
35
|
const direction = nodeId === 'ff-table-tree-last-node' ? 'below' : 'above';
|
|
54
36
|
if (entry.isIntersecting) {
|
|
37
|
+
// Trigger only once for each direction
|
|
55
38
|
if (direction === 'above' && !isTriggeredAbove.current) {
|
|
56
39
|
if (!isLastResourceAbove) {
|
|
57
40
|
throttledLoadMore(direction);
|
|
@@ -72,10 +55,39 @@ const TreeTable = ({ treeData, columnsData, selected = [], select = null, onChan
|
|
|
72
55
|
rootMargin: '8px',
|
|
73
56
|
threshold: 0.1,
|
|
74
57
|
});
|
|
75
|
-
if
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
58
|
+
// Initial pagination trigger after 2 seconds if first or last node is in view inside the scroll container
|
|
59
|
+
const checkInitialPaginationTrigger = () => {
|
|
60
|
+
if (isTriggeredOnce.current)
|
|
61
|
+
return;
|
|
62
|
+
const scrollContainerRect = scrollContainer.getBoundingClientRect();
|
|
63
|
+
const firstNodeRect = firstNode?.getBoundingClientRect();
|
|
64
|
+
const lastNodeRect = lastNode?.getBoundingClientRect();
|
|
65
|
+
// Check if the first node is inside the scroll container
|
|
66
|
+
const isFirstNodeInView = firstNodeRect &&
|
|
67
|
+
firstNodeRect.top >= scrollContainerRect.top &&
|
|
68
|
+
firstNodeRect.bottom <= scrollContainerRect.bottom;
|
|
69
|
+
// Check if the last node is inside the scroll container
|
|
70
|
+
const isLastNodeInView = lastNodeRect &&
|
|
71
|
+
lastNodeRect.top >= scrollContainerRect.top &&
|
|
72
|
+
lastNodeRect.bottom <= scrollContainerRect.bottom;
|
|
73
|
+
if (isFirstNodeInView || isLastNodeInView) {
|
|
74
|
+
isTriggeredOnce.current = true;
|
|
75
|
+
setTimeout(() => {
|
|
76
|
+
if (!isLastResourceAbove)
|
|
77
|
+
observerRef.current?.observe(firstNode);
|
|
78
|
+
if (!isLastResourceBelow)
|
|
79
|
+
observerRef.current?.observe(lastNode);
|
|
80
|
+
}, 2000); // Delay the first pagination trigger by 2 seconds
|
|
81
|
+
}
|
|
82
|
+
else {
|
|
83
|
+
// Observe first and last node immediately
|
|
84
|
+
if (!isLastResourceAbove)
|
|
85
|
+
observerRef.current?.observe(firstNode);
|
|
86
|
+
if (!isLastResourceBelow)
|
|
87
|
+
observerRef.current?.observe(lastNode);
|
|
88
|
+
}
|
|
89
|
+
};
|
|
90
|
+
checkInitialPaginationTrigger();
|
|
79
91
|
return () => {
|
|
80
92
|
observerRef.current?.disconnect();
|
|
81
93
|
throttledLoadMore.cancel();
|
|
@@ -112,7 +124,7 @@ const TreeTable = ({ treeData, columnsData, selected = [], select = null, onChan
|
|
|
112
124
|
onClick?.(e, node);
|
|
113
125
|
}, [onClick, expanding]);
|
|
114
126
|
return (_jsx("div", { className: "tree-table-wrap", children: _jsx("div", { className: "table-scrollable", id: "ff-table-tree-scroll-container", style: {
|
|
115
|
-
'--table-height': `${height
|
|
127
|
+
'--table-height': `${typeof height === 'string' ? height : height + 'px'}`,
|
|
116
128
|
border: tableBorder,
|
|
117
129
|
}, children: _jsxs("table", { className: "tree-table", children: [_jsx(TableHead, { columnsData: columnsData }), _jsx(TableBody, { flattenedTreeData: treeData, columnsData: columnsData, selected: selected, select: select, onRowClick: handleRowClick, onToggleExpand: handleToggleExpand, onCheckBoxChange: handleCheckBoxChange, newNode: newNode, onAddConfirm: onAddConfirm, onAddCancel: onAddCancel, expanding: expanding })] }) }) }));
|
|
118
130
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableTree.js","sourceRoot":"","sources":["../../../src/components/TableTree/TableTree.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxE,OAAO,kBAAkB,CAAC;AAE1B,OAAO,SAAS,MAAM,wBAAwB,CAAC;AAC/C,OAAO,SAAS,MAAM,wBAAwB,CAAC;AAE/C,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AAEzD,MAAM,SAAS,GAA6B,CAAC,EAC3C,QAAQ,EACR,WAAW,EACX,QAAQ,GAAG,EAAE,EACb,MAAM,GAAG,IAAI,EACb,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,QAAQ,GAAG,GAAG,EAAE,GAAE,CAAC,EACnB,WAAW,EACX,MAAM,GAAG,MAAM,EACf,OAAO,GAAG,EAAE,EACZ,YAAY,GAAG,CAAC,KAAK,EAAE,EAAE,GAAE,CAAC,EAC5B,WAAW,GAAG,GAAG,EAAE,GAAE,CAAC,GACvB,EAAE,EAAE;IACH,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAChE,MAAM,WAAW,GAAG,MAAM,CAA8B,IAAI,CAAC,CAAC;IAC9D,MAAM,gBAAgB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"TableTree.js","sourceRoot":"","sources":["../../../src/components/TableTree/TableTree.tsx"],"names":[],"mappings":"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"}
|