fix(useTimeout): isPending never updates

package.json

@@ -94,5 +94,6 @@
   },
   "dependencies": {
     "dequal": "^2.0.3"
-  }
+  },
+  "packageManager": "[email protected]+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
 }

src/useTimeout.ts

@@ -1,4 +1,4 @@
-import { MutableRefObject, useEffect, useRef, useState } from 'react'
+import { MutableRefObject, useEffect, useMemo, useRef, useState } from 'react'
 import useMounted from './useMounted'
 
 /*
@@ -88,7 +88,9 @@ export default function useTimeout() {
     }
   }, [timeout])
 
-  const [returnValue] = useState(() => {
+  const isPending = !!timeout
+
+  return useMemo(() => {
     return {
       set(fn: () => void, delayMs = 0): void {
         if (!isMounted()) return
@@ -98,10 +100,8 @@ export default function useTimeout() {
       clear() {
         setTimeoutState(null)
       },
-      isPending: !!timeout,
+      isPending,
       handleRef,
     }
-  })
-
-  return returnValue
+  }, [isPending, setTimeoutState, handleRef, isMounted])
 }

test/useTimeout.test.tsx

@@ -7,7 +7,7 @@ describe('useTimeout', () => {
     jest.useFakeTimers()
 
     let spy = jest.fn()
-    let timeout: ReturnType<typeof useTimeout>
+    let timeout!: ReturnType<typeof useTimeout>
 
     function Wrapper() {
       timeout = useTimeout()
@@ -18,23 +18,25 @@ describe('useTimeout', () => {
     render(<Wrapper />)
 
     act(() => {
-      timeout!.set(spy, 100)
+      timeout.set(spy, 100)
     })
 
+    expect(timeout.isPending).toBe(true)
     expect(spy).not.toHaveBeenCalled()
 
     act(() => {
       jest.runAllTimers()
     })
 
+    expect(timeout.isPending).toBe(false)
     expect(spy).toHaveBeenCalledTimes(1)
   })
 
   it('should clear a timeout', () => {
     jest.useFakeTimers()
 
     let spy = jest.fn()
-    let timeout: ReturnType<typeof useTimeout>
+    let timeout!: ReturnType<typeof useTimeout>
 
     function Wrapper() {
       timeout = useTimeout()
@@ -45,14 +47,17 @@ describe('useTimeout', () => {
     render(<Wrapper />)
 
     act(() => {
-      timeout!.set(spy, 100)
+      timeout.set(spy, 100)
     })
 
+    expect(timeout.isPending).toBe(true)
+
     act(() => {
       timeout!.clear()
       jest.runAllTimers()
     })
 
+    expect(timeout.isPending).toBe(false)
     expect(spy).toHaveBeenCalledTimes(0)
   })