An async function was passed to useActionState, but it was dispatched outside of an action context. This is likely not what you intended. Either pass the dispatch function to an `action` prop, or dispatch manually inside `startTransition`

I have something like this:

const formRef = useRef<HTMLFormElement>(null)
const [state, formAction] = useActionState(myServerAction, null)
const [someBoolean, setSomeBoolean] = useState(false)
const handleToggle = async () => {
    const formData = new FormData(formRef.current!)
    formData.set("test", "test")
    setSomeBoolean(!someBoolean)
    formAction(formData)
}

<Switch
    id="test"
    name="test"
    checked={someBoolean}
    onCheckedChange={handleToggle} />

I'm not sure exactly what im doing wrong, would appreciate some assistance getting on the right track.

UPDATE: found the solution, i learned how to use startTransition:

startTransition(() => {
    formAction(formData)
})