Bug fixes

CHANGELOG.md

@@ -1,9 +1,14 @@
+## 3.0.2 (2022-03-07)
+
+- Type fixes for handlers of actions with data type `void`
+
 ## 3.0.1 (2022-03-07)
 
 - Fixed a bug where `mapStateToProps` and `mapDispatchToProps` might return `null`.
 
 ## 3.0.0 (2022-03-07)
 
+- BREAKING CHANGE: action listener parameters have been swapped, with the first now being `getSlice` and the second being the action data.
 - BREAKING CHANGE: `createApp` now returns a `React.FunctionComponent` instead of `JSX.Element`
 - BREAKING CHANGE: `createContainer` type signature updated to take three generics (props, dispatch, and ownProps) instead of a single argument (the old behavior was a bug)
 - BREAKING CHANGE: `createListener` has been renamed to `handle`

README.md

@@ -103,7 +103,7 @@ For example, if you wanted to make an API call that fetches an item after a user
 // listeners.ts
 import { handle, dispatch } from 'reduxology';
 
-export const requestItemListener = handle('RequestItem', async (id) => {
+export const requestItemListener = handle('RequestItem', async (getSlice, id) => {
   try {
     const response = await fetch(`/api/items/${id}/`);
     const data = await response.json();
@@ -609,7 +609,7 @@ Creates a listener for the given action. This method is useful for connecting AP
       <td>The type of action to listen for</td>
     </tr>
     <tr>
-      <td>listener(data, getSlice)</td>
+      <td>listener(getSlice, data)</td>
       <td>any</td>
       <td>A listener that will receive the action data.</td>
     </tr>
@@ -626,16 +626,16 @@ Creates a listener for the given action. This method is useful for connecting AP
             </tr>
           </thead>
           <tbody>
-            <tr>
-              <td>data</td>
-              <td>any or undefined</td>
-              <td>Data associated with the action, as passed to the <a href="#dispatchactiontype-data">dispatch function</a>.</td>
-            </tr>
             <tr>
               <td>getSlice(sliceName)</td>
               <td>Function</td>
               <td>Gets a state slice from the global state object</td>
             </tr>
+            <tr>
+              <td>data</td>
+              <td>any or undefined</td>
+              <td>Data associated with the action, as passed to the <a href="#dispatchactiontype-data">dispatch function</a>.</td>
+            </tr>
           </tbody>
         </table>
         <br /><em>Return Value:</em>

declarations/index.d.ts

@@ -13,8 +13,8 @@ export declare class Reduxology<State, Actions, ActionVK extends VoidKeys<Action
     constructor();
     createContainer<ComponentProps = null, ComponentDispatch = null, OwnProps = Record<string, never>>(mapStateToProps: (getSlice: GetSlice<State>, ownProps: OwnProps) => ComponentProps | null, mapDispatchToProps: (dispatch: Reduxology<State, Actions>['dispatch'], ownProps: OwnProps) => ComponentDispatch | null, component: any): ConnectedComponent<any, OwnProps>;
     createReducer: <Slice extends keyof State>(slice: Slice, initialData: State[Slice]) => Reducer<State[Slice], Actions, keyof Actions extends (Actions[keyof Actions] extends void ? keyof Actions : never) ? (Actions[keyof Actions] extends void ? keyof Actions : never) & keyof Actions : never, Exclude<keyof Actions, keyof Actions extends (Actions[keyof Actions] extends void ? keyof Actions : never) ? (Actions[keyof Actions] extends void ? keyof Actions : never) & keyof Actions : never>>;
-    handle<ActionName extends ActionNVK>(action: ActionName, listener: ListenerFunc<Actions[ActionName], State>): Listener<State>;
-    handle<Action extends ActionVK>(action: Action, listener: () => void): Listener<State>;
+    handle<ActionName extends ActionNVK>(action: ActionName, listener: ListenerFunc<State, Actions[ActionName]>): Listener<State>;
+    handle<ActionName extends ActionVK>(action: ActionName, listener: ListenerFunc<State, void>): Listener<State>;
     createApp: ({ container, reducers: appReducers, listeners: appListeners, middleware }: {
         container: React.Component | ConnectedComponent<any, any>;
         listeners?: Listener<State>[] | undefined;
@@ -31,7 +31,7 @@ export declare const createContainer: <ComponentProps = null, ComponentDispatch
 export declare const createReducer: <Slice extends never>(slice: Slice, initialData: unknown) => Reducer<unknown, unknown, never, never>;
 export declare const createListener: {
     <ActionName extends never>(action: ActionName, listener: ListenerFunc<unknown, unknown>): Listener<unknown>;
-    <Action extends never>(action: Action, listener: () => void): Listener<unknown>;
+    <ActionName_1 extends never>(action: ActionName_1, listener: ListenerFunc<unknown, void>): Listener<unknown>;
 };
 export declare const createApp: ({ container, reducers: appReducers, listeners: appListeners, middleware }: {
     container: React.Component | ConnectedComponent<any, any>;

declarations/listener.d.ts

@@ -1,9 +1,9 @@
 import { GetSlice } from './state';
 export declare const listenerAction: unique symbol;
 export declare const listenerListener: unique symbol;
-export declare type ListenerFunc<ActionData, State> = (data: ActionData, getSlice: GetSlice<State>) => void;
+export declare type ListenerFunc<State, ActionData> = (getSlice: GetSlice<State>, data: ActionData) => void;
 export declare class Listener<State> {
     [listenerAction]: string;
-    [listenerListener]: ListenerFunc<unknown, State>;
-    constructor(actionName: string, newListener: ListenerFunc<unknown, State>);
+    [listenerListener]: ListenerFunc<State, unknown>;
+    constructor(actionName: string, newListener: ListenerFunc<State, unknown>);
 }

declarations/reducer.d.ts

@@ -5,15 +5,15 @@ export declare const reducerSlice: unique symbol;
 export declare const makeReducerAlive: unique symbol;
 declare const actionHandlers: unique symbol;
 declare const isAlive: unique symbol;
-declare type Handler<S, A> = (slice: S, action: A) => void;
+declare type Handler<Slice, Action> = (slice: Slice, action: Action) => void;
 export declare class Reducer<Slice, Actions, ActionVK extends VoidKeys<Actions> = VoidKeys<Actions>, ActionNVK extends Exclude<keyof Actions, ActionVK> = Exclude<keyof Actions, ActionVK>> {
     private [actionHandlers];
     [reduxReducer]: ReduxReducer;
     [reducerSlice]: string;
     private [isAlive];
     constructor(sliceName: string, init: any);
     handle<Action extends ActionNVK>(action: Action, handler: Handler<Slice, Actions[Action]>): void;
-    handle<Action extends ActionVK>(action: Action, handler: () => void): void;
+    handle<Action extends ActionVK>(action: Action, handler: Handler<Slice, void>): void;
     [makeReducerAlive](): void;
 }
 export {};

package.json

@@ -1,6 +1,6 @@
 {
   "name": "reduxology",
-  "version": "3.0.1",
+  "version": "3.0.2",
   "description": "A library that makes it easier to manage boilerplate and reason about React Redux applications",
   "main": "dist/index.js",
   "types": "./declarations/index.d.ts",

src/index.tsx

@@ -66,7 +66,7 @@ export class Reduxology<
     DispatchVK
   >
 > {
-  private [actionListeners]: Record<any, ListenerFunc<any, State>[]> = {};
+  private [actionListeners]: Record<any, ListenerFunc<State, any>[]> = {};
   private [store]: Store;
 
   constructor() {
@@ -117,15 +117,15 @@ export class Reduxology<
 
   public handle<ActionName extends ActionNVK>(
     action: ActionName,
-    listener: ListenerFunc<Actions[ActionName], State>
+    listener: ListenerFunc<State, Actions[ActionName]>
   ): Listener<State>;
-  public handle<Action extends ActionVK>(
-    action: Action,
-    listener: () => void
+  public handle<ActionName extends ActionVK>(
+    action: ActionName,
+    listener: ListenerFunc<State, void>
   ): Listener<State>;
   public handle(
     action: any,
-    listener: ListenerFunc<any, State> | (() => void)
+    listener: ListenerFunc<State, any>
   ): Listener<State> {
     return new Listener(action, listener);
   }
@@ -167,8 +167,8 @@ export class Reduxology<
       if (this[actionListeners][action.type]) {
         for (const listener of this[actionListeners][action.type]) {
           listener(
-            action.data,
-            new State<State>(this[store].getState()).getSlice
+            new State<State>(this[store].getState()).getSlice,
+            action.data
           );
         }
       }

src/listener.ts

@@ -27,15 +27,15 @@ import { GetSlice } from './state';
 export const listenerAction = Symbol();
 export const listenerListener = Symbol();
 
-export type ListenerFunc<ActionData, State> = (
-  data: ActionData,
-  getSlice: GetSlice<State>
+export type ListenerFunc<State, ActionData> = (
+  getSlice: GetSlice<State>,
+  data: ActionData
 ) => void;
 
 export class Listener<State> {
   public [listenerAction]: string;
-  public [listenerListener]: ListenerFunc<unknown, State>;
-  constructor(actionName: string, newListener: ListenerFunc<unknown, State>) {
+  public [listenerListener]: ListenerFunc<State, unknown>;
+  constructor(actionName: string, newListener: ListenerFunc<State, unknown>) {
     this[listenerAction] = actionName;
     this[listenerListener] = newListener;
   }

src/reducer.ts

@@ -34,7 +34,7 @@ export const makeReducerAlive = Symbol();
 const actionHandlers = Symbol();
 const isAlive = Symbol();
 
-type Handler<S, A> = (slice: S, action: A) => void;
+type Handler<Slice, Action> = (slice: Slice, action: Action) => void;
 
 export class Reducer<
   Slice,
@@ -77,7 +77,7 @@ export class Reducer<
   ): void;
   public handle<Action extends ActionVK>(
     action: Action,
-    handler: () => void
+    handler: Handler<Slice, void>
   ): void;
   public handle(
     actionType: string,