@data-client/core 0.14.4 → 0.14.6

package/src/manager/DevtoolsManager.ts

@@ -1,7 +1,7 @@
 /* eslint-disable no-inner-declarations */
 import type { DevToolsConfig } from './devtoolsTypes.js';
-import type { Middleware } from './LogoutManager.js';
-import { Controller, EndpointInterface } from '../index.js';
+import type { Controller, EndpointInterface } from '../index.js';
+import type { Middleware } from '../middlewareTypes.js';
 import createReducer from '../state/reducer/createReducer.js';
 import type { Manager, State, ActionTypes } from '../types.js';
 
@@ -89,11 +89,12 @@ if (process.env.NODE_ENV !== 'production') {
  * @see https://dataclient.io/docs/api/DevToolsManager
  */
 export default class DevToolsManager implements Manager {
-  protected declare middleware: Middleware;
+  declare middleware: Middleware;
   protected declare devTools: undefined | any;
   protected started = false;
   protected actions: [ActionTypes, State<unknown>][] = [];
   protected declare controller: Controller;
+  declare skipLogging?: (action: ActionTypes) => boolean;
   maxBufferLength = 100;
 
   constructor(
@@ -110,40 +111,20 @@ export default class DevToolsManager implements Manager {
       });
     // we cut it in half so we should double so we don't lose
     if (config?.maxAge) this.maxBufferLength = config.maxAge * 2;
-    if (process.env.NODE_ENV !== 'production' && this.devTools) {
-      this.devTools.subscribe((msg: any) => {
-        switch (msg.type) {
-          case 'START':
-            this.started = true;
-
-            if (this.actions.length) {
-              this.actions.forEach(([action, state]) => {
-                this.handleAction(action, state);
-              });
-              this.actions = [];
-            }
-            break;
-          case 'STOP':
-            this.started = false;
-            break;
-          case 'DISPATCH':
-            if (msg.payload.type === 'RESET') {
-              this.controller.resetEntireStore();
-            }
-            break;
-        }
-      });
-    }
+    if (skipLogging) this.skipLogging = skipLogging;
+  }
 
+  static {
     /* istanbul ignore if */
     /* istanbul ignore next */
-    if (this.devTools) {
-      this.middleware = controller => {
+    if (process.env.NODE_ENV !== 'production') {
+      this.prototype.middleware = function (controller) {
+        if (!this.devTools) return next => action => next(action);
         this.controller = controller;
         const reducer = createReducer(controller as any);
         let state = controller.getState();
         return next => action => {
-          const shouldSkip = skipLogging?.(action);
+          const shouldSkip = this.skipLogging?.(action);
           const ret = next(action);
           if (this.started) {
             // we track state changes here since getState() will only update after a batch commit
@@ -159,7 +140,7 @@ export default class DevToolsManager implements Manager {
         };
       };
     } else {
-      this.middleware = () => next => action => next(action);
+      this.prototype.middleware = () => next => action => next(action);
     }
   }
 
@@ -178,17 +159,33 @@ export default class DevToolsManager implements Manager {
 
   /** Called when initial state is ready */
   init(state: State<any>) {
-    /* istanbul ignore if */
-    if (this.devTools) this.devTools.init(state);
+    if (process.env.NODE_ENV !== 'production' && this.devTools) {
+      this.devTools.init(state);
+      this.devTools.subscribe((msg: any) => {
+        switch (msg.type) {
+          case 'START':
+            this.started = true;
+
+            if (this.actions.length) {
+              this.actions.forEach(([action, state]) => {
+                this.handleAction(action, state);
+              });
+              this.actions = [];
+            }
+            break;
+          case 'STOP':
+            this.started = false;
+            break;
+          case 'DISPATCH':
+            if (msg.payload.type === 'RESET') {
+              this.controller.resetEntireStore();
+            }
+            break;
+        }
+      });
+    }
   }
 
   /** Ensures all subscriptions are cleaned up. */
   cleanup() {}
-
-  /** Attaches Manager to store
-   *
-   */
-  getMiddleware() {
-    return this.middleware;
-  }
 }

package/src/manager/LogoutManager.ts

@@ -1,54 +1,42 @@
 import { SET_RESPONSE_TYPE } from '../actionTypes.js';
-import Controller from '../controller/Controller.js';
+import type Controller from '../controller/Controller.js';
 import { UnknownError } from '../index.js';
-import { ActionTypes, Manager } from '../types.js';
+import type { Manager, Middleware } from '../types.js';
 
 /** Handling network unauthorized indicators like HTTP 401
  *
  * @see https://dataclient.io/docs/api/LogoutManager
  */
 export default class LogoutManager implements Manager {
-  protected declare middleware: Middleware;
-
   constructor({ handleLogout, shouldLogout }: Props = {}) {
     if (handleLogout) this.handleLogout = handleLogout;
     if (shouldLogout) this.shouldLogout = shouldLogout;
-    this.middleware = controller => next => async action => {
-      await next(action);
-      if (
-        action.type === SET_RESPONSE_TYPE &&
-        action.error &&
-        this.shouldLogout(action.response)
-      ) {
-        this.handleLogout(controller);
-      }
-    };
   }
 
-  cleanup() {}
+  middleware: Middleware = controller => next => async action => {
+    await next(action);
+    if (
+      action.type === SET_RESPONSE_TYPE &&
+      action.error &&
+      this.shouldLogout(action.response)
+    ) {
+      this.handleLogout(controller);
+    }
+  };
 
-  getMiddleware() {
-    return this.middleware;
-  }
+  cleanup() {}
 
   protected shouldLogout(error: UnknownError) {
     // 401 indicates reauthorization is needed
     return error.status === 401;
   }
 
-  handleLogout(controller: Controller<Dispatch>) {
+  handleLogout(controller: Controller) {
     controller.resetEntireStore();
   }
 }
 
-type Dispatch = (value: ActionTypes) => Promise<void>;
-
-// this further restricts the types to be future compatible
-export type Middleware = <C extends Controller<Dispatch>>(
-  controller: C,
-) => (next: C['dispatch']) => C['dispatch'];
-
-type HandleLogout = (controller: Controller<Dispatch>) => void;
+type HandleLogout = (controller: Controller) => void;
 
 interface Props {
   handleLogout?: HandleLogout;

package/src/manager/NetworkManager.ts

@@ -34,76 +34,68 @@ export default class NetworkManager implements Manager {
   protected fetchedAt: { [k: string]: number } = {};
   declare readonly dataExpiryLength: number;
   declare readonly errorExpiryLength: number;
-  protected declare middleware: Middleware;
   protected controller: Controller = new Controller();
   declare cleanupDate?: number;
 
   constructor({ dataExpiryLength = 60000, errorExpiryLength = 1000 } = {}) {
     this.dataExpiryLength = dataExpiryLength;
     this.errorExpiryLength = errorExpiryLength;
+  }
 
-    this.middleware = <C extends MiddlewareAPI>(controller: C) => {
-      this.controller = controller;
-      return (next: C['dispatch']): C['dispatch'] =>
-        (action): Promise<void> => {
-          switch (action.type) {
-            case FETCH_TYPE:
-              this.handleFetch(action);
-              // This is the only case that causes any state change
-              // It's important to intercept other fetches as we don't want to trigger reducers during
-              // render - so we need to stop 'readonly' fetches which can be triggered in render
-              if (
-                action.endpoint.getOptimisticResponse !== undefined &&
-                action.endpoint.sideEffect
-              ) {
-                return next(action);
+  middleware: Middleware = controller => {
+    this.controller = controller;
+    return next => action => {
+      switch (action.type) {
+        case FETCH_TYPE:
+          this.handleFetch(action);
+          // This is the only case that causes any state change
+          // It's important to intercept other fetches as we don't want to trigger reducers during
+          // render - so we need to stop 'readonly' fetches which can be triggered in render
+          if (
+            action.endpoint.getOptimisticResponse !== undefined &&
+            action.endpoint.sideEffect
+          ) {
+            return next(action);
+          }
+          return Promise.resolve();
+        case SET_RESPONSE_TYPE:
+          // only set after new state is computed
+          return next(action).then(() => {
+            if (action.key in this.fetched) {
+              // Note: meta *must* be set by reducer so this should be safe
+              const error = controller.getState().meta[action.key]?.error;
+              // processing errors result in state meta having error, so we should reject the promise
+              if (error) {
+                this.handleSet(
+                  createSetResponse(action.endpoint, {
+                    args: action.args,
+                    response: error,
+                    fetchedAt: action.meta.fetchedAt,
+                    error: true,
+                  }),
+                );
+              } else {
+                this.handleSet(action);
               }
-              return Promise.resolve();
-            case SET_RESPONSE_TYPE:
-              // only set after new state is computed
-              return next(action).then(() => {
-                if (action.key in this.fetched) {
-                  // Note: meta *must* be set by reducer so this should be safe
-                  const error = controller.getState().meta[action.key]?.error;
-                  // processing errors result in state meta having error, so we should reject the promise
-                  if (error) {
-                    this.handleSet(
-                      createSetResponse(action.endpoint, {
-                        args: action.args,
-                        response: error,
-                        fetchedAt: action.meta.fetchedAt,
-                        error: true,
-                      }),
-                    );
-                  } else {
-                    this.handleSet(action);
-                  }
-                }
-              });
-            case RESET_TYPE: {
-              const rejectors = { ...this.rejectors };
+            }
+          });
+        case RESET_TYPE: {
+          const rejectors = { ...this.rejectors };
 
-              this.clearAll();
-              return next(action).then(() => {
-                // there could be external listeners to the promise
-                // this must happen after commit so our own rejector knows not to dispatch an error based on this
-                for (const k in rejectors) {
-                  rejectors[k](new ResetError());
-                }
-              });
+          this.clearAll();
+          return next(action).then(() => {
+            // there could be external listeners to the promise
+            // this must happen after commit so our own rejector knows not to dispatch an error based on this
+            for (const k in rejectors) {
+              rejectors[k](new ResetError());
             }
-            default:
-              return next(action);
-          }
-        };
+          });
+        }
+        default:
+          return next(action);
+      }
     };
-  }
-
-  /** Used by DevtoolsManager to determine whether to log an action */
-  skipLogging(action: ActionTypes) {
-    /* istanbul ignore next */
-    return action.type === FETCH_TYPE && action.key in this.fetched;
-  }
+  };
 
   /** On mount */
   init() {
@@ -117,6 +109,12 @@ export default class NetworkManager implements Manager {
     this.cleanupDate = Date.now();
   }
 
+  /** Used by DevtoolsManager to determine whether to log an action */
+  skipLogging(action: ActionTypes) {
+    /* istanbul ignore next */
+    return action.type === FETCH_TYPE && action.key in this.fetched;
+  }
+
   allSettled() {
     const fetches = Object.values(this.fetched);
     if (fetches.length) return Promise.allSettled(fetches);
@@ -241,17 +239,6 @@ export default class NetworkManager implements Manager {
     }
   }
 
-  /** Attaches NetworkManager to store
-   *
-   * Intercepts 'rdc/fetch' actions to start requests.
-   *
-   * Resolve/rejects a request when matching 'rdc/set' event
-   * is seen.
-   */
-  getMiddleware() {
-    return this.middleware;
-  }
-
   /** Ensures only one request for a given key is in flight at any time
    *
    * Uses key to either retrieve in-flight promise, or if not

package/src/manager/SubscriptionManager.ts

@@ -41,33 +41,31 @@ export default class SubscriptionManager<
   } = {};
 
   protected declare readonly Subscription: S;
-  protected declare middleware: Middleware;
   protected controller: Controller = new Controller();
 
   constructor(Subscription: S) {
     this.Subscription = Subscription;
+  }
 
-    this.middleware = <C extends MiddlewareAPI>(controller: C) => {
-      this.controller = controller;
-      return (next: C['dispatch']): C['dispatch'] =>
-        action => {
-          switch (action.type) {
-            case SUBSCRIBE_TYPE:
-              try {
-                this.handleSubscribe(action);
-              } catch (e) {
-                console.error(e);
-              }
-              return Promise.resolve();
-            case UNSUBSCRIBE_TYPE:
-              this.handleUnsubscribe(action);
-              return Promise.resolve();
-            default:
-              return next(action);
+  middleware: Middleware = controller => {
+    this.controller = controller;
+    return next => action => {
+      switch (action.type) {
+        case SUBSCRIBE_TYPE:
+          try {
+            this.handleSubscribe(action);
+          } catch (e) {
+            console.error(e);
           }
-        };
+          return Promise.resolve();
+        case UNSUBSCRIBE_TYPE:
+          this.handleUnsubscribe(action);
+          return Promise.resolve();
+        default:
+          return next(action);
+      }
     };
-  }
+  };
 
   /** Ensures all subscriptions are cleaned up. */
   cleanup() {
@@ -110,16 +108,4 @@ export default class SubscriptionManager<
       console.error(`Mismatched unsubscribe: ${key} is not subscribed`);
     }
   }
-
-  /** Attaches Manager to store
-   *
-   * Intercepts 'rdc/subscribe'/'rest-hordc/ribe' to register resources that
-   * need to be kept up to date.
-   *
-   * Will possibly dispatch 'rdc/fetch' or 'rest-hordc/' to keep resources fresh
-   *
-   */
-  getMiddleware() {
-    return this.middleware;
-  }
 }

package/src/manager/__tests__/applyManager.ts

@@ -1,5 +1,13 @@
+import { Article } from '__tests__/new';
+
+import { createSet } from '../../controller/actions';
 import Controller from '../../controller/Controller';
-import applyManager from '../applyManager';
+import { Dispatch, Middleware } from '../../middlewareTypes';
+import { Manager } from '../../types';
+import applyManager, {
+  ReduxMiddleware,
+  ReduxMiddlewareAPI,
+} from '../applyManager';
 import NetworkManager from '../NetworkManager';
 
 function onError(e: any) {
@@ -36,3 +44,55 @@ it('applyManagers should not console.warn() when NetworkManager is provided', ()
     warnspy.mockRestore();
   }
 });
+it('applyManagers should handle legacy Manager.getMiddleware()', () => {
+  let initCount = 0;
+  let actionCount = 0;
+  class MyManager implements Manager {
+    getMiddleware = (): Middleware => ctrl => {
+      initCount++;
+      return next => action => {
+        actionCount++;
+        return next(action);
+      };
+    };
+
+    cleanup() {}
+  }
+  const middlewares = applyManager(
+    [new MyManager(), new NetworkManager()],
+    new Controller(),
+  );
+
+  const rootDispatch = jest.fn((action: any) => {
+    return Promise.resolve();
+  });
+
+  const dispatch = middlewareDispatch(middlewares, rootDispatch);
+
+  expect(initCount).toBe(1);
+  expect(actionCount).toBe(0);
+  expect(rootDispatch.mock.calls.length).toBe(0);
+  dispatch(
+    createSet(Article, { args: [{ id: 1 }], value: { id: 1, title: 'hi' } }),
+  );
+  expect(initCount).toBe(1);
+  expect(actionCount).toBe(1);
+  expect(rootDispatch.mock.calls.length).toBe(1);
+});
+
+function middlewareDispatch(
+  middlewares: ReduxMiddleware[],
+  rootDispatch: Dispatch,
+) {
+  const middlewareAPI: ReduxMiddlewareAPI = {
+    getState: () => ({}),
+    dispatch: action => rootDispatch(action),
+  };
+  const comp = compose(
+    middlewares.map(middleware => middleware(middlewareAPI)),
+  );
+  const dispatch = comp(rootDispatch);
+  return dispatch;
+}
+const compose = (fns: ((...args: any) => any)[]) => (initial: any) =>
+  fns.reduceRight((v, f) => f(v), initial);

package/src/manager/__tests__/logoutManager.ts

@@ -21,11 +21,10 @@ describe('LogoutManager', () => {
   const manager = new LogoutManager();
   const getState = () => initialState;
 
-  describe('getMiddleware()', () => {
+  describe('middleware', () => {
     it('should return the same value every call', () => {
-      const a = manager.getMiddleware();
-      expect(a).toBe(manager.getMiddleware());
-      expect(a).toBe(manager.getMiddleware());
+      const a = manager.middleware;
+      expect(a).toBe(manager.middleware);
     });
   });
 
@@ -33,7 +32,6 @@ describe('LogoutManager', () => {
     afterEach(() => {
       jest.useRealTimers();
     });
-    const middleware = manager.getMiddleware();
     const next = jest.fn();
     const dispatch = jest.fn(action => Promise.resolve());
     const controller = new Controller({ dispatch, getState });
@@ -48,7 +46,7 @@ describe('LogoutManager', () => {
         args: [{ id: 5 }],
         response: { id: 5, title: 'hi' },
       });
-      await middleware(API)(next)(action);
+      await manager.middleware(API)(next)(action);
 
       expect(dispatch.mock.calls.length).toBe(0);
     });
@@ -60,7 +58,7 @@ describe('LogoutManager', () => {
         response: error,
         error: true,
       });
-      await middleware(API)(next)(action);
+      await manager.middleware(API)(next)(action);
 
       expect(dispatch.mock.calls.length).toBe(0);
     });
@@ -72,7 +70,7 @@ describe('LogoutManager', () => {
         response: error,
         error: true,
       });
-      await middleware(API)(next)(action);
+      await manager.middleware(API)(next)(action);
 
       expect(dispatch.mock.calls.length).toBe(1);
       expect(dispatch.mock.calls[0][0]?.type).toBe(RESET_TYPE);
@@ -85,7 +83,7 @@ describe('LogoutManager', () => {
           return error.status === 403;
         },
         handleLogout,
-      }).getMiddleware();
+      }).middleware;
       const error: any = new Error('network failed');
       error.status = 403;
       const action = createSetResponse(CoolerArticleResource.get, {
@@ -102,7 +100,7 @@ describe('LogoutManager', () => {
       const action = { type: FETCH_TYPE };
       next.mockReset();
 
-      await middleware(API)(next)(action as any);
+      await manager.middleware(API)(next)(action as any);
 
       expect(next.mock.calls.length).toBe(1);
     });

package/src/manager/__tests__/manager.ts

@@ -1,9 +1,8 @@
 import Controller from '../../controller/Controller';
-import { Middleware } from '../../middlewareTypes';
 import { ActionTypes } from '../../types';
 import NetworkManager from '../NetworkManager';
 
-const middleware: Middleware = new NetworkManager().getMiddleware();
+const netMgr = new NetworkManager();
 it('middlewares should compose with non-data-client middlewares', () => {
   type AnotherAction = {
     type: 'BOB';
@@ -30,7 +29,7 @@ it('middlewares should compose with non-data-client middlewares', () => {
       counter++;
     };
 
-  const [a, b] = [middleware(API), nonRHMiddleware(API)];
+  const [a, b] = [netMgr.middleware(API), nonRHMiddleware(API)];
   const dispA = a(b(dispatch));
   const dispB = b(a(dispatch));
   expect(dispatch.mock.calls.length).toBe(0);