@buoy-gg/react-query 7.0.41 → 7.0.42
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/README.md +11 -73
- package/lib/commonjs/checkPeer.js +1 -8
- package/lib/commonjs/checkPeer.web.js +1 -3
- package/lib/commonjs/index.js +1 -657
- package/lib/commonjs/preset.js +1 -243
- package/lib/commonjs/react-query/components/DataEditorMode.js +1 -317
- package/lib/commonjs/react-query/components/FilterStatusBadge.js +1 -55
- package/lib/commonjs/react-query/components/MutationBrowserMode.js +1 -52
- package/lib/commonjs/react-query/components/MutationEditorMode.js +1 -276
- package/lib/commonjs/react-query/components/QueryBrowserMode.js +1 -99
- package/lib/commonjs/react-query/components/QueryDebugInfo.js +1 -107
- package/lib/commonjs/react-query/components/QueryFilterViewV3.js +1 -224
- package/lib/commonjs/react-query/components/QuerySelector.js +1 -209
- package/lib/commonjs/react-query/components/ReactQueryDevToolsModal.js +1 -91
- package/lib/commonjs/react-query/components/ReactQuerySection.js +1 -47
- package/lib/commonjs/react-query/components/ReactQueryTracker.js +1 -38
- package/lib/commonjs/react-query/components/WifiToggle.js +1 -51
- package/lib/commonjs/react-query/components/modals/DataEditorModal.js +1 -103
- package/lib/commonjs/react-query/components/modals/MutationBrowserFooter.js +1 -61
- package/lib/commonjs/react-query/components/modals/MutationBrowserModal.js +1 -164
- package/lib/commonjs/react-query/components/modals/MutationEditorModal.js +1 -106
- package/lib/commonjs/react-query/components/modals/QueryBrowserFooter.js +1 -56
- package/lib/commonjs/react-query/components/modals/QueryBrowserModal.js +1 -254
- package/lib/commonjs/react-query/components/modals/ReactQueryModal.js +1 -83
- package/lib/commonjs/react-query/components/modals/ReactQueryModalHeader.js +1 -194
- package/lib/commonjs/react-query/components/modals/SwipeIndicator.js +1 -204
- package/lib/commonjs/react-query/components/query-browser/ActionButton.js +1 -100
- package/lib/commonjs/react-query/components/query-browser/ClearCacheButton.js +1 -53
- package/lib/commonjs/react-query/components/query-browser/Explorer.js +1 -75
- package/lib/commonjs/react-query/components/query-browser/MutationButton.js +1 -190
- package/lib/commonjs/react-query/components/query-browser/MutationDetails.js +1 -124
- package/lib/commonjs/react-query/components/query-browser/MutationDetailsChips.js +1 -68
- package/lib/commonjs/react-query/components/query-browser/MutationInformation.js +1 -118
- package/lib/commonjs/react-query/components/query-browser/MutationStatusCount.js +1 -84
- package/lib/commonjs/react-query/components/query-browser/MutationsList.js +1 -220
- package/lib/commonjs/react-query/components/query-browser/NetworkToggleButton.js +1 -54
- package/lib/commonjs/react-query/components/query-browser/QueryActions.js +1 -124
- package/lib/commonjs/react-query/components/query-browser/QueryBrowser.js +1 -181
- package/lib/commonjs/react-query/components/query-browser/QueryDetails.js +1 -141
- package/lib/commonjs/react-query/components/query-browser/QueryDetailsChip.js +1 -78
- package/lib/commonjs/react-query/components/query-browser/QueryInformation.js +1 -95
- package/lib/commonjs/react-query/components/query-browser/QueryRow.js +1 -96
- package/lib/commonjs/react-query/components/query-browser/QueryStatus.js +1 -167
- package/lib/commonjs/react-query/components/query-browser/QueryStatusCount.js +1 -100
- package/lib/commonjs/react-query/components/query-browser/StorageStatusCount.js +1 -61
- package/lib/commonjs/react-query/components/query-browser/index.js +1 -170
- package/lib/commonjs/react-query/components/query-browser/svgs.js +1 -72
- package/lib/commonjs/react-query/hooks/useActionButtons.js +1 -51
- package/lib/commonjs/react-query/hooks/useAllMutations.js +1 -85
- package/lib/commonjs/react-query/hooks/useAllQueries.js +1 -117
- package/lib/commonjs/react-query/hooks/useModalManager.js +1 -178
- package/lib/commonjs/react-query/hooks/useModalPersistence.js +1 -71
- package/lib/commonjs/react-query/hooks/useMutationActionButtons.js +1 -21
- package/lib/commonjs/react-query/hooks/useQueryStatusCounts.js +1 -114
- package/lib/commonjs/react-query/hooks/useReactQueryState.js +1 -24
- package/lib/commonjs/react-query/hooks/useSelectedMutation.js +1 -30
- package/lib/commonjs/react-query/hooks/useSelectedQuery.js +1 -96
- package/lib/commonjs/react-query/hooks/useStorageQueryCounts.js +1 -28
- package/lib/commonjs/react-query/hooks/useWifiState.js +1 -67
- package/lib/commonjs/react-query/stores/reactQueryEventStore.js +1 -302
- package/lib/commonjs/react-query/sync/dehydrate.js +1 -166
- package/lib/commonjs/react-query/sync/reactQuerySyncAdapter.js +1 -593
- package/lib/commonjs/react-query/sync/snapshotProvider.js +1 -289
- package/lib/commonjs/react-query/sync/useReactQuerySyncAdapter.js +1 -34
- package/lib/commonjs/react-query/types/types.js +1 -14
- package/lib/commonjs/react-query/utils/actions/deleteItem.js +1 -23
- package/lib/commonjs/react-query/utils/actions/emitDevToolsEvent.js +1 -40
- package/lib/commonjs/react-query/utils/actions/invalidate.js +1 -15
- package/lib/commonjs/react-query/utils/actions/refetch.js +1 -17
- package/lib/commonjs/react-query/utils/actions/remove.js +1 -15
- package/lib/commonjs/react-query/utils/actions/reset.js +1 -17
- package/lib/commonjs/react-query/utils/actions/triggerError.js +1 -33
- package/lib/commonjs/react-query/utils/actions/triggerLoading.js +1 -54
- package/lib/commonjs/react-query/utils/deleteNestedDataByPath.js +1 -56
- package/lib/commonjs/react-query/utils/getQueryStatusColor.js +1 -16
- package/lib/commonjs/react-query/utils/getQueryStatusLabel.js +1 -23
- package/lib/commonjs/react-query/utils/getStorageQueryCounts.js +1 -35
- package/lib/commonjs/react-query/utils/modalStorageOperations.js +1 -127
- package/lib/commonjs/react-query/utils/storageQueryUtils.js +1 -149
- package/lib/commonjs/react-query/utils/testIDs.js +1 -61
- package/lib/commonjs/react-query/utils/updateNestedDataByPath.js +1 -61
- package/lib/module/checkPeer.js +1 -8
- package/lib/module/checkPeer.web.js +1 -3
- package/lib/module/index.js +1 -130
- package/lib/module/preset.js +1 -239
- package/lib/module/react-query/components/DataEditorMode.js +1 -311
- package/lib/module/react-query/components/FilterStatusBadge.js +1 -51
- package/lib/module/react-query/components/MutationBrowserMode.js +1 -47
- package/lib/module/react-query/components/MutationEditorMode.js +1 -270
- package/lib/module/react-query/components/QueryBrowserMode.js +1 -94
- package/lib/module/react-query/components/QueryDebugInfo.js +1 -104
- package/lib/module/react-query/components/QueryFilterViewV3.js +1 -221
- package/lib/module/react-query/components/QuerySelector.js +1 -205
- package/lib/module/react-query/components/ReactQueryDevToolsModal.js +1 -87
- package/lib/module/react-query/components/ReactQuerySection.js +1 -43
- package/lib/module/react-query/components/ReactQueryTracker.js +1 -35
- package/lib/module/react-query/components/WifiToggle.js +1 -48
- package/lib/module/react-query/components/modals/DataEditorModal.js +1 -99
- package/lib/module/react-query/components/modals/MutationBrowserFooter.js +1 -56
- package/lib/module/react-query/components/modals/MutationBrowserModal.js +1 -161
- package/lib/module/react-query/components/modals/MutationEditorModal.js +1 -102
- package/lib/module/react-query/components/modals/QueryBrowserFooter.js +1 -51
- package/lib/module/react-query/components/modals/QueryBrowserModal.js +1 -250
- package/lib/module/react-query/components/modals/ReactQueryModal.js +1 -79
- package/lib/module/react-query/components/modals/ReactQueryModalHeader.js +1 -190
- package/lib/module/react-query/components/modals/SwipeIndicator.js +1 -201
- package/lib/module/react-query/components/query-browser/ActionButton.js +1 -96
- package/lib/module/react-query/components/query-browser/ClearCacheButton.js +1 -49
- package/lib/module/react-query/components/query-browser/Explorer.js +1 -70
- package/lib/module/react-query/components/query-browser/MutationButton.js +1 -186
- package/lib/module/react-query/components/query-browser/MutationDetails.js +1 -119
- package/lib/module/react-query/components/query-browser/MutationDetailsChips.js +1 -64
- package/lib/module/react-query/components/query-browser/MutationInformation.js +1 -113
- package/lib/module/react-query/components/query-browser/MutationStatusCount.js +1 -79
- package/lib/module/react-query/components/query-browser/MutationsList.js +1 -215
- package/lib/module/react-query/components/query-browser/NetworkToggleButton.js +1 -50
- package/lib/module/react-query/components/query-browser/QueryActions.js +1 -119
- package/lib/module/react-query/components/query-browser/QueryBrowser.js +1 -176
- package/lib/module/react-query/components/query-browser/QueryDetails.js +1 -136
- package/lib/module/react-query/components/query-browser/QueryDetailsChip.js +1 -74
- package/lib/module/react-query/components/query-browser/QueryInformation.js +1 -90
- package/lib/module/react-query/components/query-browser/QueryRow.js +1 -92
- package/lib/module/react-query/components/query-browser/QueryStatus.js +1 -163
- package/lib/module/react-query/components/query-browser/QueryStatusCount.js +1 -95
- package/lib/module/react-query/components/query-browser/StorageStatusCount.js +1 -56
- package/lib/module/react-query/components/query-browser/index.js +1 -22
- package/lib/module/react-query/components/query-browser/svgs.js +1 -64
- package/lib/module/react-query/hooks/useActionButtons.js +1 -46
- package/lib/module/react-query/hooks/useAllMutations.js +1 -82
- package/lib/module/react-query/hooks/useAllQueries.js +1 -114
- package/lib/module/react-query/hooks/useModalManager.js +1 -175
- package/lib/module/react-query/hooks/useModalPersistence.js +1 -67
- package/lib/module/react-query/hooks/useMutationActionButtons.js +1 -17
- package/lib/module/react-query/hooks/useQueryStatusCounts.js +1 -112
- package/lib/module/react-query/hooks/useReactQueryState.js +1 -20
- package/lib/module/react-query/hooks/useSelectedMutation.js +1 -27
- package/lib/module/react-query/hooks/useSelectedQuery.js +1 -92
- package/lib/module/react-query/hooks/useStorageQueryCounts.js +1 -25
- package/lib/module/react-query/hooks/useWifiState.js +1 -64
- package/lib/module/react-query/stores/reactQueryEventStore.js +1 -293
- package/lib/module/react-query/sync/dehydrate.js +1 -156
- package/lib/module/react-query/sync/reactQuerySyncAdapter.js +1 -589
- package/lib/module/react-query/sync/snapshotProvider.js +1 -284
- package/lib/module/react-query/sync/useReactQuerySyncAdapter.js +1 -31
- package/lib/module/react-query/types/types.js +1 -10
- package/lib/module/react-query/utils/actions/deleteItem.js +1 -19
- package/lib/module/react-query/utils/actions/emitDevToolsEvent.js +1 -36
- package/lib/module/react-query/utils/actions/invalidate.js +1 -11
- package/lib/module/react-query/utils/actions/refetch.js +1 -13
- package/lib/module/react-query/utils/actions/remove.js +1 -11
- package/lib/module/react-query/utils/actions/reset.js +1 -13
- package/lib/module/react-query/utils/actions/triggerError.js +1 -29
- package/lib/module/react-query/utils/actions/triggerLoading.js +1 -50
- package/lib/module/react-query/utils/deleteNestedDataByPath.js +1 -51
- package/lib/module/react-query/utils/getQueryStatusColor.js +1 -12
- package/lib/module/react-query/utils/getQueryStatusLabel.js +1 -19
- package/lib/module/react-query/utils/getStorageQueryCounts.js +1 -31
- package/lib/module/react-query/utils/modalStorageOperations.js +1 -117
- package/lib/module/react-query/utils/storageQueryUtils.js +1 -140
- package/lib/module/react-query/utils/testIDs.js +1 -54
- package/lib/module/react-query/utils/updateNestedDataByPath.js +1 -56
- package/lib/web/index.mjs +3 -4
- package/package.json +3 -3
- package/lib/typescript/checkPeer.d.ts.map +0 -1
- package/lib/typescript/checkPeer.web.d.ts.map +0 -1
- package/lib/typescript/index.d.ts.map +0 -1
- package/lib/typescript/preset.d.ts.map +0 -1
- package/lib/typescript/react-query/components/DataEditorMode.d.ts.map +0 -1
- package/lib/typescript/react-query/components/FilterStatusBadge.d.ts.map +0 -1
- package/lib/typescript/react-query/components/MutationBrowserMode.d.ts.map +0 -1
- package/lib/typescript/react-query/components/MutationEditorMode.d.ts.map +0 -1
- package/lib/typescript/react-query/components/QueryBrowserMode.d.ts.map +0 -1
- package/lib/typescript/react-query/components/QueryDebugInfo.d.ts.map +0 -1
- package/lib/typescript/react-query/components/QueryFilterViewV3.d.ts.map +0 -1
- package/lib/typescript/react-query/components/QuerySelector.d.ts.map +0 -1
- package/lib/typescript/react-query/components/ReactQueryDevToolsModal.d.ts.map +0 -1
- package/lib/typescript/react-query/components/ReactQuerySection.d.ts.map +0 -1
- package/lib/typescript/react-query/components/ReactQueryTracker.d.ts.map +0 -1
- package/lib/typescript/react-query/components/WifiToggle.d.ts.map +0 -1
- package/lib/typescript/react-query/components/modals/DataEditorModal.d.ts.map +0 -1
- package/lib/typescript/react-query/components/modals/MutationBrowserFooter.d.ts.map +0 -1
- package/lib/typescript/react-query/components/modals/MutationBrowserModal.d.ts.map +0 -1
- package/lib/typescript/react-query/components/modals/MutationEditorModal.d.ts.map +0 -1
- package/lib/typescript/react-query/components/modals/QueryBrowserFooter.d.ts.map +0 -1
- package/lib/typescript/react-query/components/modals/QueryBrowserModal.d.ts.map +0 -1
- package/lib/typescript/react-query/components/modals/ReactQueryModal.d.ts.map +0 -1
- package/lib/typescript/react-query/components/modals/ReactQueryModalHeader.d.ts.map +0 -1
- package/lib/typescript/react-query/components/modals/SwipeIndicator.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/ActionButton.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/ClearCacheButton.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/Explorer.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/MutationButton.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/MutationDetails.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/MutationDetailsChips.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/MutationInformation.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/MutationStatusCount.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/MutationsList.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/NetworkToggleButton.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/QueryActions.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/QueryBrowser.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/QueryDetails.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/QueryDetailsChip.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/QueryInformation.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/QueryRow.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/QueryStatus.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/QueryStatusCount.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/StorageStatusCount.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/index.d.ts.map +0 -1
- package/lib/typescript/react-query/components/query-browser/svgs.d.ts.map +0 -1
- package/lib/typescript/react-query/hooks/useActionButtons.d.ts.map +0 -1
- package/lib/typescript/react-query/hooks/useAllMutations.d.ts.map +0 -1
- package/lib/typescript/react-query/hooks/useAllQueries.d.ts.map +0 -1
- package/lib/typescript/react-query/hooks/useModalManager.d.ts.map +0 -1
- package/lib/typescript/react-query/hooks/useModalPersistence.d.ts.map +0 -1
- package/lib/typescript/react-query/hooks/useMutationActionButtons.d.ts.map +0 -1
- package/lib/typescript/react-query/hooks/useQueryStatusCounts.d.ts.map +0 -1
- package/lib/typescript/react-query/hooks/useReactQueryState.d.ts.map +0 -1
- package/lib/typescript/react-query/hooks/useSelectedMutation.d.ts.map +0 -1
- package/lib/typescript/react-query/hooks/useSelectedQuery.d.ts.map +0 -1
- package/lib/typescript/react-query/hooks/useStorageQueryCounts.d.ts.map +0 -1
- package/lib/typescript/react-query/hooks/useWifiState.d.ts.map +0 -1
- package/lib/typescript/react-query/stores/reactQueryEventStore.d.ts.map +0 -1
- package/lib/typescript/react-query/sync/dehydrate.d.ts.map +0 -1
- package/lib/typescript/react-query/sync/reactQuerySyncAdapter.d.ts.map +0 -1
- package/lib/typescript/react-query/sync/snapshotProvider.d.ts.map +0 -1
- package/lib/typescript/react-query/sync/useReactQuerySyncAdapter.d.ts.map +0 -1
- package/lib/typescript/react-query/types/types.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/actions/deleteItem.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/actions/emitDevToolsEvent.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/actions/invalidate.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/actions/refetch.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/actions/remove.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/actions/reset.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/actions/triggerError.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/actions/triggerLoading.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/deleteNestedDataByPath.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/getQueryStatusColor.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/getQueryStatusLabel.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/getStorageQueryCounts.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/modalStorageOperations.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/storageQueryUtils.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/testIDs.d.ts.map +0 -1
- package/lib/typescript/react-query/utils/updateNestedDataByPath.d.ts.map +0 -1
|
@@ -1,114 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
import { useEffect, useState, useRef, useMemo, useCallback } from "react";
|
|
4
|
-
import { useQueryClient } from "@tanstack/react-query";
|
|
5
|
-
import { isStorageQuery } from "../utils/storageQueryUtils";
|
|
6
|
-
|
|
7
|
-
// React Query DevTools sorting logic - moved outside component for performance
|
|
8
|
-
|
|
9
|
-
const getStatusRank = q => q.state.fetchStatus !== "idle" ? 0 : !q.getObserversCount() ? 3 : q.isStale() ? 2 : 1;
|
|
10
|
-
const dateSort = (a, b) => a.state.dataUpdatedAt < b.state.dataUpdatedAt ? 1 : -1;
|
|
11
|
-
const statusAndDateSort = (a, b) => {
|
|
12
|
-
if (getStatusRank(a) === getStatusRank(b)) {
|
|
13
|
-
return dateSort(a, b);
|
|
14
|
-
}
|
|
15
|
-
return getStatusRank(a) > getStatusRank(b) ? 1 : -1;
|
|
16
|
-
};
|
|
17
|
-
|
|
18
|
-
/**
|
|
19
|
-
* Optimized hook to track all queries with live updates
|
|
20
|
-
* Performance optimizations for mobile:
|
|
21
|
-
* - Filters event types to only relevant ones
|
|
22
|
-
* - Uses lightweight comparison instead of deep equality
|
|
23
|
-
* - Batches updates to reduce re-renders
|
|
24
|
-
* - Memoizes sorted results
|
|
25
|
-
*/
|
|
26
|
-
function useAllQueries() {
|
|
27
|
-
const queryClient = useQueryClient();
|
|
28
|
-
const [queries, setQueries] = useState(() => {
|
|
29
|
-
// Initialize with current queries to avoid flash
|
|
30
|
-
const initial = queryClient.getQueryCache().getAll().filter(query => !isStorageQuery(query.queryKey)).sort(statusAndDateSort);
|
|
31
|
-
return initial;
|
|
32
|
-
});
|
|
33
|
-
|
|
34
|
-
// Track query states using a Map for O(1) lookups
|
|
35
|
-
const queryStatesRef = useRef(new Map());
|
|
36
|
-
const updateTimerRef = useRef(undefined);
|
|
37
|
-
|
|
38
|
-
// Memoized callback to check if queries need update
|
|
39
|
-
const hasQueriesChanged = useCallback(newQueries => {
|
|
40
|
-
const statesMap = queryStatesRef.current;
|
|
41
|
-
|
|
42
|
-
// Quick length check first
|
|
43
|
-
if (newQueries.length !== statesMap.size) {
|
|
44
|
-
return true;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
// Check if any query state has changed
|
|
48
|
-
for (const query of newQueries) {
|
|
49
|
-
const prevState = statesMap.get(query.queryHash);
|
|
50
|
-
if (!prevState) return true;
|
|
51
|
-
|
|
52
|
-
// Compare only relevant state properties for rendering
|
|
53
|
-
if (prevState.dataUpdatedAt !== query.state.dataUpdatedAt || prevState.errorUpdatedAt !== query.state.errorUpdatedAt || prevState.fetchStatus !== query.state.fetchStatus || prevState.status !== query.state.status || prevState.isInvalidated !== query.state.isInvalidated) {
|
|
54
|
-
return true;
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
return false;
|
|
58
|
-
}, []);
|
|
59
|
-
|
|
60
|
-
// Memoized update function
|
|
61
|
-
const updateQueries = useCallback(() => {
|
|
62
|
-
const allQueries = queryClient.getQueryCache().getAll();
|
|
63
|
-
|
|
64
|
-
// Filter out storage queries
|
|
65
|
-
const nonStorageQueries = allQueries.filter(query => !isStorageQuery(query.queryKey));
|
|
66
|
-
|
|
67
|
-
// Check if update is needed
|
|
68
|
-
if (hasQueriesChanged(nonStorageQueries)) {
|
|
69
|
-
// Update states map
|
|
70
|
-
const newStatesMap = new Map();
|
|
71
|
-
nonStorageQueries.forEach(q => {
|
|
72
|
-
newStatesMap.set(q.queryHash, q.state);
|
|
73
|
-
});
|
|
74
|
-
queryStatesRef.current = newStatesMap;
|
|
75
|
-
|
|
76
|
-
// Sort and update
|
|
77
|
-
const sortedQueries = [...nonStorageQueries].sort(statusAndDateSort);
|
|
78
|
-
setQueries(sortedQueries);
|
|
79
|
-
}
|
|
80
|
-
}, [queryClient, hasQueriesChanged]);
|
|
81
|
-
useEffect(() => {
|
|
82
|
-
// Initial update
|
|
83
|
-
updateQueries();
|
|
84
|
-
|
|
85
|
-
// Subscribe with event filtering for performance
|
|
86
|
-
const unsubscribe = queryClient.getQueryCache().subscribe(event => {
|
|
87
|
-
// Only process events that affect query list
|
|
88
|
-
if (event.type === "added" || event.type === "removed" || event.type === "updated") {
|
|
89
|
-
// Skip storage queries
|
|
90
|
-
if ("query" in event && event.query && isStorageQuery(event.query.queryKey)) {
|
|
91
|
-
return;
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
// Debounce updates to batch rapid changes
|
|
95
|
-
if (updateTimerRef.current) {
|
|
96
|
-
clearTimeout(updateTimerRef.current);
|
|
97
|
-
}
|
|
98
|
-
updateTimerRef.current = setTimeout(() => {
|
|
99
|
-
updateQueries();
|
|
100
|
-
}, 10); // Small delay to batch updates
|
|
101
|
-
}
|
|
102
|
-
});
|
|
103
|
-
return () => {
|
|
104
|
-
unsubscribe();
|
|
105
|
-
if (updateTimerRef.current) {
|
|
106
|
-
clearTimeout(updateTimerRef.current);
|
|
107
|
-
}
|
|
108
|
-
};
|
|
109
|
-
}, [queryClient, updateQueries]);
|
|
110
|
-
|
|
111
|
-
// Memoize the final sorted array to prevent unnecessary re-renders
|
|
112
|
-
return useMemo(() => queries, [queries]);
|
|
113
|
-
}
|
|
114
|
-
export default useAllQueries;
|
|
1
|
+
"use strict";import{useEffect as h,useState as m,useRef as y,useMemo as Q,useCallback as p}from"react";import{useQueryClient as A}from"@tanstack/react-query";import{isStorageQuery as c}from"../utils/storageQueryUtils";const o=t=>t.state.fetchStatus!=="idle"?0:!t.getObserversCount()?3:t.isStale()?2:1;const q=(t,s)=>t.state.dataUpdatedAt<s.state.dataUpdatedAt?1:-1;const S=(t,s)=>{if(o(t)===o(s)){return q(t,s)}return o(t)>o(s)?1:-1};function C(){const t=A();const[s,g]=m(()=>{const u=t.getQueryCache().getAll().filter(e=>!c(e.queryKey)).sort(S);return u});const d=y(new Map);const n=y(void 0);const f=p(u=>{const e=d.current;if(u.length!==e.size){return true}for(const r of u){const a=e.get(r.queryHash);if(!a)return true;if(a.dataUpdatedAt!==r.state.dataUpdatedAt||a.errorUpdatedAt!==r.state.errorUpdatedAt||a.fetchStatus!==r.state.fetchStatus||a.status!==r.state.status||a.isInvalidated!==r.state.isInvalidated){return true}}return false},[]);const i=p(()=>{const u=t.getQueryCache().getAll();const e=u.filter(r=>!c(r.queryKey));if(f(e)){const r=new Map;e.forEach(l=>{r.set(l.queryHash,l.state)});d.current=r;const a=[...e].sort(S);g(a)}},[t,f]);h(()=>{i();const u=t.getQueryCache().subscribe(e=>{if(e.type==="added"||e.type==="removed"||e.type==="updated"){if("query"in e&&e.query&&c(e.query.queryKey)){return}if(n.current){clearTimeout(n.current)}n.current=setTimeout(()=>{i()},10)}});return()=>{u();if(n.current){clearTimeout(n.current)}}},[t,i]);return Q(()=>s,[s])}export default C;
|
|
@@ -1,175 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
import { useState, useEffect } from "react";
|
|
4
|
-
import { useModalPersistence } from "./useModalPersistence";
|
|
5
|
-
import { devToolsStorageKeys } from "@buoy-gg/shared-ui";
|
|
6
|
-
|
|
7
|
-
/**
|
|
8
|
-
* Custom hook for managing modal states and related query selection
|
|
9
|
-
* Enhanced with persistence following composition principles
|
|
10
|
-
* Restores modal state on app restart
|
|
11
|
-
*/
|
|
12
|
-
export function useModalManager() {
|
|
13
|
-
const [isModalOpen, setIsModalOpen] = useState(false);
|
|
14
|
-
const [isDebugModalOpen, setIsDebugModalOpen] = useState(false);
|
|
15
|
-
const [isEnvModalOpen, setIsEnvModalOpen] = useState(false);
|
|
16
|
-
const [isSentryModalOpen, setIsSentryModalOpen] = useState(false);
|
|
17
|
-
const [isStorageModalOpen, setIsStorageModalOpen] = useState(false);
|
|
18
|
-
const [isNetworkModalOpen, setIsNetworkModalOpen] = useState(false);
|
|
19
|
-
const [selectedQueryKey, setSelectedQueryKey] = useState(undefined);
|
|
20
|
-
const [selectedSection, setSelectedSection] = useState(null);
|
|
21
|
-
const [activeFilter, setActiveFilter] = useState(null);
|
|
22
|
-
const [isStateRestored, setIsStateRestored] = useState(false); // Default to false to prevent clearing state before restoration
|
|
23
|
-
const [activeTab, setActiveTab] = useState("queries");
|
|
24
|
-
const [selectedMutationId, setSelectedMutationId] = useState(undefined);
|
|
25
|
-
|
|
26
|
-
// Persistence hook for saving/loading modal state
|
|
27
|
-
const {
|
|
28
|
-
loadSavedState
|
|
29
|
-
} = useModalPersistence({
|
|
30
|
-
storagePrefix: devToolsStorageKeys.modal.state(),
|
|
31
|
-
isModalOpen,
|
|
32
|
-
isDebugModalOpen,
|
|
33
|
-
isEnvModalOpen,
|
|
34
|
-
isSentryModalOpen,
|
|
35
|
-
isStorageModalOpen,
|
|
36
|
-
isNetworkModalOpen,
|
|
37
|
-
selectedQueryKey,
|
|
38
|
-
selectedSection,
|
|
39
|
-
activeFilter,
|
|
40
|
-
activeTab,
|
|
41
|
-
selectedMutationId,
|
|
42
|
-
isStateRestored
|
|
43
|
-
});
|
|
44
|
-
|
|
45
|
-
// Restore saved modal state on component mount
|
|
46
|
-
useEffect(() => {
|
|
47
|
-
const restoreState = async () => {
|
|
48
|
-
// Don't set to false again if already restoring
|
|
49
|
-
if (isStateRestored) return;
|
|
50
|
-
try {
|
|
51
|
-
const savedState = await loadSavedState();
|
|
52
|
-
if (savedState) {
|
|
53
|
-
setIsModalOpen(savedState.isModalOpen);
|
|
54
|
-
setIsDebugModalOpen(savedState.isDebugModalOpen);
|
|
55
|
-
setIsEnvModalOpen(savedState.isEnvModalOpen || false);
|
|
56
|
-
setIsSentryModalOpen(savedState.isSentryModalOpen || false);
|
|
57
|
-
setIsStorageModalOpen(savedState.isStorageModalOpen || false);
|
|
58
|
-
setIsNetworkModalOpen(savedState.isNetworkModalOpen || false);
|
|
59
|
-
if (savedState.selectedQueryKey) {
|
|
60
|
-
try {
|
|
61
|
-
const queryKey = JSON.parse(savedState.selectedQueryKey);
|
|
62
|
-
setSelectedQueryKey(queryKey);
|
|
63
|
-
} catch {
|
|
64
|
-
// Silently fail if query key can't be parsed
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
if (savedState.selectedSection) {
|
|
68
|
-
setSelectedSection(savedState.selectedSection);
|
|
69
|
-
}
|
|
70
|
-
if (savedState.activeFilter) {
|
|
71
|
-
setActiveFilter(savedState.activeFilter);
|
|
72
|
-
}
|
|
73
|
-
if (savedState.activeTab) {
|
|
74
|
-
setActiveTab(savedState.activeTab);
|
|
75
|
-
}
|
|
76
|
-
if (savedState.selectedMutationId) {
|
|
77
|
-
setSelectedMutationId(Number(savedState.selectedMutationId));
|
|
78
|
-
}
|
|
79
|
-
}
|
|
80
|
-
} catch {
|
|
81
|
-
// Silently fail if state can't be restored
|
|
82
|
-
} finally {
|
|
83
|
-
// Mark restoration as complete
|
|
84
|
-
setIsStateRestored(true);
|
|
85
|
-
}
|
|
86
|
-
};
|
|
87
|
-
restoreState();
|
|
88
|
-
}, [isStateRestored, loadSavedState]);
|
|
89
|
-
const handleModalDismiss = () => {
|
|
90
|
-
setIsModalOpen(false);
|
|
91
|
-
setSelectedQueryKey(undefined);
|
|
92
|
-
// Note: Keep activeFilter when dismissing - user might want to maintain filter on next open
|
|
93
|
-
};
|
|
94
|
-
const handleDebugModalDismiss = () => {
|
|
95
|
-
setIsDebugModalOpen(false);
|
|
96
|
-
setSelectedSection(null);
|
|
97
|
-
};
|
|
98
|
-
const handleQuerySelect = query => {
|
|
99
|
-
setSelectedQueryKey(query?.queryKey);
|
|
100
|
-
};
|
|
101
|
-
const handleQueryPress = () => {
|
|
102
|
-
setIsModalOpen(true);
|
|
103
|
-
};
|
|
104
|
-
const handleStatusPress = () => {
|
|
105
|
-
setIsDebugModalOpen(true);
|
|
106
|
-
};
|
|
107
|
-
const handleEnvPress = () => {
|
|
108
|
-
setIsEnvModalOpen(true);
|
|
109
|
-
};
|
|
110
|
-
const handleSentryPress = () => {
|
|
111
|
-
setIsSentryModalOpen(true);
|
|
112
|
-
};
|
|
113
|
-
const handleStoragePress = () => {
|
|
114
|
-
setIsStorageModalOpen(true);
|
|
115
|
-
};
|
|
116
|
-
const handleEnvModalDismiss = () => {
|
|
117
|
-
setIsEnvModalOpen(false);
|
|
118
|
-
};
|
|
119
|
-
const handleSentryModalDismiss = () => {
|
|
120
|
-
setIsSentryModalOpen(false);
|
|
121
|
-
};
|
|
122
|
-
const handleStorageModalDismiss = () => {
|
|
123
|
-
setIsStorageModalOpen(false);
|
|
124
|
-
};
|
|
125
|
-
const handleNetworkPress = () => {
|
|
126
|
-
setIsNetworkModalOpen(true);
|
|
127
|
-
};
|
|
128
|
-
const handleNetworkModalDismiss = () => {
|
|
129
|
-
setIsNetworkModalOpen(false);
|
|
130
|
-
};
|
|
131
|
-
const handleMutationSelect = mutation => {
|
|
132
|
-
setSelectedMutationId(mutation?.mutationId);
|
|
133
|
-
};
|
|
134
|
-
const handleTabChange = newTab => {
|
|
135
|
-
if (newTab !== activeTab) {
|
|
136
|
-
setSelectedQueryKey(undefined);
|
|
137
|
-
setSelectedMutationId(undefined);
|
|
138
|
-
// Reset query status filters when switching tabs (they don't apply to storage)
|
|
139
|
-
setActiveFilter(null);
|
|
140
|
-
}
|
|
141
|
-
setActiveTab(newTab);
|
|
142
|
-
};
|
|
143
|
-
return {
|
|
144
|
-
isModalOpen,
|
|
145
|
-
isDebugModalOpen,
|
|
146
|
-
isEnvModalOpen,
|
|
147
|
-
isSentryModalOpen,
|
|
148
|
-
isStorageModalOpen,
|
|
149
|
-
isNetworkModalOpen,
|
|
150
|
-
selectedQueryKey,
|
|
151
|
-
selectedSection,
|
|
152
|
-
activeFilter,
|
|
153
|
-
isStateRestored,
|
|
154
|
-
activeTab,
|
|
155
|
-
selectedMutationId,
|
|
156
|
-
setSelectedSection,
|
|
157
|
-
setActiveFilter,
|
|
158
|
-
setActiveTab,
|
|
159
|
-
handleModalDismiss,
|
|
160
|
-
handleDebugModalDismiss,
|
|
161
|
-
handleEnvModalDismiss,
|
|
162
|
-
handleSentryModalDismiss,
|
|
163
|
-
handleStorageModalDismiss,
|
|
164
|
-
handleNetworkModalDismiss,
|
|
165
|
-
handleQuerySelect,
|
|
166
|
-
handleQueryPress,
|
|
167
|
-
handleStatusPress,
|
|
168
|
-
handleEnvPress,
|
|
169
|
-
handleSentryPress,
|
|
170
|
-
handleStoragePress,
|
|
171
|
-
handleNetworkPress,
|
|
172
|
-
handleTabChange,
|
|
173
|
-
handleMutationSelect
|
|
174
|
-
};
|
|
175
|
-
}
|
|
1
|
+
"use strict";import{useState as t,useEffect as H}from"react";import{useModalPersistence as L}from"./useModalPersistence";import{devToolsStorageKeys as U}from"@buoy-gg/shared-ui";export function useModalManager(){const[p,o]=t(false);const[O,l]=t(false);const[h,d]=t(false);const[v,i]=t(false);const[m,c]=t(false);const[g,r]=t(false);const[I,n]=t(void 0);const[D,u]=t(null);const[b,f]=t(null);const[a,N]=t(false);const[M,S]=t("queries");const[P,y]=t(void 0);const{loadSavedState:K}=L({storagePrefix:U.modal.state(),isModalOpen:p,isDebugModalOpen:O,isEnvModalOpen:h,isSentryModalOpen:v,isStorageModalOpen:m,isNetworkModalOpen:g,selectedQueryKey:I,selectedSection:D,activeFilter:b,activeTab:M,selectedMutationId:P,isStateRestored:a});H(()=>{const s=async()=>{if(a)return;try{const e=await K();if(e){o(e.isModalOpen);l(e.isDebugModalOpen);d(e.isEnvModalOpen||false);i(e.isSentryModalOpen||false);c(e.isStorageModalOpen||false);r(e.isNetworkModalOpen||false);if(e.selectedQueryKey){try{const G=JSON.parse(e.selectedQueryKey);n(G)}catch{}}if(e.selectedSection){u(e.selectedSection)}if(e.activeFilter){f(e.activeFilter)}if(e.activeTab){S(e.activeTab)}if(e.selectedMutationId){y(Number(e.selectedMutationId))}}}catch{}finally{N(true)}};s()},[a,K]);const E=()=>{o(false);n(void 0)};const Q=()=>{l(false);u(null)};const k=s=>{n(s?.queryKey)};const w=()=>{o(true)};const T=()=>{l(true)};const F=()=>{d(true)};const q=()=>{i(true)};const x=()=>{c(true)};const A=()=>{d(false)};const R=()=>{i(false)};const C=()=>{c(false)};const J=()=>{r(true)};const j=()=>{r(false)};const z=s=>{y(s?.mutationId)};const B=s=>{if(s!==M){n(void 0);y(void 0);f(null)}S(s)};return{isModalOpen:p,isDebugModalOpen:O,isEnvModalOpen:h,isSentryModalOpen:v,isStorageModalOpen:m,isNetworkModalOpen:g,selectedQueryKey:I,selectedSection:D,activeFilter:b,isStateRestored:a,activeTab:M,selectedMutationId:P,setSelectedSection:u,setActiveFilter:f,setActiveTab:S,handleModalDismiss:E,handleDebugModalDismiss:Q,handleEnvModalDismiss:A,handleSentryModalDismiss:R,handleStorageModalDismiss:C,handleNetworkModalDismiss:j,handleQuerySelect:k,handleQueryPress:w,handleStatusPress:T,handleEnvPress:F,handleSentryPress:q,handleStoragePress:x,handleNetworkPress:J,handleTabChange:B,handleMutationSelect:z}}
|
|
@@ -1,67 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
import { useEffect, useCallback } from "react";
|
|
4
|
-
import { saveModalVisibilityState, loadModalVisibilityState, clearModalVisibilityState } from "../utils/modalStorageOperations";
|
|
5
|
-
/**
|
|
6
|
-
* Hook for persisting modal state following "Extract Reusable Logic" principle
|
|
7
|
-
* Manages saving/loading modal visibility and selection state across app restarts
|
|
8
|
-
*/
|
|
9
|
-
export function useModalPersistence({
|
|
10
|
-
storagePrefix,
|
|
11
|
-
isModalOpen,
|
|
12
|
-
isDebugModalOpen,
|
|
13
|
-
isEnvModalOpen = false,
|
|
14
|
-
isSentryModalOpen = false,
|
|
15
|
-
isStorageModalOpen = false,
|
|
16
|
-
isNetworkModalOpen = false,
|
|
17
|
-
selectedQueryKey,
|
|
18
|
-
selectedSection,
|
|
19
|
-
activeFilter,
|
|
20
|
-
activeTab,
|
|
21
|
-
selectedMutationId,
|
|
22
|
-
isStateRestored
|
|
23
|
-
}) {
|
|
24
|
-
const saveCurrentState = useCallback(async () => {
|
|
25
|
-
const state = {
|
|
26
|
-
isModalOpen,
|
|
27
|
-
isDebugModalOpen,
|
|
28
|
-
isEnvModalOpen,
|
|
29
|
-
isSentryModalOpen,
|
|
30
|
-
isStorageModalOpen,
|
|
31
|
-
isNetworkModalOpen,
|
|
32
|
-
selectedQueryKey: selectedQueryKey ? JSON.stringify(selectedQueryKey) : undefined,
|
|
33
|
-
selectedSection: selectedSection || undefined,
|
|
34
|
-
activeFilter: activeFilter || undefined,
|
|
35
|
-
activeTab: activeTab || undefined,
|
|
36
|
-
selectedMutationId: selectedMutationId?.toString() || undefined
|
|
37
|
-
};
|
|
38
|
-
await saveModalVisibilityState(storagePrefix, state);
|
|
39
|
-
}, [storagePrefix, isModalOpen, isDebugModalOpen, isEnvModalOpen, isSentryModalOpen, isStorageModalOpen, isNetworkModalOpen, selectedQueryKey, selectedSection, activeFilter, activeTab, selectedMutationId]);
|
|
40
|
-
const loadSavedState = useCallback(async () => {
|
|
41
|
-
return await loadModalVisibilityState(storagePrefix);
|
|
42
|
-
}, [storagePrefix]);
|
|
43
|
-
const clearSavedState = useCallback(async () => {
|
|
44
|
-
await clearModalVisibilityState(storagePrefix);
|
|
45
|
-
}, [storagePrefix]);
|
|
46
|
-
|
|
47
|
-
// Auto-save state when modal state changes
|
|
48
|
-
useEffect(() => {
|
|
49
|
-
// Don't persist anything until state restoration is complete to avoid race condition
|
|
50
|
-
if (!isStateRestored) {
|
|
51
|
-
return;
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
// Only save if a modal is actually open to avoid saving closed state
|
|
55
|
-
if (isModalOpen || isDebugModalOpen || isEnvModalOpen || isSentryModalOpen || isStorageModalOpen || isNetworkModalOpen) {
|
|
56
|
-
saveCurrentState();
|
|
57
|
-
} else {
|
|
58
|
-
// Clear saved state when all modals are closed
|
|
59
|
-
clearSavedState();
|
|
60
|
-
}
|
|
61
|
-
}, [isModalOpen, isDebugModalOpen, isEnvModalOpen, isSentryModalOpen, isStorageModalOpen, isNetworkModalOpen, selectedQueryKey, selectedSection, activeFilter, activeTab, selectedMutationId, isStateRestored, saveCurrentState, clearSavedState]);
|
|
62
|
-
return {
|
|
63
|
-
saveCurrentState,
|
|
64
|
-
loadSavedState,
|
|
65
|
-
clearSavedState
|
|
66
|
-
};
|
|
67
|
-
}
|
|
1
|
+
"use strict";import{useEffect as z,useCallback as n}from"react";import{saveModalVisibilityState as A,loadModalVisibilityState as B,clearModalVisibilityState as G}from"../utils/modalStorageOperations";export function useModalPersistence({storagePrefix:f,isModalOpen:t,isDebugModalOpen:u,isEnvModalOpen:c=false,isSentryModalOpen:m=false,isStorageModalOpen:a=false,isNetworkModalOpen:V=false,selectedQueryKey:C,selectedSection:S,activeFilter:i,activeTab:J,selectedMutationId:b,isStateRestored:q}){const h=n(async()=>{const y={isModalOpen:t,isDebugModalOpen:u,isEnvModalOpen:c,isSentryModalOpen:m,isStorageModalOpen:a,isNetworkModalOpen:V,selectedQueryKey:C?JSON.stringify(C):void 0,selectedSection:S||void 0,activeFilter:i||void 0,activeTab:J||void 0,selectedMutationId:b?.toString()||void 0};await A(f,y)},[f,t,u,c,m,a,V,C,S,i,J,b]);const w=n(async()=>{return await B(f)},[f]);const j=n(async()=>{await G(f)},[f]);z(()=>{if(!q){return}if(t||u||c||m||a||V){h()}else{j()}},[t,u,c,m,a,V,C,S,i,J,b,q,h,j]);return{saveCurrentState:h,loadSavedState:w,clearSavedState:j}}
|
|
@@ -1,17 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
import { useMemo } from "react";
|
|
4
|
-
import { useQueryClient } from "@tanstack/react-query";
|
|
5
|
-
/**
|
|
6
|
-
* Supplies action button metadata for a selected mutation. Currently exposes a remove control but
|
|
7
|
-
* centralizes logic so future actions stay consistent across the UI.
|
|
8
|
-
*/
|
|
9
|
-
export function useMutationActionButtons(selectedMutation) {
|
|
10
|
-
const queryClient = useQueryClient();
|
|
11
|
-
return useMemo(() => [{
|
|
12
|
-
label: "Remove",
|
|
13
|
-
variant: "remove",
|
|
14
|
-
disabled: false,
|
|
15
|
-
onPress: () => queryClient.getMutationCache().remove(selectedMutation)
|
|
16
|
-
}], [selectedMutation, queryClient]);
|
|
17
|
-
}
|
|
1
|
+
"use strict";import{useMemo as o}from"react";import{useQueryClient as r}from"@tanstack/react-query";export function useMutationActionButtons(e){const t=r();return o(()=>[{label:"Remove",variant:"remove",disabled:false,onPress:()=>t.getMutationCache().remove(e)}],[e,t])}
|
|
@@ -1,112 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
import { useEffect, useState } from "react";
|
|
4
|
-
import { useQueryClient } from "@tanstack/react-query";
|
|
5
|
-
import { getQueryStatusLabel } from "../utils/getQueryStatusLabel";
|
|
6
|
-
/**
|
|
7
|
-
* Tracks how many queries fall into each status bucket (fresh, stale, fetching, etc.). Uses
|
|
8
|
-
* cache subscriptions to stay up to date without polling.
|
|
9
|
-
*/
|
|
10
|
-
function useQueryStatusCounts() {
|
|
11
|
-
const queryClient = useQueryClient();
|
|
12
|
-
const [counts, setCounts] = useState({
|
|
13
|
-
fresh: 0,
|
|
14
|
-
stale: 0,
|
|
15
|
-
fetching: 0,
|
|
16
|
-
paused: 0,
|
|
17
|
-
inactive: 0,
|
|
18
|
-
error: 0,
|
|
19
|
-
disabled: 0
|
|
20
|
-
});
|
|
21
|
-
useEffect(() => {
|
|
22
|
-
const updateCounts = () => {
|
|
23
|
-
const allQueries = queryClient.getQueryCache().getAll();
|
|
24
|
-
const newCounts = allQueries.reduce((acc, query) => {
|
|
25
|
-
const status = getQueryStatusLabel(query);
|
|
26
|
-
acc[status] = (acc[status] || 0) + 1;
|
|
27
|
-
return acc;
|
|
28
|
-
}, {
|
|
29
|
-
fresh: 0,
|
|
30
|
-
stale: 0,
|
|
31
|
-
fetching: 0,
|
|
32
|
-
paused: 0,
|
|
33
|
-
inactive: 0,
|
|
34
|
-
error: 0,
|
|
35
|
-
disabled: 0
|
|
36
|
-
});
|
|
37
|
-
setTimeout(() => setCounts(newCounts), 0);
|
|
38
|
-
};
|
|
39
|
-
|
|
40
|
-
// Perform an initial update
|
|
41
|
-
updateCounts();
|
|
42
|
-
|
|
43
|
-
// Subscribe to the query cache to run updates on changes
|
|
44
|
-
const unsubscribe = queryClient.getQueryCache().subscribe(updateCounts);
|
|
45
|
-
|
|
46
|
-
// Cleanup the subscription when the component unmounts
|
|
47
|
-
return () => unsubscribe();
|
|
48
|
-
}, [queryClient]);
|
|
49
|
-
return counts;
|
|
50
|
-
}
|
|
51
|
-
export default useQueryStatusCounts;
|
|
52
|
-
|
|
53
|
-
// Mutation status counts hook
|
|
54
|
-
|
|
55
|
-
/**
|
|
56
|
-
* Companion hook for query status counts that groups mutations by status and pause state.
|
|
57
|
-
*/
|
|
58
|
-
export function useMutationStatusCounts() {
|
|
59
|
-
const queryClient = useQueryClient();
|
|
60
|
-
const [counts, setCounts] = useState({
|
|
61
|
-
pending: 0,
|
|
62
|
-
success: 0,
|
|
63
|
-
error: 0,
|
|
64
|
-
paused: 0,
|
|
65
|
-
idle: 0
|
|
66
|
-
});
|
|
67
|
-
useEffect(() => {
|
|
68
|
-
const updateCounts = () => {
|
|
69
|
-
const allMutations = queryClient.getMutationCache().getAll();
|
|
70
|
-
const newCounts = allMutations.reduce((acc, mutation) => {
|
|
71
|
-
const status = mutation.state.status;
|
|
72
|
-
const isPaused = mutation.state.isPaused;
|
|
73
|
-
if (isPaused) {
|
|
74
|
-
acc.paused++;
|
|
75
|
-
} else {
|
|
76
|
-
switch (status) {
|
|
77
|
-
case "idle":
|
|
78
|
-
acc.idle++;
|
|
79
|
-
break;
|
|
80
|
-
case "pending":
|
|
81
|
-
acc.pending++;
|
|
82
|
-
break;
|
|
83
|
-
case "success":
|
|
84
|
-
acc.success++;
|
|
85
|
-
break;
|
|
86
|
-
case "error":
|
|
87
|
-
acc.error++;
|
|
88
|
-
break;
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
return acc;
|
|
92
|
-
}, {
|
|
93
|
-
pending: 0,
|
|
94
|
-
success: 0,
|
|
95
|
-
error: 0,
|
|
96
|
-
paused: 0,
|
|
97
|
-
idle: 0
|
|
98
|
-
});
|
|
99
|
-
setTimeout(() => setCounts(newCounts), 0);
|
|
100
|
-
};
|
|
101
|
-
|
|
102
|
-
// Perform an initial update
|
|
103
|
-
updateCounts();
|
|
104
|
-
|
|
105
|
-
// Subscribe to the mutation cache to run updates on changes
|
|
106
|
-
const unsubscribe = queryClient.getMutationCache().subscribe(updateCounts);
|
|
107
|
-
|
|
108
|
-
// Cleanup the subscription when the component unmounts
|
|
109
|
-
return () => unsubscribe();
|
|
110
|
-
}, [queryClient]);
|
|
111
|
-
return counts;
|
|
112
|
-
}
|
|
1
|
+
"use strict";import{useEffect as d,useState as l}from"react";import{useQueryClient as p}from"@tanstack/react-query";import{getQueryStatusLabel as C}from"../utils/getQueryStatusLabel";function f(){const t=p();const[n,o]=l({fresh:0,stale:0,fetching:0,paused:0,inactive:0,error:0,disabled:0});d(()=>{const s=()=>{const a=t.getQueryCache().getAll();const c=a.reduce((e,u)=>{const r=C(u);e[r]=(e[r]||0)+1;return e},{fresh:0,stale:0,fetching:0,paused:0,inactive:0,error:0,disabled:0});setTimeout(()=>o(c),0)};s();const i=t.getQueryCache().subscribe(s);return()=>i()},[t]);return n}export default f;export function useMutationStatusCounts(){const t=p();const[n,o]=l({pending:0,success:0,error:0,paused:0,idle:0});d(()=>{const s=()=>{const a=t.getMutationCache().getAll();const c=a.reduce((e,u)=>{const r=u.state.status;const b=u.state.isPaused;if(b){e.paused++}else{switch(r){case"idle":e.idle++;break;case"pending":e.pending++;break;case"success":e.success++;break;case"error":e.error++;break}}return e},{pending:0,success:0,error:0,paused:0,idle:0});setTimeout(()=>o(c),0)};s();const i=t.getMutationCache().subscribe(s);return()=>i()},[t]);return n}
|
|
@@ -1,20 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* Custom hook for getting React Query state information
|
|
5
|
-
* Separated from UI concerns following composition principles
|
|
6
|
-
*/
|
|
7
|
-
export function useReactQueryState(queryClient) {
|
|
8
|
-
const getReactBuoySubtitle = () => {
|
|
9
|
-
try {
|
|
10
|
-
const allQueries = queryClient.getQueryCache().getAll();
|
|
11
|
-
const allMutations = queryClient.getMutationCache().getAll();
|
|
12
|
-
return `${allQueries.length} queries • ${allMutations.length} mutations`;
|
|
13
|
-
} catch {
|
|
14
|
-
return "Data management & cache inspector";
|
|
15
|
-
}
|
|
16
|
-
};
|
|
17
|
-
return {
|
|
18
|
-
getReactBuoySubtitle
|
|
19
|
-
};
|
|
20
|
-
}
|
|
1
|
+
"use strict";export function useReactQueryState(t){const e=()=>{try{const a=t.getQueryCache().getAll();const n=t.getMutationCache().getAll();return`${a.length} queries \u2022 ${n.length} mutations`}catch{return"Data management & cache inspector"}};return{getReactBuoySubtitle:e}}
|
|
@@ -1,27 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
import { useEffect, useState } from "react";
|
|
4
|
-
import { useQueryClient } from "@tanstack/react-query";
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* Watches the mutation cache for a specific mutation id. Useful when the UI needs to follow
|
|
8
|
-
* mutation lifecycle events (loading, success, error) for a focused inspection panel.
|
|
9
|
-
*/
|
|
10
|
-
export function useGetMutationById(mutationId) {
|
|
11
|
-
const queryClient = useQueryClient();
|
|
12
|
-
const [selectedMutation, setSelectedMutation] = useState(undefined);
|
|
13
|
-
useEffect(() => {
|
|
14
|
-
const updateSelectedMutation = () => {
|
|
15
|
-
if (mutationId !== undefined) {
|
|
16
|
-
const mutation = queryClient.getMutationCache().getAll().find(m => m.mutationId === mutationId);
|
|
17
|
-
setSelectedMutation(mutation);
|
|
18
|
-
} else {
|
|
19
|
-
setSelectedMutation(undefined);
|
|
20
|
-
}
|
|
21
|
-
};
|
|
22
|
-
setTimeout(updateSelectedMutation, 0);
|
|
23
|
-
const unsubscribe = queryClient.getMutationCache().subscribe(updateSelectedMutation);
|
|
24
|
-
return () => unsubscribe();
|
|
25
|
-
}, [queryClient, mutationId]);
|
|
26
|
-
return selectedMutation;
|
|
27
|
-
}
|
|
1
|
+
"use strict";import{useEffect as r,useState as d}from"react";import{useQueryClient as a}from"@tanstack/react-query";export function useGetMutationById(e){const t=a();const[i,n]=d(void 0);r(()=>{const u=()=>{if(e!==void 0){const o=t.getMutationCache().getAll().find(c=>c.mutationId===e);n(o)}else{n(void 0)}};setTimeout(u,0);const s=t.getMutationCache().subscribe(u);return()=>s()},[t,e]);return i}
|
|
@@ -1,92 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
import { useEffect, useState, useRef } from "react";
|
|
4
|
-
import { useQueryClient } from "@tanstack/react-query";
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* Custom hook to track a single query by its queryKey with live updates
|
|
8
|
-
* Optimized to only re-render when the specific query changes
|
|
9
|
-
*/
|
|
10
|
-
|
|
11
|
-
/**
|
|
12
|
-
* Returns a single query instance matching the provided key and resubscribes whenever the cache
|
|
13
|
-
* entry changes. Ideal for detail panes where live updates are required without scanning the
|
|
14
|
-
* entire query cache.
|
|
15
|
-
*/
|
|
16
|
-
export function useGetQueryByQueryKey(queryKey) {
|
|
17
|
-
const {
|
|
18
|
-
query
|
|
19
|
-
} = useGetQueryByQueryKeyWithVersion(queryKey);
|
|
20
|
-
return query;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
/**
|
|
24
|
-
* Returns a single query instance with a version number that increments on each cache update.
|
|
25
|
-
* Use the version as a dependency or key to ensure child components re-render when query state changes.
|
|
26
|
-
*
|
|
27
|
-
* This is necessary because React Query mutates the Query object in place, so React's
|
|
28
|
-
* shallow comparison won't detect changes to nested properties like query.state.status.
|
|
29
|
-
*/
|
|
30
|
-
export function useGetQueryByQueryKeyWithVersion(queryKey) {
|
|
31
|
-
const queryClient = useQueryClient();
|
|
32
|
-
const [queryState, setQueryState] = useState({
|
|
33
|
-
query: undefined,
|
|
34
|
-
version: 0
|
|
35
|
-
});
|
|
36
|
-
const queryHashRef = useRef(undefined);
|
|
37
|
-
useEffect(() => {
|
|
38
|
-
if (!queryKey) {
|
|
39
|
-
setQueryState({
|
|
40
|
-
query: undefined,
|
|
41
|
-
version: 0
|
|
42
|
-
});
|
|
43
|
-
queryHashRef.current = undefined;
|
|
44
|
-
return;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
// Get initial query state
|
|
48
|
-
const query = queryClient.getQueryCache().find({
|
|
49
|
-
queryKey,
|
|
50
|
-
exact: true
|
|
51
|
-
});
|
|
52
|
-
setQueryState({
|
|
53
|
-
query,
|
|
54
|
-
version: 0
|
|
55
|
-
});
|
|
56
|
-
|
|
57
|
-
// Store the stringified queryKey for comparison
|
|
58
|
-
const queryKeyString = JSON.stringify(queryKey);
|
|
59
|
-
queryHashRef.current = queryKeyString;
|
|
60
|
-
|
|
61
|
-
// Subscribe to query cache changes but only update if our specific query changed
|
|
62
|
-
const unsubscribe = queryClient.getQueryCache().subscribe(event => {
|
|
63
|
-
// Only process events for our specific query
|
|
64
|
-
if (event.type === "updated" || event.type === "added" || event.type === "removed") {
|
|
65
|
-
if ("query" in event && event.query) {
|
|
66
|
-
// Check if the event is for our query by comparing the stringified keys
|
|
67
|
-
const eventQueryKeyString = JSON.stringify(event.query.queryKey);
|
|
68
|
-
const isOurQuery = eventQueryKeyString === queryHashRef.current;
|
|
69
|
-
if (isOurQuery) {
|
|
70
|
-
if (event.type === "removed") {
|
|
71
|
-
setQueryState({
|
|
72
|
-
query: undefined,
|
|
73
|
-
version: 0
|
|
74
|
-
});
|
|
75
|
-
} else {
|
|
76
|
-
// For 'updated' and 'added' events, use the query from the event
|
|
77
|
-
// Update both the query and increment version to force re-renders
|
|
78
|
-
setQueryState(prev => ({
|
|
79
|
-
query: event.query,
|
|
80
|
-
version: prev.version + 1
|
|
81
|
-
}));
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
});
|
|
87
|
-
|
|
88
|
-
// Cleanup subscription when component unmounts
|
|
89
|
-
return () => unsubscribe();
|
|
90
|
-
}, [queryClient, queryKey]);
|
|
91
|
-
return queryState;
|
|
92
|
-
}
|
|
1
|
+
"use strict";import{useEffect as q,useState as Q,useRef as a}from"react";import{useQueryClient as p}from"@tanstack/react-query";export function useGetQueryByQueryKey(r){const{query:u}=useGetQueryByQueryKeyWithVersion(r);return u}export function useGetQueryByQueryKeyWithVersion(r){const u=p();const[i,t]=Q({query:void 0,version:0});const n=a(void 0);q(()=>{if(!r){t({query:void 0,version:0});n.current=void 0;return}const s=u.getQueryCache().find({queryKey:r,exact:true});t({query:s,version:0});const y=JSON.stringify(r);n.current=y;const o=u.getQueryCache().subscribe(e=>{if(e.type==="updated"||e.type==="added"||e.type==="removed"){if("query"in e&&e.query){const c=JSON.stringify(e.query.queryKey);const f=c===n.current;if(f){if(e.type==="removed"){t({query:void 0,version:0})}else{t(d=>({query:e.query,version:d.version+1}))}}}}});return()=>o()},[u,r]);return i}
|
|
@@ -1,25 +1 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
import { useMemo } from "react";
|
|
4
|
-
import { useQueryClient } from "@tanstack/react-query";
|
|
5
|
-
import { getStorageQueryCounts } from "../utils/getStorageQueryCounts";
|
|
6
|
-
|
|
7
|
-
/**
|
|
8
|
-
* Hook to get storage query counts with proper memoization
|
|
9
|
-
* Following rule3 - Component Composition principles:
|
|
10
|
-
* - Extract Reusable Logic: Dedicated hook for storage counting
|
|
11
|
-
* - Rigor and Justification: Proper memoization only where proven necessary
|
|
12
|
-
* - Stable references: useMemo with correct dependencies to prevent infinite loops
|
|
13
|
-
*/
|
|
14
|
-
export function useStorageQueryCounts() {
|
|
15
|
-
const queryClient = useQueryClient();
|
|
16
|
-
|
|
17
|
-
// Memoize counts based on query cache state changes
|
|
18
|
-
// This prevents infinite re-renders by stabilizing the counts object
|
|
19
|
-
const counts = useMemo(() => {
|
|
20
|
-
const allQueries = queryClient.getQueryCache().getAll();
|
|
21
|
-
return getStorageQueryCounts(allQueries);
|
|
22
|
-
}, [queryClient]); // Depend on queryClient, not the result of getAll()
|
|
23
|
-
|
|
24
|
-
return counts;
|
|
25
|
-
}
|
|
1
|
+
"use strict";import{useMemo as o}from"react";import{useQueryClient as u}from"@tanstack/react-query";import{getStorageQueryCounts as n}from"../utils/getStorageQueryCounts";export function useStorageQueryCounts(){const e=u();const t=o(()=>{const r=e.getQueryCache().getAll();return n(r)},[e]);return t}
|