Glo Academy

⚡ Один хук заменяет три useState в форме Знакомый набор: состояние под ответ сервера, под ошибку, под «сейчас отправляется» — плюс try/catch/finally, где забываешь снять флаг и кнопка остаётся серой навсегда.

async function subscribe(prevState, formData) {
  const email = formData.get('email');
  if (!email.includes('@')) return { message: 'Проверь почту' };

  await api.subscribe(email);
  return { message: 'Готово' };
}

const [state, formAction, isPending] = useActionState(subscribe, {});

<form action={formAction}>
  <input name="email" />
  <button disabled={isPending}>Подписаться</button>
</form>

useActionState убирает обвязку. Функции приходит formData, она возвращает новое состояние, а isPending React считает сам — это настоящий статус запроса, не флаг на глазок На всякий случай: если бросишь исключение вместо возврата состояния — React отменит очередь вызовов и уронит ближайший Error Boundary. Лови ошибку внутри действия, возвращай её состоянием 🔥 — если полезно @glo_academy | #js_day