feat: Release effectOn & prepare for v6.0.0 (#813)

* feat: Stabilize `effectOn` & prepare for 6.0.0 - Refactors `unstable_effectOn` -> `effectOn` - Updated docs - Bumps version to `6.0.0` todo: - [ ] Publish a copy of existing docs to `https://easy-peasy-v5.vercel.app/` * docs: remove last reference to "unstable" --------- Co-authored-by: Peter Weinberg <[email protected]>
ctrlplusb · Apr 18, 2023 · fcb53b9 · fcb53b9 · vercel · Apr 18, 2023
1 parent 90db988
commit fcb53b9
Show file tree

Hide file tree

Showing 16 changed files with 109 additions and 138 deletions.
diff --git a/examples/kanban/package.json b/examples/kanban/package.json
@@ -12,7 +12,7 @@
     "type-check": "tsc"
   },
   "dependencies": {
-    "easy-peasy": "5.1.0",
+    "easy-peasy": "6.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },

diff --git a/examples/nextjs-todo/package.json b/examples/nextjs-todo/package.json
@@ -9,7 +9,7 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "easy-peasy": "5.2.0",
+    "easy-peasy": "6.0.0",
     "next": "13.2.4",
     "react": "18.2.0",
     "react-dom": "18.2.0"

diff --git a/examples/reduxtagram/package.json b/examples/reduxtagram/package.json
@@ -13,7 +13,7 @@
   },
   "dependencies": {
     "@types/react-transition-group": "^4.4.5",
-    "easy-peasy": "^5.1.0",
+    "easy-peasy": "6.0.0",
     "nanoid": "^4.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

diff --git a/examples/simple-todo/package.json b/examples/simple-todo/package.json
@@ -11,7 +11,7 @@
     "type-check": "tsc"
   },
   "dependencies": {
-    "easy-peasy": "5.1.0",
+    "easy-peasy": "6.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },

diff --git a/index.d.ts b/index.d.ts
@@ -94,7 +94,7 @@ type ActionListenerTypes = ActionOn<any, any> | ThunkOn<any, any, any>;
 type ActionTypes =
   | ActionEmitterTypes
   | ActionListenerTypes
-  | Unstable_EffectOn<any, any, any>;
+  | EffectOn<any, any, any>;
 
 interface ActionCreator<Payload = void> {
   (payload: Payload): void;
@@ -698,7 +698,7 @@ export function computed<
 
 // #region EffectOn
 
-export interface Unstable_EffectOn<
+export interface EffectOn<
   Model extends object = {},
   StoreModel extends object = {},
   Injections = any,
@@ -717,7 +717,7 @@ type Change<Resolvers extends StateResolvers<any, any>> = {
 
 export type Dispose = () => any;
 
-export function unstable_effectOn<
+export function effectOn<
   Model extends object = {},
   StoreModel extends object = {},
   Injections = any,
@@ -732,7 +732,7 @@ export function unstable_effectOn<
     change: Change<Resolvers>,
     helpers: Helpers<Model, StoreModel, Injections>,
   ) => undefined | void | Dispose,
-): Unstable_EffectOn<Model, StoreModel, Injections>;
+): EffectOn<Model, StoreModel, Injections>;
 
 // #endregion
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "easy-peasy",
-  "version": "5.2.1-alpha.0",
+  "version": "6.0.0",
   "description": "Vegetarian friendly state for React",
   "license": "MIT",
   "main": "dist/index.cjs.js",

diff --git a/src/helpers.js b/src/helpers.js
@@ -21,13 +21,13 @@ export const actionOn = (targetResolver, fn, config) => ({
   [actionOnSymbol]: true,
   fn,
   targetResolver,
-  config
+  config,
 });
 
 export const action = (fn, config) => ({
   [actionSymbol]: true,
   fn,
-  config
+  config,
 });
 
 const defaultStateResolvers = [(state) => state];
@@ -47,7 +47,7 @@ export const computed = (fnOrStateResolvers, fn) => {
   };
 };
 
