@abcagency/hc-ui-components 1.3.3 → 1.3.4
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/dist/hooks/useList.js +5 -12
- package/dist/hooks/useList.js.map +1 -1
- package/package.json +1 -1
- package/src/hooks/useList.js +5 -15
package/dist/hooks/useList.js
CHANGED
|
@@ -40,8 +40,7 @@ var useListLogic = function useListLogic() {
|
|
|
40
40
|
localStorage.setItem('sortSetting', JSON.stringify(sortSetting));
|
|
41
41
|
var listingFiltered = dynamicSort(filteredListings, sortSetting.field, sortSetting.type);
|
|
42
42
|
setFilteredListings(listingFiltered);
|
|
43
|
-
|
|
44
|
-
}, [sortSetting]);
|
|
43
|
+
}, [sortSetting, filteredListings, setFilteredListings]);
|
|
45
44
|
useEffect(function () {
|
|
46
45
|
observer.current = new IntersectionObserver(handleObserver, {
|
|
47
46
|
root: scrollContainerRef.current,
|
|
@@ -56,8 +55,7 @@ var useListLogic = function useListLogic() {
|
|
|
56
55
|
observer.current.unobserve(loader.current);
|
|
57
56
|
}
|
|
58
57
|
};
|
|
59
|
-
|
|
60
|
-
}, [loader.current, itemLimit, filteredListings.length]);
|
|
58
|
+
}, [filteredListings.length, itemLimit]);
|
|
61
59
|
useEffect(function () {
|
|
62
60
|
localStorage.setItem('scrollPosition', scrollPosition.toString());
|
|
63
61
|
}, [scrollPosition]);
|
|
@@ -66,10 +64,9 @@ var useListLogic = function useListLogic() {
|
|
|
66
64
|
if (parseInt(savedScrollPosition) > 3000) {
|
|
67
65
|
setItemLimit(savedScrollPosition / 10);
|
|
68
66
|
}
|
|
69
|
-
if (savedScrollPosition &&
|
|
70
|
-
// eslint-disable-next-line no-unused-vars
|
|
71
|
-
scrollContainerRef.current;
|
|
67
|
+
if (savedScrollPosition && scrollContainerRef.current) {
|
|
72
68
|
setTimeout(function () {
|
|
69
|
+
scrollContainerRef.current.scrollTop = parseInt(savedScrollPosition, 10);
|
|
73
70
|
}, 300);
|
|
74
71
|
}
|
|
75
72
|
}, []);
|
|
@@ -83,8 +80,7 @@ var useListLogic = function useListLogic() {
|
|
|
83
80
|
scrollContainer.removeEventListener('scroll', handleScroll);
|
|
84
81
|
}
|
|
85
82
|
};
|
|
86
|
-
|
|
87
|
-
}, [scrollContainerRef.current]);
|
|
83
|
+
}, []);
|
|
88
84
|
var handleObserver = function handleObserver(entities) {
|
|
89
85
|
var target = entities[0];
|
|
90
86
|
if (!target.isIntersecting) return;
|
|
@@ -96,9 +92,6 @@ var useListLogic = function useListLogic() {
|
|
|
96
92
|
observer.current.disconnect();
|
|
97
93
|
}
|
|
98
94
|
};
|
|
99
|
-
if (sortSetting) {
|
|
100
|
-
dynamicSort(filteredListings, sortSetting.field, sortSetting.type);
|
|
101
|
-
}
|
|
102
95
|
var handleScroll = function handleScroll() {
|
|
103
96
|
if (scrollContainerRef.current) {
|
|
104
97
|
setScrollPosition(scrollContainerRef.current.scrollTop);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useList.js","sources":["../../src/hooks/useList.js"],"sourcesContent":["import { useEffect, useState, useRef } from 'react';\n\nimport { getStorageObject } from '~/util/localStorageUtil';\nimport { dynamicSort } from '~/util/sortUtil';\n\nimport { useMapList } from '~/contexts/mapListContext';\n\nconst getDefaultItemId = () => {\n\tlet item = getStorageObject(\"selectedListItem\");\n\tif (item?.expanded == true) {\n\t\treturn item.id;\n\t} else {\n\t\treturn null;\n\t}\n};\n\nconst useListLogic = () => {\n\tconst [itemLimit, setItemLimit] = useState(100);\n\tconst [expandedId] = useState(getDefaultItemId());\n\tconst [sortSetting, setSortSetting] = useState(getStorageObject('sortSetting', null));\n\tconst [scrollPosition, setScrollPosition] = useState(getStorageObject('scrollPosition', 0));\n\tconst loader = useRef(null);\n\tconst scrollContainerRef = useRef(null);\n\tconst itemRefs = useRef({});\n\tconst observer = useRef(null);\n\tconst { filteredListings, setFilteredListings } = useMapList();\n\n\tuseEffect(() => {\n\t\tif (!sortSetting) return;\n\t\tlocalStorage.setItem('sortSetting', JSON.stringify(sortSetting));\n\t\tlet listingFiltered = dynamicSort(filteredListings, sortSetting.field, sortSetting.type);\n\t\tsetFilteredListings(listingFiltered);\n\t
|
|
1
|
+
{"version":3,"file":"useList.js","sources":["../../src/hooks/useList.js"],"sourcesContent":["import { useEffect, useState, useRef } from 'react';\n\nimport { getStorageObject } from '~/util/localStorageUtil';\nimport { dynamicSort } from '~/util/sortUtil';\n\nimport { useMapList } from '~/contexts/mapListContext';\n\nconst getDefaultItemId = () => {\n\tlet item = getStorageObject(\"selectedListItem\");\n\tif (item?.expanded == true) {\n\t\treturn item.id;\n\t} else {\n\t\treturn null;\n\t}\n};\n\nconst useListLogic = () => {\n\tconst [itemLimit, setItemLimit] = useState(100);\n\tconst [expandedId] = useState(getDefaultItemId());\n\tconst [sortSetting, setSortSetting] = useState(getStorageObject('sortSetting', null));\n\tconst [scrollPosition, setScrollPosition] = useState(getStorageObject('scrollPosition', 0));\n\tconst loader = useRef(null);\n\tconst scrollContainerRef = useRef(null);\n\tconst itemRefs = useRef({});\n\tconst observer = useRef(null);\n\tconst { filteredListings, setFilteredListings } = useMapList();\n\n\tuseEffect(() => {\n\t\tif (!sortSetting) return;\n\t\tlocalStorage.setItem('sortSetting', JSON.stringify(sortSetting));\n\t\tlet listingFiltered = dynamicSort(filteredListings, sortSetting.field, sortSetting.type);\n\t\tsetFilteredListings(listingFiltered);\n\t}, [sortSetting, filteredListings, setFilteredListings]);\n\n\tuseEffect(() => {\n\t\tobserver.current = new IntersectionObserver(handleObserver, {\n\t\t\troot: scrollContainerRef.current,\n\t\t\trootMargin: \"100px 0px\",\n\t\t\tthreshold: 0.5\n\t\t});\n\t\tif (loader.current) {\n\t\t\tobserver.current.observe(loader.current);\n\t\t}\n\t\treturn () => {\n\t\t\tif (observer.current && loader.current) {\n\t\t\t\tobserver.current.unobserve(loader.current);\n\t\t\t}\n\t\t};\n\t}, [filteredListings.length, itemLimit]);\n\n\tuseEffect(() => {\n\t\tlocalStorage.setItem('scrollPosition', scrollPosition.toString());\n\t}, [scrollPosition]);\n\n\tuseEffect(() => {\n\t\tconst savedScrollPosition = scrollPosition;\n\t\tif (parseInt(savedScrollPosition) > 3000) {\n\t\t\tsetItemLimit(savedScrollPosition / 10);\n\t\t}\n\t\tif (savedScrollPosition && scrollContainerRef.current) {\n\t\t\tsetTimeout(() => {\n\t\t\t\tscrollContainerRef.current.scrollTop = parseInt(savedScrollPosition, 10);\n\t\t\t}, 300);\n\t\t}\n\t}, []);\n\n\tuseEffect(() => {\n\t\tconst scrollContainer = scrollContainerRef.current;\n\t\tif (scrollContainer) {\n\t\t\tscrollContainer.addEventListener('scroll', handleScroll);\n\t\t}\n\t\treturn () => {\n\t\t\tif (scrollContainer) {\n\t\t\t\tscrollContainer.removeEventListener('scroll', handleScroll);\n\t\t\t}\n\t\t};\n\t}, []);\n\n\tconst handleObserver = entities => {\n\t\tconst target = entities[0];\n\t\tif (!target.isIntersecting) return;\n\t\tif (filteredListings.length > itemLimit) {\n\t\t\tsetItemLimit(prevLimit => prevLimit + 100);\n\t\t} else if (observer.current) {\n\t\t\tobserver.current.disconnect();\n\t\t}\n\t};\n\n\tconst handleScroll = () => {\n\t\tif (scrollContainerRef.current) {\n\t\t\tsetScrollPosition(scrollContainerRef.current.scrollTop);\n\t\t}\n\t};\n\n\treturn { itemLimit, expandedId, sortSetting, scrollPosition, loader, scrollContainerRef, itemRefs, setSortSetting, setScrollPosition, dynamicSort, filteredListings };\n};\n\nexport default useListLogic;\n"],"names":["getDefaultItemId","item","getStorageObject","expanded","id","useListLogic","_useState","useState","_useState2","_slicedToArray","itemLimit","setItemLimit","_useState3","_useState4","expandedId","_useState5","_useState6","sortSetting","setSortSetting","_useState7","_useState8","scrollPosition","setScrollPosition","loader","useRef","scrollContainerRef","itemRefs","observer","_useMapList","useMapList","filteredListings","setFilteredListings","useEffect","localStorage","setItem","JSON","stringify","listingFiltered","dynamicSort","field","type","current","IntersectionObserver","handleObserver","root","rootMargin","threshold","observe","unobserve","length","toString","savedScrollPosition","parseInt","setTimeout","scrollTop","scrollContainer","addEventListener","handleScroll","removeEventListener","entities","target","isIntersecting","prevLimit","disconnect"],"mappings":"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"}
|
package/package.json
CHANGED
package/src/hooks/useList.js
CHANGED
|
@@ -30,8 +30,7 @@ const useListLogic = () => {
|
|
|
30
30
|
localStorage.setItem('sortSetting', JSON.stringify(sortSetting));
|
|
31
31
|
let listingFiltered = dynamicSort(filteredListings, sortSetting.field, sortSetting.type);
|
|
32
32
|
setFilteredListings(listingFiltered);
|
|
33
|
-
|
|
34
|
-
}, [sortSetting]);
|
|
33
|
+
}, [sortSetting, filteredListings, setFilteredListings]);
|
|
35
34
|
|
|
36
35
|
useEffect(() => {
|
|
37
36
|
observer.current = new IntersectionObserver(handleObserver, {
|
|
@@ -47,8 +46,7 @@ const useListLogic = () => {
|
|
|
47
46
|
observer.current.unobserve(loader.current);
|
|
48
47
|
}
|
|
49
48
|
};
|
|
50
|
-
|
|
51
|
-
}, [loader.current, itemLimit, filteredListings.length]);
|
|
49
|
+
}, [filteredListings.length, itemLimit]);
|
|
52
50
|
|
|
53
51
|
useEffect(() => {
|
|
54
52
|
localStorage.setItem('scrollPosition', scrollPosition.toString());
|
|
@@ -59,11 +57,9 @@ const useListLogic = () => {
|
|
|
59
57
|
if (parseInt(savedScrollPosition) > 3000) {
|
|
60
58
|
setItemLimit(savedScrollPosition / 10);
|
|
61
59
|
}
|
|
62
|
-
if (savedScrollPosition &&
|
|
63
|
-
// eslint-disable-next-line no-unused-vars
|
|
64
|
-
let scrollContainerRefCurrent = scrollContainerRef.current;
|
|
60
|
+
if (savedScrollPosition && scrollContainerRef.current) {
|
|
65
61
|
setTimeout(() => {
|
|
66
|
-
|
|
62
|
+
scrollContainerRef.current.scrollTop = parseInt(savedScrollPosition, 10);
|
|
67
63
|
}, 300);
|
|
68
64
|
}
|
|
69
65
|
}, []);
|
|
@@ -78,8 +74,7 @@ const useListLogic = () => {
|
|
|
78
74
|
scrollContainer.removeEventListener('scroll', handleScroll);
|
|
79
75
|
}
|
|
80
76
|
};
|
|
81
|
-
|
|
82
|
-
}, [scrollContainerRef.current]);
|
|
77
|
+
}, []);
|
|
83
78
|
|
|
84
79
|
const handleObserver = entities => {
|
|
85
80
|
const target = entities[0];
|
|
@@ -89,13 +84,8 @@ const useListLogic = () => {
|
|
|
89
84
|
} else if (observer.current) {
|
|
90
85
|
observer.current.disconnect();
|
|
91
86
|
}
|
|
92
|
-
|
|
93
87
|
};
|
|
94
88
|
|
|
95
|
-
if (sortSetting) {
|
|
96
|
-
dynamicSort(filteredListings, sortSetting.field, sortSetting.type);
|
|
97
|
-
}
|
|
98
|
-
|
|
99
89
|
const handleScroll = () => {
|
|
100
90
|
if (scrollContainerRef.current) {
|
|
101
91
|
setScrollPosition(scrollContainerRef.current.scrollTop);
|