@promoboxx/use-filter 1.5.0 → 1.5.1
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/useSimpleFilter.d.ts +29 -0
- package/dist/useSimpleFilter.js +135 -0
- package/package.json +18 -16
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
export interface SimpleFilterInfo<TFilter> {
|
|
2
|
+
filter: TFilter;
|
|
3
|
+
sort?: string;
|
|
4
|
+
offset: number;
|
|
5
|
+
page: number;
|
|
6
|
+
pageSize: number;
|
|
7
|
+
lastRefreshAt: number;
|
|
8
|
+
shouldRunImmediately: boolean;
|
|
9
|
+
}
|
|
10
|
+
interface UseSimpleFilterOptions<TFilter> {
|
|
11
|
+
defaultFilterInfo?: Partial<SimpleFilterInfo<TFilter>>;
|
|
12
|
+
debounceDuration?: number;
|
|
13
|
+
}
|
|
14
|
+
declare function useSimpleFilter<TFilter>(namespace: string, options: UseSimpleFilterOptions<TFilter>): {
|
|
15
|
+
isLoading: boolean;
|
|
16
|
+
filterInfo: SimpleFilterInfo<TFilter>;
|
|
17
|
+
debouncedFilterInfo: SimpleFilterInfo<TFilter>;
|
|
18
|
+
updateFilter: (filter: Partial<TFilter>, shouldRunImmediately?: any) => void;
|
|
19
|
+
pagingInfo: (total: string | number | null | undefined) => {
|
|
20
|
+
totalResults: number;
|
|
21
|
+
totalPages: number;
|
|
22
|
+
};
|
|
23
|
+
resetFilter: (shouldRunImmediately?: any) => void;
|
|
24
|
+
setOffset: (offset: number | string, shouldRunImmediately?: any) => void;
|
|
25
|
+
setPage: (page: number | string, shouldRunImmediately?: any) => void;
|
|
26
|
+
setSort: (sort: string, shouldRunImmediately?: any) => void;
|
|
27
|
+
forceRefresh: (shouldRunImmediately?: any) => void;
|
|
28
|
+
};
|
|
29
|
+
export default useSimpleFilter;
|
|
@@ -0,0 +1,135 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
var react_1 = require("react");
|
|
18
|
+
var getOffsetFromPage_1 = __importDefault(require("./lib/getOffsetFromPage"));
|
|
19
|
+
var getPageFromOffset_1 = __importDefault(require("./lib/getPageFromOffset"));
|
|
20
|
+
var shallowEqual_1 = __importDefault(require("./lib/shallowEqual"));
|
|
21
|
+
var store_1 = require("./store");
|
|
22
|
+
function useSimpleFilter(namespace, options) {
|
|
23
|
+
// Having these types of refs helps get around rules of hooks, and they need
|
|
24
|
+
// to be updated each render.
|
|
25
|
+
var ctxRefValue = {
|
|
26
|
+
namespace: namespace,
|
|
27
|
+
debounceDuration: options.debounceDuration,
|
|
28
|
+
defaultFilterInfo: options.defaultFilterInfo,
|
|
29
|
+
};
|
|
30
|
+
var ctxRef = react_1.useRef(ctxRefValue);
|
|
31
|
+
react_1.useEffect(function () {
|
|
32
|
+
ctxRef.current = ctxRefValue;
|
|
33
|
+
});
|
|
34
|
+
var _a = react_1.useState(false), isLoading = _a[0], setIsLoading = _a[1];
|
|
35
|
+
var _b = react_1.useState(function () {
|
|
36
|
+
return store_1.getFilterStore().getFilter(namespace) ||
|
|
37
|
+
buildDefaultFilterInfo(options.defaultFilterInfo);
|
|
38
|
+
}), filterInfo = _b[0], setFilterInfoState = _b[1];
|
|
39
|
+
var _c = react_1.useState(filterInfo), debouncedFilterInfo = _c[0], setDebouncedFilterInfo = _c[1];
|
|
40
|
+
// Not sure this is needed in simple mode?
|
|
41
|
+
var lastRefreshAtRef = react_1.useRef(-1);
|
|
42
|
+
react_1.useEffect(function () {
|
|
43
|
+
var _a;
|
|
44
|
+
setIsLoading(true);
|
|
45
|
+
// If the lastRefreshAt hasn't changed, don't do anything.
|
|
46
|
+
if (lastRefreshAtRef.current === filterInfo.lastRefreshAt) {
|
|
47
|
+
setIsLoading(false);
|
|
48
|
+
return;
|
|
49
|
+
}
|
|
50
|
+
var timeout = undefined;
|
|
51
|
+
function makeRequest() {
|
|
52
|
+
lastRefreshAtRef.current = filterInfo.lastRefreshAt;
|
|
53
|
+
store_1.getFilterStore().saveFilter(ctxRef.current.namespace, filterInfo);
|
|
54
|
+
setDebouncedFilterInfo(filterInfo);
|
|
55
|
+
setIsLoading(false);
|
|
56
|
+
}
|
|
57
|
+
if (filterInfo.shouldRunImmediately) {
|
|
58
|
+
makeRequest();
|
|
59
|
+
}
|
|
60
|
+
else {
|
|
61
|
+
timeout = setTimeout(makeRequest, (_a = ctxRef.current.debounceDuration) !== null && _a !== void 0 ? _a : 500);
|
|
62
|
+
}
|
|
63
|
+
return function () {
|
|
64
|
+
if (timeout) {
|
|
65
|
+
clearTimeout(timeout);
|
|
66
|
+
}
|
|
67
|
+
};
|
|
68
|
+
}, [filterInfo]);
|
|
69
|
+
var previousTotalRef = react_1.useRef(0);
|
|
70
|
+
return {
|
|
71
|
+
isLoading: isLoading,
|
|
72
|
+
filterInfo: filterInfo,
|
|
73
|
+
debouncedFilterInfo: debouncedFilterInfo,
|
|
74
|
+
updateFilter: react_1.useCallback(function (filter, shouldRunImmediately) {
|
|
75
|
+
if (shouldRunImmediately === void 0) { shouldRunImmediately = false; }
|
|
76
|
+
setFilterInfoState(function (previous) {
|
|
77
|
+
var nextFilter = __assign(__assign({}, previous.filter), filter);
|
|
78
|
+
if (shallowEqual_1.default(previous.filter, nextFilter)) {
|
|
79
|
+
return previous;
|
|
80
|
+
}
|
|
81
|
+
return __assign(__assign({}, previous), { shouldRunImmediately: shouldRunImmediately, offset: 0, page: 1, totalResults: 1, totalPages: 1, filter: nextFilter, lastRefreshAt: new Date().getTime() });
|
|
82
|
+
});
|
|
83
|
+
}, []),
|
|
84
|
+
pagingInfo: react_1.useCallback(function (total) {
|
|
85
|
+
var normalized = Number(
|
|
86
|
+
// Because we accept `null` as an argument, we can't do something as
|
|
87
|
+
// simple as `total ?? ...`
|
|
88
|
+
total == null ? previousTotalRef.current : total);
|
|
89
|
+
previousTotalRef.current = normalized;
|
|
90
|
+
return {
|
|
91
|
+
totalResults: normalized,
|
|
92
|
+
totalPages: Math.ceil(normalized / filterInfo.pageSize),
|
|
93
|
+
};
|
|
94
|
+
}, [filterInfo.pageSize]),
|
|
95
|
+
resetFilter: react_1.useCallback(function (shouldRunImmediately) {
|
|
96
|
+
if (shouldRunImmediately === void 0) { shouldRunImmediately = false; }
|
|
97
|
+
setFilterInfoState(__assign(__assign({}, buildDefaultFilterInfo(ctxRef.current.defaultFilterInfo)), { shouldRunImmediately: shouldRunImmediately }));
|
|
98
|
+
}, []),
|
|
99
|
+
setOffset: react_1.useCallback(function (offset, shouldRunImmediately) {
|
|
100
|
+
if (shouldRunImmediately === void 0) { shouldRunImmediately = false; }
|
|
101
|
+
var offsetNumber = Number(offset);
|
|
102
|
+
setFilterInfoState(function (previous) { return (__assign(__assign({}, previous), { offset: offsetNumber, page: getPageFromOffset_1.default(offsetNumber, previous.pageSize), lastRefreshAt: new Date().getTime(), shouldRunImmediately: shouldRunImmediately })); });
|
|
103
|
+
}, []),
|
|
104
|
+
setPage: react_1.useCallback(function (page, shouldRunImmediately) {
|
|
105
|
+
if (shouldRunImmediately === void 0) { shouldRunImmediately = false; }
|
|
106
|
+
var pageNumber = Number(page);
|
|
107
|
+
setFilterInfoState(function (previous) { return (__assign(__assign({}, previous), { offset: getOffsetFromPage_1.default(pageNumber, previous.pageSize), page: pageNumber, lastRefreshAt: new Date().getTime(), shouldRunImmediately: shouldRunImmediately })); });
|
|
108
|
+
}, []),
|
|
109
|
+
setSort: react_1.useCallback(function (sort, shouldRunImmediately) {
|
|
110
|
+
if (shouldRunImmediately === void 0) { shouldRunImmediately = false; }
|
|
111
|
+
setFilterInfoState(function (previous) { return (__assign(__assign({}, previous), { sort: sort, lastRefreshAt: new Date().getTime(), shouldRunImmediately: shouldRunImmediately })); });
|
|
112
|
+
}, []),
|
|
113
|
+
forceRefresh: react_1.useCallback(function (shouldRunImmediately) {
|
|
114
|
+
if (shouldRunImmediately === void 0) { shouldRunImmediately = false; }
|
|
115
|
+
setFilterInfoState(function (previous) { return (__assign(__assign({}, previous), { lastRefreshAt: new Date().getTime(), shouldRunImmediately: shouldRunImmediately })); });
|
|
116
|
+
}, []),
|
|
117
|
+
};
|
|
118
|
+
}
|
|
119
|
+
function buildDefaultFilterInfo(filterInfo) {
|
|
120
|
+
if (filterInfo === void 0) { filterInfo = {}; }
|
|
121
|
+
var merged = __assign({
|
|
122
|
+
// Cast here to work around "'T' could be instantiated with an arbitrary
|
|
123
|
+
// type which could be unrelated to '{}'"
|
|
124
|
+
filter: {}, sort: undefined, pageSize: 20, lastRefreshAt: new Date().getTime(), offset: 0, page: 1, shouldRunImmediately: false }, filterInfo);
|
|
125
|
+
// If there's a page but no offset, set the offset.
|
|
126
|
+
if (filterInfo.page != null && filterInfo.offset == null) {
|
|
127
|
+
merged.offset = getOffsetFromPage_1.default(filterInfo.page, merged.pageSize);
|
|
128
|
+
// If there's an offset but no page, set the page.
|
|
129
|
+
}
|
|
130
|
+
else if (filterInfo.page == null && filterInfo.offset != null) {
|
|
131
|
+
merged.page = getPageFromOffset_1.default(filterInfo.offset, merged.pageSize);
|
|
132
|
+
}
|
|
133
|
+
return merged;
|
|
134
|
+
}
|
|
135
|
+
exports.default = useSimpleFilter;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@promoboxx/use-filter",
|
|
3
|
-
"version": "1.5.
|
|
3
|
+
"version": "1.5.1",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "dist/useFilter.js",
|
|
6
6
|
"keywords": [],
|
|
@@ -21,27 +21,29 @@
|
|
|
21
21
|
"typescript": "^4.3.5"
|
|
22
22
|
},
|
|
23
23
|
"files": [
|
|
24
|
+
"dist/lib/getOffsetFromPage.d.ts",
|
|
25
|
+
"dist/lib/getPageFromOffset.d.ts",
|
|
26
|
+
"dist/lib/getPageFromOffset.js",
|
|
27
|
+
"dist/lib/shallowEqual.d.ts",
|
|
28
|
+
"dist/lib/shallowEqual.js",
|
|
29
|
+
"dist/lib/buildDefaultFilterInfo.d.ts",
|
|
30
|
+
"dist/lib/getOffsetFromPage.js",
|
|
31
|
+
"dist/lib/buildDefaultFilterInfo.js",
|
|
24
32
|
"dist/useFilter.d.ts",
|
|
33
|
+
"dist/useFilter.js",
|
|
34
|
+
"dist/useSimpleFilter.d.ts",
|
|
35
|
+
"dist/useSimpleFilter.js",
|
|
36
|
+
"dist/store/memoryStore.d.ts",
|
|
37
|
+
"dist/store/reduxStore.d.ts",
|
|
38
|
+
"dist/store/localStorageStore.d.ts",
|
|
39
|
+
"dist/store/reduxHelpers/createReducer.d.ts",
|
|
25
40
|
"dist/store/reduxHelpers/createActions.d.ts",
|
|
26
|
-
"dist/store/reduxHelpers/createReducer.js",
|
|
27
41
|
"dist/store/reduxHelpers/createActions.js",
|
|
28
|
-
"dist/store/reduxHelpers/createReducer.
|
|
29
|
-
"dist/store/reduxStore.d.ts",
|
|
42
|
+
"dist/store/reduxHelpers/createReducer.js",
|
|
30
43
|
"dist/store/index.d.ts",
|
|
31
44
|
"dist/store/index.js",
|
|
32
45
|
"dist/store/localStorageStore.js",
|
|
33
46
|
"dist/store/memoryStore.js",
|
|
34
|
-
"dist/store/reduxStore.js"
|
|
35
|
-
"dist/store/memoryStore.d.ts",
|
|
36
|
-
"dist/store/localStorageStore.d.ts",
|
|
37
|
-
"dist/useFilter.js",
|
|
38
|
-
"dist/lib/buildDefaultFilterInfo.js",
|
|
39
|
-
"dist/lib/shallowEqual.js",
|
|
40
|
-
"dist/lib/getOffsetFromPage.js",
|
|
41
|
-
"dist/lib/buildDefaultFilterInfo.d.ts",
|
|
42
|
-
"dist/lib/getOffsetFromPage.d.ts",
|
|
43
|
-
"dist/lib/getPageFromOffset.js",
|
|
44
|
-
"dist/lib/shallowEqual.d.ts",
|
|
45
|
-
"dist/lib/getPageFromOffset.d.ts"
|
|
47
|
+
"dist/store/reduxStore.js"
|
|
46
48
|
]
|
|
47
49
|
}
|