-export function unstable_effectOn(dependencyResolvers, fn) {
+export function effectOn(dependencyResolvers, fn) {
   return {
     [effectOnSymbol]: true,
     dependencyResolvers,
@@ -82,5 +82,5 @@ export const thunk = (fn) => ({
 export const reducer = (fn, config) => ({
   [reducerSymbol]: true,
   fn,
-  config
+  config,
 });
diff --git a/tests/effect-on.test.js b/tests/effect-on.test.js
@@ -1,7 +1,7 @@
 import {
   createStore,
   action,
-  unstable_effectOn,
+  effectOn,
   thunk,
   thunkOn,
   actionOn,
@@ -36,7 +36,7 @@ test('fires when the dependencies change', () => {
     addTodo: action((state, payload) => {
       state.todos.push(payload);
     }),
-    onTodosChanged: unstable_effectOn(
+    onTodosChanged: effectOn(
       [(state) => state.todos, (state) => state.foo],
       () => {
         fired = true;
@@ -45,7 +45,7 @@ test('fires when the dependencies change', () => {
   });
 
   // ACT
-  store.getActions().addTodo('add unstable_effectOn api');
+  store.getActions().addTodo('add effectOn api');
 
   // ASSERT
   expect(fired).toBe(true);
@@ -69,7 +69,7 @@ test('does not fire when the dependencies have not changed', () => {
     setFoo: action((state, payload) => {
       state.foo = payload;
     }),
-    onTodosChanged: unstable_effectOn([(state) => state.todos], () => {
+    onTodosChanged: effectOn([(state) => state.todos], () => {
       fired = true;
     }),
   });
@@ -89,7 +89,7 @@ test('fires when store dependency changes', () => {
       setFired: action((state, payload) => {
         state.fired = payload;
       }),
-      onTodosChanged: unstable_effectOn(
+      onTodosChanged: effectOn(
         [(state, storeState) => storeState.todos],
         (actions) => {
           actions.setFired(true);
@@ -123,7 +123,7 @@ test('it receives the local actions', () => {
     setFired: action((state, payload) => {
       state.fired = payload;
     }),
-    onTodosChanged: unstable_effectOn([(state) => state.todos], (actions) => {
+    onTodosChanged: effectOn([(state) => state.todos], (actions) => {
       actions.setFired(true);
     }),
   });
@@ -144,7 +144,7 @@ test('it receives the local actions for nested model', () => {
     nested: {
       fired: false,
       todos: [],
-      onTodosChanged: unstable_effectOn([(state) => state.todos], (actions) => {
+      onTodosChanged: effectOn([(state) => state.todos], (actions) => {
         actions.setFired(true);
       }),
       addTodo: action((state, payload) => {
@@ -153,7 +153,7 @@ test('it receives the local actions for nested model', () => {
       setFired: action((state, payload) => {
         state.fired = payload;
       }),
-    }
+    },
   });
 
   // ASSERT
@@ -184,12 +184,9 @@ test('change argument is as expected', () => {
         actions.setTwo(target.payload);
       },
     ),
-    onStateChanged: unstable_effectOn(
-      [(state) => state.two],
-      (actions, change) => {
-        actualChange = change;
-      },
-    ),
+    onStateChanged: effectOn([(state) => state.two], (actions, change) => {
+      actualChange = change;
+    }),
   });
 
   // ACT
@@ -216,7 +213,7 @@ test('getState is exposed in helpers', async () => {
       setString: action((state, payload) => {
         state.string = payload;
       }),
-      onStateChanged: unstable_effectOn(
+      onStateChanged: effectOn(
         [(state) => state.string],
         (actions, change, { getState }) => {
           actualState = getState();
@@ -245,7 +242,7 @@ test('getStoreState is exposed in helpers', async () => {
       setString: action((state, payload) => {
         state.string = payload;
       }),
-      onStateChanged: unstable_effectOn(
+      onStateChanged: effectOn(
         [(state) => state.string],
         (actions, change, { getStoreState }) => {
           actualStoreState = getStoreState();
@@ -276,7 +273,7 @@ test('meta values are exposed in helpers', async () => {
       setString: action((state, payload) => {
         state.string = payload;
       }),
-      onStateChanged: unstable_effectOn(
+      onStateChanged: effectOn(
         [(state) => state.string],
         (actions, change, { meta }) => {
           actualMeta = meta;
@@ -308,7 +305,7 @@ test('injections are exposed in helpers', async () => {
         setString: action((state, payload) => {
           state.string = payload;
         }),
-        onStateChanged: unstable_effectOn(
+        onStateChanged: effectOn(
           [(state) => state.string],
           (actions, change, helpers) => {
             actualInjections = helpers.injections;
@@ -338,7 +335,7 @@ test('dispatch is exposed in helpers', async () => {
       setString: action((state, payload) => {
         state.string = payload;
       }),
-      onStateChanged: unstable_effectOn(
+      onStateChanged: effectOn(
         [(state) => state.string],
         (actions, change, helpers) => {
           actualDispatch = helpers.dispatch;
@@ -363,7 +360,7 @@ test('getStoreActions are exposed in helpers', async () => {
       setString: action((state, payload) => {
         state.string = payload;
       }),
-      onStateChanged: unstable_effectOn(
+      onStateChanged: effectOn(
         [(state) => state.string],
         (actions, change, helpers) => {
           helpers.getStoreActions().nested.setString('three');
@@ -391,12 +388,9 @@ test('dispatches actions to represent a succeeded effect', () => {
       setNumber: action((state, payload) => {
         state.number = payload;
       }),
-      onStateChanged: unstable_effectOn(
-        [(state) => state.string],
-        (actions) => {
-          actions.setNumber(2);
-        },
-      ),
+      onStateChanged: effectOn([(state) => state.string], (actions) => {
+        actions.setNumber(2);
+      }),
     },
   };
   const trackActions = trackActionsMiddleware();
@@ -448,7 +442,7 @@ describe('errors', () => {
         doAsync: thunk(() => {
           throw err;
         }),
-        onStateChanged: unstable_effectOn(
+        onStateChanged: effectOn(
           [(state) => state.string],
           async (actions, change) => {
             await actions.doAsync(change.action.payload);
@@ -504,7 +498,7 @@ test('effects cannot be targetted by actionOn', async () => {
       setString: action((state, payload) => {
         state.string = payload;
       }),
-      onStateChanged: unstable_effectOn([(state) => state.string], () => {
+      onStateChanged: effectOn([(state) => state.string], () => {
         // do nothing
       }),
       invalidActionOn: actionOn(
@@ -535,7 +529,7 @@ test('effects cannot be targetted by thunkOn', async () => {
       setString: action((state, payload) => {
         state.string = payload;
       }),
-      onStateChanged: unstable_effectOn([(state) => state.string], () => {
+      onStateChanged: effectOn([(state) => state.string], () => {
         // do nothing
       }),
       invalidThunkOn: actionOn(
@@ -567,7 +561,7 @@ test('synchronous effect with synchronous dispose executes as expected', () => {
     setFoo: action((state, payload) => {
       state.foo = payload;
     }),
-    onFooChange: unstable_effectOn([(state) => state.foo], () => {
+    onFooChange: effectOn([(state) => state.foo], () => {
       executionId += 1;
       executions.push({ id: executionId, type: 'effect' });
       return () => {
@@ -601,7 +595,7 @@ test('synchronous effect with asynchronous dispose executes as expected', async
     setFoo: action((state, payload) => {
       state.foo = payload;
     }),
-    onFooChange: unstable_effectOn([(state) => state.foo], () => {
+    onFooChange: effectOn([(state) => state.foo], () => {
       executionId += 1;
       const id = executionId;
       executions.push({ id, type: 'effect' });

diff --git a/tests/typescript/effect-on.ts b/tests/typescript/effect-on.ts
@@ -1,10 +1,4 @@
-import {
-  createStore,
-  Unstable_EffectOn,
-  unstable_effectOn,
-  Action,
-  action,
-} from 'easy-peasy';
+import { createStore, EffectOn, effectOn, Action, action } from 'easy-peasy';
 
 interface Injections {
   doSomething: () => Promise<void>;
@@ -14,7 +8,7 @@ interface TodosModel {
   items: { id: number; text: string }[];
   foo: string;
   setFoo: Action<TodosModel, string>;
-  onStateChanged: Unstable_EffectOn<TodosModel, StoreModel, Injections>;
+  onStateChanged: EffectOn<TodosModel, StoreModel, Injections>;
 }
 
 interface StoreModel {
@@ -28,7 +22,7 @@ const todosModel: TodosModel = {
   setFoo: action((state, payload) => {
     state.foo = payload;
   }),
-  onStateChanged: unstable_effectOn(
+  onStateChanged: effectOn(
     [
       (state) => state.items,
       (state) => state.foo,

diff --git a/tests/typescript/external-type-defs.ts b/tests/typescript/external-type-defs.ts
@@ -5,11 +5,11 @@ import {
   Computed,
   thunk,
   Thunk,
-  unstable_effectOn,
-  Unstable_EffectOn,
+  effectOn,
+  EffectOn,
 } from 'easy-peasy';
 
-type MyModelEffectOn = Unstable_EffectOn<MyModel>;
+type MyModelEffectOn = EffectOn<MyModel>;
 type MyModelAction<TPayload = void> = Action<MyModel, TPayload>;
 type MyModelComputed<TResult> = Computed<MyModel, TResult>;
 type MyModelThunk<TPayload = undefined, TResult = any> = Thunk<
@@ -57,10 +57,7 @@ const myModel: MyModel = {
     return true;
   }),
 
-  myEffectOn: unstable_effectOn(
-    [(state) => state.myState.value],
-    (actions, change) => {
-      // do something
-    },
-  ),
+  myEffectOn: effectOn([(state) => state.myState.value], (actions, change) => {
+    // do something
+  }),
 };