diff --git a/web/hooks/use-state-check-equality.ts b/web/hooks/use-state-check-equality.ts
index d8dc88dd..e5d97f56 100644
--- a/web/hooks/use-state-check-equality.ts
+++ b/web/hooks/use-state-check-equality.ts
@@ -1,5 +1,5 @@
 import { isEqual } from 'lodash'
-import { useMemo, useRef, useState } from 'react'
+import { SetStateAction, useMemo, useRef, useState } from 'react'
 
 export const useStateCheckEquality = <T>(initialState: T) => {
   const [state, setState] = useState(initialState)
@@ -8,8 +8,9 @@ export const useStateCheckEquality = <T>(initialState: T) => {
   stateRef.current = state
 
   const checkSetState = useMemo(
-    () => (newState: T) => {
+    () => (next: SetStateAction<T>) => {
       const state = stateRef.current
+      const newState = next instanceof Function ? next(state) : next
       if (!isEqual(state, newState)) {
         setState(newState)
       }