fix: can not save when switch to skill

web/app/components/workflow/hooks/use-serial-async-callback.ts

@@ -1,5 +1,6 @@
 import {
   useCallback,
+  useEffect,
   useRef,
 } from 'react'
 
@@ -8,15 +9,25 @@ export const useSerialAsyncCallback = <Args extends any[], Result = void>(
   shouldSkip?: () => boolean,
 ) => {
   const queueRef = useRef<Promise<unknown>>(Promise.resolve())
+  const fnRef = useRef(fn)
+  const shouldSkipRef = useRef(shouldSkip)
+
+  useEffect(() => {
+    fnRef.current = fn
+  }, [fn])
+
+  useEffect(() => {
+    shouldSkipRef.current = shouldSkip
+  }, [shouldSkip])
 
   return useCallback((...args: Args) => {
-    if (shouldSkip?.())
+    if (shouldSkipRef.current?.())
       return Promise.resolve(undefined as Result)
 
     const lastPromise = queueRef.current.catch(() => undefined)
-    const nextPromise = lastPromise.then(() => fn(...args))
+    const nextPromise = lastPromise.then(() => fnRef.current(...args))
     queueRef.current = nextPromise
 
     return nextPromise
-  }, [fn, shouldSkip])
+  }, [])
 }