fix(change): change onAfter/beforeChange to onBefore/After

Author: faceyspacey

.npmignore

@@ -18,3 +18,4 @@ webpack.config.js
 .eslintignore
 .flowconfig
 *.png
+yarn.lock

README.md

@@ -156,7 +156,7 @@ The first argument can be a function that returns a promise, a promise itself, o
 
 - `onError` is a callback called if async imports fail. It does not apply to sync requires.
 
-- `onLoad` is a callback function that receives the *entire* module. It allows you to export and put to use things other than your `default` component export, like reducers, sagas, etc. E.g: `onLoad: module => store.replaceReducer({ ...otherReducers, foo: module.fooReducer })`. It's fired directly before the component is rendered so you can setup any reducers/etc it depends on. Unlike `onAfterChange`, it's only fired the first time the module is received. *Also note*: it will fire on the server, so do `if (!isServer)` if you have to.
+- `onLoad` is a callback function that receives the *entire* module. It allows you to export and put to use things other than your `default` component export, like reducers, sagas, etc. E.g: `onLoad: module => store.replaceReducer({ ...otherReducers, foo: module.fooReducer })`. It's fired directly before the component is rendered so you can setup any reducers/etc it depends on. Unlike `onAfter`, it's only fired the first time the module is received. *Also note*: it will fire on the server, so do `if (!isServer)` if you have to.
 
 - `minDelay` is essentially the minimum amount of time the `loading` component will always show for. It's good for enforcing silky smooth animations, such as during a 500ms sliding transition. It insures the re-render won't happen until the animation is complete. It's often a good idea to set this to something like 300ms even if you don't have a transition, just so the loading spinner shows for an appropriate amount of time without jank.
 

src/flowTypes.js

@@ -91,14 +91,14 @@ export type Ids = Array<string>
 export type State = { error?: any, Component?: ?any }
 
 type Info = { isMount: boolean, isSync: boolean, isServer: boolean }
-type OnBeforeChange = Info => void
-type OnAfterChange = (Info, any) => void
+type OnBefore = Info => void
+type OnAfter = (Info, any) => void
 
 export type Props = {
   error?: ?any,
   isLoading?: ?boolean,
-  onBeforeChange?: OnBeforeChange,
-  onAfterChange?: OnAfterChange
+  OnBefore?: OnBefore,
+  OnAfter?: OnAfter
 }
 
 export type GenericComponent<Props> =

src/index.js

@@ -155,10 +155,10 @@ export default function universal<Props: Props>(
       isSync: boolean,
       isServer?: boolean = false
     ) {
-      if (this.props.onBeforeChange) {
-        const onBeforeChange = this.props.onBeforeChange
+      if (typeof this.props.onBefore === 'function') {
+        const onBefore = this.props.onBefore
         const info = { isMount, isSync, isServer }
-        onBeforeChange(info)
+        onBefore(info)
       }
     }
 
@@ -168,14 +168,16 @@ export default function universal<Props: Props>(
       isSync: boolean,
       isServer: boolean
     ) {
-      if (state.Component && !state.error) {
-        hoist(UniversalComponent, state.Component, { preload: true })
+      const { Component, error } = state
+
+      if (Component && state.error) {
+        hoist(UniversalComponent, Component, { preload: true })
       }
 
-      if (state.Component && !state.error && this.props.onAfterChange) {
-        const onAfterChange = this.props.onAfterChange
+      if (Component && !error && typeof this.props.onAfter === 'function') {
+        const onAfter = this.props.onAfter
         const info = { isMount, isSync, isServer }
-        this.setState(state, () => onAfterChange(info, state.Component))
+        this.setState(state, () => onAfter(info, Component))
         return
       }