Merge pull request #50 from LeetCode-OpenSource/reduce-rerender

Reduce rerender

Author: Brooooooklyn

package.json

@@ -21,39 +21,39 @@
     "url": "git@github.com:LeetCode-OpenSource/rxjs-hooks.git"
   },
   "devDependencies": {
-    "@types/jest": "^24.0.6",
-    "@types/lodash": "^4.14.121",
-    "@types/react-dom": "^16.8.2",
+    "@types/jest": "^24.0.13",
+    "@types/lodash": "^4.14.133",
+    "@types/react-dom": "^16.8.4",
     "@types/react-test-renderer": "^16.8.1",
-    "@types/sinon": "^7.0.6",
+    "@types/sinon": "^7.0.12",
     "@types/sinon-chai": "^3.2.2",
-    "@types/webpack": "^4.4.24",
+    "@types/webpack": "^4.4.32",
     "coveralls": "^3.0.3",
-    "fork-ts-checker-webpack-plugin": "^1.0.0",
+    "fork-ts-checker-webpack-plugin": "^1.3.4",
     "happypack": "^5.0.1",
     "html-webpack-plugin": "^3.2.0",
-    "husky": "^2.0.0",
-    "jest": "^24.1.0",
-    "lint-staged": "^8.1.4",
-    "prettier": "^1.16.4",
+    "husky": "^2.3.0",
+    "jest": "^24.8.0",
+    "lint-staged": "^8.1.7",
+    "prettier": "^1.17.1",
     "react": "16.8.6",
     "react-dom": "16.8.6",
     "react-test-renderer": "16.8.6",
-    "rxjs": "^6.4.0",
-    "sinon": "^7.2.4",
+    "rxjs": "^6.5.2",
+    "sinon": "^7.3.2",
     "source-map-loader": "^0.2.4",
     "standard": "^12.0.1",
-    "ts-jest": "^24.0.0",
-    "ts-loader": "^5.3.3",
-    "tslint": "^5.13.0",
+    "ts-jest": "^24.0.2",
+    "ts-loader": "^6.0.2",
+    "tslint": "^5.17.0",
     "tslint-config-prettier": "^1.18.0",
     "tslint-eslint-rules": "^5.4.0",
     "tslint-react": "^4.0.0",
     "tslint-sonarts": "^1.9.0",
-    "typescript": "^3.3.3",
-    "webpack": "^4.29.5",
-    "webpack-cli": "^3.2.3",
-    "webpack-dev-server": "^3.2.1"
+    "typescript": "^3.5.1",
+    "webpack": "^4.32.2",
+    "webpack-cli": "^3.3.2",
+    "webpack-dev-server": "^3.5.0"
   },
   "dependencies": {
     "tslib": "^1.9.3"

src/use-event-callback.ts

@@ -1,19 +1,10 @@
-import { useEffect, useState } from 'react'
-import { Observable, BehaviorSubject, Subject, noop } from 'rxjs'
+import { useEffect, useState, useCallback } from 'react'
+import { Observable, BehaviorSubject, Subject } from 'rxjs'
 
 import { RestrictArray, VoidAsNull, Not } from './type'
 
-// https://stackoverflow.com/questions/55541275/typescript-check-for-the-any-type
-type IfAny<T, Y, N> = 0 extends (1 & T) ? Y : N
-
-type IsAny<T> = IfAny<T, true, false>
-
-type IsVoid<T> = IsAny<T> extends true ? false : [T] extends [void] ? true : false
-
-type VoidableCallback<EventValue> = IsVoid<EventValue> extends true ? () => void : (val: EventValue) => void
-
 export type EventCallbackState<EventValue, State, Inputs = void> = [
-  VoidableCallback<EventValue>,
+  (e: EventValue) => void,
   [State extends void ? null : State, BehaviorSubject<State | null>, BehaviorSubject<RestrictArray<Inputs> | null>]
 ]
 export type ReturnedState<EventValue, State, Inputs> = [
@@ -53,9 +44,11 @@ export function useEventCallback<EventValue, State = void, Inputs = void>(
   const inputSubject$ = new BehaviorSubject<RestrictArray<Inputs> | null>(typeof inputs === 'undefined' ? null : inputs)
   const stateSubject$ = new BehaviorSubject<State | null>(initialValue)
   const [state, setState] = useState(initialValue)
-  const [returnedCallback, setEventCallback] = useState<VoidableCallback<EventValue>>(
-    () => noop as VoidableCallback<EventValue>,
-  )
+  const [event$] = useState(new Subject<EventValue>())
+  function eventCallback(e: EventValue) {
+    return event$.next(e)
+  }
+  const returnedCallback = useCallback(eventCallback, [])
   const [state$] = useState(stateSubject$)
   const [inputs$] = useState(inputSubject$)
 
@@ -64,12 +57,7 @@ export function useEventCallback<EventValue, State = void, Inputs = void>(
   }, inputs || [])
 
   useEffect(() => {
-    const event$ = new Subject<EventValue>()
-    function eventCallback(e: EventValue) {
-      return event$.next(e)
-    }
     setState(initialValue)
-    setEventCallback(() => eventCallback as VoidableCallback<EventValue>)
     let value$: Observable<State>
 
     if (!inputs) {