Redux Saga

O Redux Saga é uma biblioteca de middleware que visa tornar os efeitos colaterais da aplicação (como chamadas assíncronas, acesso ao cache, etc) mais fáceis de gerenciar, mais eficientes de executar e simples de testar.

---

O que são Sagas?

Diferente do Redux Thunk, que usa Promises, o Saga utiliza Generator Functions (function*). Isso permite pausar e retomar a execução da lógica assíncrona de forma muito controlada.

---

Quando usar?

1. Processos Globais e Complexos: Lógicas que dependem de múltiplas etapas, como um fluxo de autenticação (Login -> Buscar Perfil -> Configurar Token -> Navegar).
2. Sincronização de Side-effects: Quando uma ação no sistema precisa disparar várias outras ações em cadeia.
3. Lógica fora da UI: Manter a lógica de infraestrutura (como expiração de tokens) totalmente separada dos componentes.

Exemplo de Uso:

import { call, put, takeEvery } from 'redux-saga/effects';

function* fetchUserSaga(action) {
  try {
    const user = yield call(api.getUser, action.payload.id);
    // Dispara uma nova ação com o resultado
    yield put({ type: 'USER_FETCH_SUCCEEDED', user });
  } catch (e) {
    yield put({ type: 'USER_FETCH_FAILED', message: e.message });
  }
}

// "Escuta" todas as ações do tipo USER_FETCH_REQUESTED
function* mySaga() {
  yield takeEvery('USER_FETCH_REQUESTED', fetchUserSaga);
}

---

Quando NÃO usar?

1. Busca simples de dados para uma tela: Para CRUD básico, o TanStack Query é muito mais eficiente e requer menos boilerplate.
2. Estado local de componente: Se a lógica afeta apenas um componente, use o estado local ou Hooks.

---

Conceitos Chave (Effects)

• call: Executa uma função assíncrona.
• put: Dispara uma ação para o Redux (equivalente ao dispatch).
• takeEvery: Executa a saga para cada ação disparada.
• takeLatest: Se uma nova ação for disparada enquanto a anterior ainda está rodando, ela cancela a anterior e foca na última (ótimo para buscas).