This hook's goal is to let the latest state is visible to the sync callback in a function.

Sample

function TextComponent() {
    const [state1, setState1] = useState(0);
    const [state2, setState2] = useState(0);
 
    const fun = useTask({
    	state1,
    }, (that, x) => {
        setTimeout(() => {
            // that.state will be the latest value, but no the old one when fun be invoked.
            setState2(x + that.state1);
        }, 2000);
    });
    
    return <div>
        state1: {state1}, state1 + 10 = {state2}
        <br/>
        <button onClick={() => fun(10)}>update state2</button>
        <button onClick={() => setState1(x => x + 1)}>update state1</button>
    </div>
}