react-redux-cache 0.0.4 → 0.0.6

package/dist/createCache.d.ts

@@ -5,7 +5,7 @@ import { useQuery } from './useQuery';
 /**
  * Creates reducer, actions and hooks for managing queries and mutations through redux cache.
  */
-export declare const createCache: <T extends Typenames, QP, QR, MP, MR>(cache: OptionalPartial<Cache<T, QP, QR, MP, MR>, "options">) => {
+export declare const createCache: <T extends Typenames, QP, QR, MP, MR>(cache: OptionalPartial<Cache<T, QP, QR, MP, MR>, "queries" | "mutations" | "options">) => {
     cache: Cache<T, QP, QR, MP, MR>;
     /** Reducer of the cache, should be added to redux store. */
     reducer: (state: {

package/dist/createCache.js

@@ -10,15 +10,17 @@ const utilsAndConstants_1 = require("./utilsAndConstants");
  * Creates reducer, actions and hooks for managing queries and mutations through redux cache.
  */
 const createCache = (cache) => {
-    var _a, _b, _c, _d;
-    var _e, _f, _g;
+    var _a, _b, _c, _d, _e, _f;
+    var _g, _h, _j;
     // @ts-expect-error hot
     const hotReloadEnabled = Boolean(module === null || module === void 0 ? void 0 : module.hot);
     // provide all optional fields
     (_a = cache.options) !== null && _a !== void 0 ? _a : (cache.options = {});
-    (_b = (_e = cache.options).logsEnabled) !== null && _b !== void 0 ? _b : (_e.logsEnabled = false);
-    (_c = (_f = cache.options).validateFunctionArguments) !== null && _c !== void 0 ? _c : (_f.validateFunctionArguments = utilsAndConstants_1.isDev);
-    (_d = (_g = cache.options).validateHookArguments) !== null && _d !== void 0 ? _d : (_g.validateHookArguments = utilsAndConstants_1.isDev && !hotReloadEnabled);
+    (_b = (_g = cache.options).logsEnabled) !== null && _b !== void 0 ? _b : (_g.logsEnabled = false);
+    (_c = (_h = cache.options).validateFunctionArguments) !== null && _c !== void 0 ? _c : (_h.validateFunctionArguments = utilsAndConstants_1.isDev);
+    (_d = (_j = cache.options).validateHookArguments) !== null && _d !== void 0 ? _d : (_j.validateHookArguments = utilsAndConstants_1.isDev && !hotReloadEnabled);
+    (_e = cache.queries) !== null && _e !== void 0 ? _e : (cache.queries = {});
+    (_f = cache.mutations) !== null && _f !== void 0 ? _f : (cache.mutations = {});
     const nonPartialCache = cache;
     // make selectors
     const entitiesSelector = (state) => {

package/dist/index.d.ts

@@ -3,4 +3,4 @@ export type { ReduxCacheState } from './reducer';
 export * from './types';
 export { defaultMutationCacheOptions } from './useMutation';
 export { defaultQueryCacheOptions, queryCacheOptionsByPolicy } from './useQuery';
-export { defaultGetParamsKey, defaultQueryMutationState, processEntityChanges, } from './utilsAndConstants';
+export { defaultCacheOptions, defaultGetParamsKey, defaultQueryMutationState, processEntityChanges, } from './utilsAndConstants';

package/dist/index.js

@@ -14,7 +14,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.processEntityChanges = exports.defaultQueryMutationState = exports.defaultGetParamsKey = exports.queryCacheOptionsByPolicy = exports.defaultQueryCacheOptions = exports.defaultMutationCacheOptions = exports.createCache = void 0;
+exports.processEntityChanges = exports.defaultQueryMutationState = exports.defaultGetParamsKey = exports.defaultCacheOptions = exports.queryCacheOptionsByPolicy = exports.defaultQueryCacheOptions = exports.defaultMutationCacheOptions = exports.createCache = void 0;
 var createCache_1 = require("./createCache");
 Object.defineProperty(exports, "createCache", { enumerable: true, get: function () { return createCache_1.createCache; } });
 __exportStar(require("./types"), exports);
@@ -24,14 +24,16 @@ var useQuery_1 = require("./useQuery");
 Object.defineProperty(exports, "defaultQueryCacheOptions", { enumerable: true, get: function () { return useQuery_1.defaultQueryCacheOptions; } });
 Object.defineProperty(exports, "queryCacheOptionsByPolicy", { enumerable: true, get: function () { return useQuery_1.queryCacheOptionsByPolicy; } });
 var utilsAndConstants_1 = require("./utilsAndConstants");
+Object.defineProperty(exports, "defaultCacheOptions", { enumerable: true, get: function () { return utilsAndConstants_1.defaultCacheOptions; } });
 Object.defineProperty(exports, "defaultGetParamsKey", { enumerable: true, get: function () { return utilsAndConstants_1.defaultGetParamsKey; } });
 Object.defineProperty(exports, "defaultQueryMutationState", { enumerable: true, get: function () { return utilsAndConstants_1.defaultQueryMutationState; } });
 Object.defineProperty(exports, "processEntityChanges", { enumerable: true, get: function () { return utilsAndConstants_1.processEntityChanges; } });
 // Backlog
 // ! high
-// package.json exports
 // cover with tests
 // ! medium
+// type extractors from cache
+// custom useStore
 // return back deserialize selector?
 // resultSelector - return also boolean that result is full enough
 // selector for entities by typename
@@ -51,6 +53,7 @@ Object.defineProperty(exports, "processEntityChanges", { enumerable: true, get:
 // make error type generic
 // proper types, remove as, any, todo
 // ! low
+// remove defaultState and keep values undefined?
 // add params to the state?
 // cancellation to queries
 // if mutation & query alrady loading - make options: last, throttle, debounce, parallel?

package/dist/useQuery.js

@@ -24,6 +24,7 @@ exports.queryCacheOptionsByPolicy = {
     'cache-and-fetch': Object.assign(Object.assign({}, cacheFirstOptions), { policy: 'cache-and-fetch' }),
 };
 exports.defaultQueryCacheOptions = cacheFirstOptions;
+const defaultRefState = {};
 const useQuery = (cache, options) => {
     var _a, _b, _c, _d;
     const getParamsKey = (_a = cache.queries[options.query].getParamsKey) !== null && _a !== void 0 ? _a : (utilsAndConstants_1.defaultGetParamsKey);
@@ -56,39 +57,43 @@ const useQuery = (cache, options) => {
     const forceUpdate = (0, utilsAndConstants_1.useForceUpdate)();
     // Keeps most of local state.
     // Reference because state is changed not only by changing hook arguments, but also by calling fetch, and it should be done synchronously.
-    const stateRef = (0, react_1.useRef)({});
+    const stateRef = (0, react_1.useRef)(defaultRefState);
     (0, react_1.useMemo)(() => {
-        if (skip || stateRef.current.paramsKey === hookParamsKey) {
+        if (stateRef.current.paramsKey === hookParamsKey) {
             return;
         }
-        const resultSelectorImpl = cache.queries[queryKey].resultSelector;
         const state = stateRef.current;
+        state.resultSelector = createResultSelector(
+        // @ts-expect-error fix later
+        cache.queries[queryKey].resultSelector, cache.cacheStateSelector, hookParams);
+        if (skip) {
+            return;
+        }
         state.params = hookParams;
         state.paramsKey = hookParamsKey;
         state.latestHookParamsKey = state.paramsKey;
         // @ts-expect-error fix later
         state.cacheKey = getCacheKey(hookParams);
-        state.resultSelector = createResultSelector(
-        // @ts-expect-error fix later
-        resultSelectorImpl, cache.cacheStateSelector, hookParams);
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [hookParamsKey, skip]);
     const resultFromSelector = 
     // eslint-disable-next-line react-hooks/rules-of-hooks
     stateRef.current.resultSelector && (0, react_redux_1.useSelector)(stateRef.current.resultSelector);
     const hasResultFromSelector = resultFromSelector !== undefined;
-    const queryStateSelector = (0, react_1.useCallback)((state) => {
+    const queryStateSelector = (0, react_1.useCallback)((state, cacheKey = stateRef.current.cacheKey) => {
         cache.options.logsEnabled &&
             (0, utilsAndConstants_1.log)('queryStateSelector', {
                 state,
                 queryKey,
-                cacheKey: stateRef.current.cacheKey,
+                cacheKey,
                 cacheState: cache.cacheStateSelector(state),
             });
-        const queryState = cache.cacheStateSelector(state).queries[queryKey][stateRef.current.cacheKey];
+        const queryState = cache.cacheStateSelector(state).queries[queryKey][cacheKey];
         return queryState; // TODO proper type
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
+    }, 
+    // cacheKey needed only to re-evaluate queryStateSelector later
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [stateRef.current.cacheKey]);
     const queryStateFromSelector = (_d = (0, react_redux_1.useSelector)(queryStateSelector)) !== null && _d !== void 0 ? _d : utilsAndConstants_1.defaultQueryMutationState;
     const queryState = hasResultFromSelector
         ? (Object.assign(Object.assign({}, queryStateFromSelector), { result: resultFromSelector }))
@@ -99,11 +104,11 @@ const useQuery = (cache, options) => {
         if (queryState.loading) {
             return;
         }
+        const { params, cacheKey } = stateRef.current;
         cacheOptions.cacheQueryState &&
-            store.dispatch((0, reducer_1.setQueryStateAndEntities)(queryKey, stateRef.current.cacheKey, {
+            store.dispatch((0, reducer_1.setQueryStateAndEntities)(queryKey, cacheKey, {
                 loading: true,
             }));
-        const { paramsKey, params } = stateRef.current;
         let response;
         const fetchFn = cache.queries[queryKey].query;
         try {
@@ -112,17 +117,14 @@ const useQuery = (cache, options) => {
             params);
         }
         catch (error) {
-            if (stateRef.current.paramsKey === paramsKey && cacheOptions.cacheQueryState) {
-                store.dispatch((0, reducer_1.setQueryStateAndEntities)(queryKey, stateRef.current.cacheKey, {
-                    error: error,
-                    loading: false,
-                }));
-            }
+            store.dispatch((0, reducer_1.setQueryStateAndEntities)(queryKey, cacheKey, {
+                error: error,
+                loading: false,
+            }));
         }
-        if (response && stateRef.current.paramsKey === paramsKey) {
-            store.dispatch((0, reducer_1.setQueryStateAndEntities)(queryKey, stateRef.current.cacheKey, !cacheOptions.cacheQueryState
-                ? undefined
-                : {
+        if (response) {
+            const newState = cacheOptions.cacheQueryState
+                ? {
                     error: undefined,
                     loading: false,
                     result: hasResultFromSelector
@@ -130,13 +132,18 @@ const useQuery = (cache, options) => {
                         : mergeResults
                             ? mergeResults(
                             // @ts-expect-error fix later
-                            (_e = queryStateSelector(store.getState())) === null || _e === void 0 ? void 0 : _e.result, response, params)
+                            (_e = queryStateSelector(store.getState(), cacheKey)) === null || _e === void 0 ? void 0 : _e.result, response, params)
                             : response.result,
-                }, cacheOptions.cacheEntities ? response : undefined));
+                }
+                : undefined;
+            store.dispatch((0, reducer_1.setQueryStateAndEntities)(queryKey, cacheKey, newState, cacheOptions.cacheEntities ? response : undefined));
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }), [mergeResults, queryState.loading, hasResultFromSelector]);
     (0, react_1.useEffect)(() => {
+        if (skip) {
+            return;
+        }
         if (queryState.result != null && cacheOptions.policy === 'cache-first') {
             return;
         }
@@ -165,6 +172,13 @@ const useQuery = (cache, options) => {
     }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [fetchImpl, getCacheKey]);
+    cache.options.logsEnabled &&
+        console.debug('[useQuery]', {
+            state: stateRef.current,
+            options,
+            resultFromSelector,
+            queryState,
+        });
     return [queryState, fetch];
 };
 exports.useQuery = useQuery;

package/dist/utilsAndConstants.d.ts

@@ -2,8 +2,14 @@
 import { CacheOptions, EntitiesMap, EntityChanges, Typenames } from './types';
 export declare const PACKAGE_SHORT_NAME = "RRC";
 export declare const isDev: boolean;
+export declare const defaultCacheOptions: {
+    logsEnabled: boolean;
+    validateFunctionArguments: boolean;
+    validateHookArguments: boolean;
+};
 export declare const defaultQueryMutationState: {
     readonly loading: false;
+    readonly error: undefined;
 };
 export declare const defaultGetParamsKey: <P = unknown>(params: P) => string;
 /**

package/dist/utilsAndConstants.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.processEntityChanges = exports.log = exports.useAssertValueNotChanged = exports.useForceUpdate = exports.defaultGetParamsKey = exports.defaultQueryMutationState = exports.isDev = exports.PACKAGE_SHORT_NAME = void 0;
+exports.processEntityChanges = exports.log = exports.useAssertValueNotChanged = exports.useForceUpdate = exports.defaultGetParamsKey = exports.defaultQueryMutationState = exports.defaultCacheOptions = exports.isDev = exports.PACKAGE_SHORT_NAME = void 0;
 const react_1 = require("react");
 const react_2 = require("react");
 exports.PACKAGE_SHORT_NAME = 'RRC';
@@ -13,7 +13,12 @@ exports.isDev = (() => {
         return process.env.NODE_ENV === 'development';
     }
 })();
-exports.defaultQueryMutationState = { loading: false };
+exports.defaultCacheOptions = {
+    logsEnabled: false,
+    validateFunctionArguments: true,
+    validateHookArguments: true,
+};
+exports.defaultQueryMutationState = { loading: false, error: undefined };
 const defaultGetParamsKey = (params) => {
     switch (typeof params) {
         case 'string':
@@ -83,13 +88,6 @@ const processEntityChanges = (entities, changes, options) => {
             if (totalKeysInResponse !== 0 && idsSet.size !== totalKeysInResponse) {
                 throw new Error('Merge, replace and remove changes have intersections for: ' + typename);
             }
-            console.log('[VALIDATe]', {
-                totalKeysInResponse,
-                idsSet,
-                mergeIds,
-                replaceIds,
-                entitiesToRemove,
-            });
         }
         const newEntities = Object.assign({}, entities[typename]);
         // remove

package/package.json

@@ -2,7 +2,7 @@
   "name": "react-redux-cache",
   "author": "Alexander Danilov",
   "license": "MIT",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "description": "Powerful data fetching and caching library that supports normalization, built on top of redux",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -10,10 +10,11 @@
     "example": "(cd example && yarn && yarn start)",
     "clean": "rm -rf dist",
     "build": "yarn clean && tsc && yarn pack -f package.tgz",
-    "test": "node node_modules/jest/bin/jest.js",
+    "test": "node node_modules/jest/bin/jest.js --env=jsdom",
     "prepublishOnly": "yarn build && yarn test"
   },
   "devDependencies": {
+    "@testing-library/jest-dom": "6.1.4",
     "@testing-library/react": "14.0.0",
     "@types/jest": "29.5.1",
     "@types/node": "20.1.2",
@@ -27,12 +28,15 @@
     "eslint-plugin-react-hooks": "4.6.0",
     "eslint-plugin-simple-import-sort": "10.0.0",
     "jest": "29.5.0",
+    "jest-environment-jsdom": "29.7.0",
     "prettier": "2.8.8",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-redux": "8.0.5",
+    "react-router-dom": "6.18.0",
     "redux": "4.2.1",
     "redux-logger": "3.0.6",
+    "redux-persist": "6.0.0",
     "ts-jest": "29.1.0",
     "typescript": "5.0.4"
   },