Me explique as Actions do React 19 e como o useActionState se encaixa nisso.

Uma Action é uma função async que você entrega ao React, normalmente pela prop action de um form ou pelo startTransition. O React gerencia o estado de pendente, os erros e a ordenação em vez de você ligar flags booleanas na mão. O useActionState recebe uma action e um estado inicial e devolve o estado atual, uma action embrulhada para passar ao form, e uma flag isPending. O useFormStatus lê o estado de pendente a partir de um componente aninhado, e o useOptimistic renderiza o resultado esperado na hora.

Antes das Actions, toda mutação significava as mesmas quatro peças de estado: loading, erro, o resultado, e alguma coisa para impedir envio duplicado. As Actions dobram tudo isso dentro do React. Eu escrevo uma função async que faz o trabalho, entrego ela ao useActionState com um estado inicial, e recebo de volta o estado atual, uma action para colocar na prop action do form, e o isPending. O React roda ela dentro de uma transição, então a flag de pendente e a ordenação vêm de graça, e se dois envios correrem juntos, vence o resultado do mais recente e não o da chamada de rede que voltar por último. Para um botão de submit lá no fundo do formulário eu uso o useFormStatus, assim ele lê o pendente sem prop drilling. E para algo como uma caixa de comentários eu adiciono o useOptimistic para mostrar o comentário na hora, e se a action lançar erro, o React reverte o estado otimista para o estado real sozinho. A vitória prática é que um componente de formulário cai de umas setenta linhas para vinte e os casos de borda deixam de ser problema meu para lembrar.