@ciwergrp/nuxid 1.2.2 → 1.3.0
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/module.json
CHANGED
|
@@ -13,6 +13,7 @@ export interface CursorMetaConfig {
|
|
|
13
13
|
}
|
|
14
14
|
export interface CursorFetchOptions<TRequest extends NitroFetchRequest = NitroFetchRequest> {
|
|
15
15
|
lazy?: boolean;
|
|
16
|
+
immediate?: boolean;
|
|
16
17
|
pollInterval?: number;
|
|
17
18
|
fetcher?: typeof $fetch;
|
|
18
19
|
fetchOptions?: NitroFetchOptions<TRequest>;
|
|
@@ -20,7 +21,7 @@ export interface CursorFetchOptions<TRequest extends NitroFetchRequest = NitroFe
|
|
|
20
21
|
itemKey?: string;
|
|
21
22
|
cursorParam?: string;
|
|
22
23
|
}
|
|
23
|
-
export declare function useCursorHttp<T extends Record<string, any> = any, TResponse extends APIResponseCursor<T> = APIResponseCursor<T>, TRequest extends NitroFetchRequest = NitroFetchRequest>(url: TRequest, options?: CursorFetchOptions<TRequest>): {
|
|
24
|
+
export declare function useCursorHttp<T extends Record<string, any> = any, TResponse extends APIResponseCursor<T> = APIResponseCursor<T>, TRequest extends NitroFetchRequest = NitroFetchRequest>(url: TRequest, options?: CursorFetchOptions<TRequest>): Promise<{
|
|
24
25
|
data: import("vue").Ref<TResponse | undefined, TResponse | undefined>;
|
|
25
26
|
loading: Readonly<import("vue").Ref<boolean, boolean>>;
|
|
26
27
|
error: Readonly<import("vue").Ref<Error | null, Error | null>>;
|
|
@@ -28,4 +29,5 @@ export declare function useCursorHttp<T extends Record<string, any> = any, TResp
|
|
|
28
29
|
isLoadMoreTriggered: Readonly<import("vue").Ref<boolean, boolean>>;
|
|
29
30
|
loadMore: () => Promise<void>;
|
|
30
31
|
refresh: () => Promise<void>;
|
|
31
|
-
|
|
32
|
+
init: () => Promise<void>;
|
|
33
|
+
}>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { isRef, onUnmounted, readonly, ref, shallowRef, watch } from "vue";
|
|
2
|
-
export function useCursorHttp(url, options) {
|
|
2
|
+
export async function useCursorHttp(url, options) {
|
|
3
3
|
function findReactiveSources(obj) {
|
|
4
4
|
const sources = [];
|
|
5
5
|
if (!obj || typeof obj !== "object") {
|
|
@@ -38,6 +38,7 @@ export function useCursorHttp(url, options) {
|
|
|
38
38
|
}
|
|
39
39
|
const {
|
|
40
40
|
lazy = false,
|
|
41
|
+
immediate = true,
|
|
41
42
|
pollInterval,
|
|
42
43
|
fetcher,
|
|
43
44
|
fetchOptions,
|
|
@@ -56,6 +57,7 @@ export function useCursorHttp(url, options) {
|
|
|
56
57
|
unwrapReactiveObject(fetchOptions)
|
|
57
58
|
);
|
|
58
59
|
let pollTimer = null;
|
|
60
|
+
let fetchPromise = null;
|
|
59
61
|
const fetcherFn = fetcher ?? globalThis.$fetch;
|
|
60
62
|
if (!fetcherFn) {
|
|
61
63
|
throw new Error("Nuxt $fetch is not available in the current context");
|
|
@@ -83,25 +85,35 @@ export function useCursorHttp(url, options) {
|
|
|
83
85
|
};
|
|
84
86
|
const fetchData = async (fetchUrl, params) => {
|
|
85
87
|
if (loading.value) {
|
|
86
|
-
return;
|
|
88
|
+
return fetchPromise ?? Promise.resolve();
|
|
87
89
|
}
|
|
88
90
|
if (!hasNextPage.value && data.value) {
|
|
89
|
-
return;
|
|
91
|
+
return Promise.resolve();
|
|
90
92
|
}
|
|
91
93
|
loading.value = true;
|
|
92
94
|
error.value = null;
|
|
95
|
+
const promise = (async () => {
|
|
96
|
+
try {
|
|
97
|
+
const response = await fetcherFn(fetchUrl, params);
|
|
98
|
+
data.value = {
|
|
99
|
+
...response,
|
|
100
|
+
data: [...data.value?.data ?? [], ...response.data]
|
|
101
|
+
};
|
|
102
|
+
nextCursor.value = normalizeCursorValue(response.meta?.[cursorKey]);
|
|
103
|
+
hasNextPage.value = response.meta?.[hasMoreKey] ?? false;
|
|
104
|
+
} catch (e) {
|
|
105
|
+
error.value = e;
|
|
106
|
+
} finally {
|
|
107
|
+
loading.value = false;
|
|
108
|
+
}
|
|
109
|
+
})();
|
|
110
|
+
fetchPromise = promise;
|
|
93
111
|
try {
|
|
94
|
-
|
|
95
|
-
data.value = {
|
|
96
|
-
...response,
|
|
97
|
-
data: [...data.value?.data ?? [], ...response.data]
|
|
98
|
-
};
|
|
99
|
-
nextCursor.value = normalizeCursorValue(response.meta?.[cursorKey]);
|
|
100
|
-
hasNextPage.value = response.meta?.[hasMoreKey] ?? false;
|
|
101
|
-
} catch (e) {
|
|
102
|
-
error.value = e;
|
|
112
|
+
await promise;
|
|
103
113
|
} finally {
|
|
104
|
-
|
|
114
|
+
if (fetchPromise === promise) {
|
|
115
|
+
fetchPromise = null;
|
|
116
|
+
}
|
|
105
117
|
}
|
|
106
118
|
};
|
|
107
119
|
const pollData = async () => {
|
|
@@ -144,6 +156,12 @@ export function useCursorHttp(url, options) {
|
|
|
144
156
|
isLoadMoreTriggered.value = false;
|
|
145
157
|
await fetchData(initialUrl, currentParams.value);
|
|
146
158
|
};
|
|
159
|
+
const init = async () => {
|
|
160
|
+
if (data.value) {
|
|
161
|
+
return;
|
|
162
|
+
}
|
|
163
|
+
await fetchData(initialUrl, currentParams.value);
|
|
164
|
+
};
|
|
147
165
|
const reactiveSources = findReactiveSources(fetchOptions);
|
|
148
166
|
if (reactiveSources.length > 0) {
|
|
149
167
|
watch(
|
|
@@ -163,8 +181,8 @@ export function useCursorHttp(url, options) {
|
|
|
163
181
|
clearInterval(pollTimer);
|
|
164
182
|
}
|
|
165
183
|
});
|
|
166
|
-
if (!lazy) {
|
|
167
|
-
|
|
184
|
+
if (!lazy && immediate) {
|
|
185
|
+
await init();
|
|
168
186
|
}
|
|
169
187
|
return {
|
|
170
188
|
data,
|
|
@@ -173,6 +191,7 @@ export function useCursorHttp(url, options) {
|
|
|
173
191
|
hasNextPage: readonly(hasNextPage),
|
|
174
192
|
isLoadMoreTriggered: readonly(isLoadMoreTriggered),
|
|
175
193
|
loadMore,
|
|
176
|
-
refresh
|
|
194
|
+
refresh,
|
|
195
|
+
init
|
|
177
196
|
};
|
|
178
197
|
}
|