Hooks and Redux Saga : <p>I am learning redux hooks and wondering how to use it along with redux saga.</p>

<p>Currently the code written in saga is as follows.</p>

<blockquote>
  <p>centers.js</p>
</blockquote>

<pre><code>componentDidMount() {
    this.props.getCenters();
  }

...

&lt;tbody&gt;
                            {
                              this.props.centers ?
                                &lt;React.Fragment&gt;
                                  {
                                    centers.map((center, index) =&gt;
                                      &lt;tr key={index}&gt;
                                        &lt;td&gt;{center.name}&lt;/td&gt;
                                        &lt;td&gt;{center.zip}&lt;/td&gt;
                                      &lt;/tr&gt;
                                    )
                                  }
                                &lt;/React.Fragment&gt;
                              :
                                &lt;tr&gt;
                                  &lt;td&gt; No data available&lt;/td&gt;
                                &lt;/tr&gt;

                            }
                          &lt;/tbody&gt;
</code></pre>

<p>The actions file is defined as follows.</p>

<pre><code>export const getCenters = () =&gt; ({
  type: types.CENTERS_REQUEST,
});
</code></pre>

<p>The saga file is defined as follows.</p>

<pre><code>import { DEFAULT_ERROR_MSG } from '../../constants';
import { instance as centerProvider } from '../services/centerProvider';

function* fetchCenters() {
  try {
    const response = yield call(centerProvider.getCenters);
    const centers = response.data.data.centers;

    // dispatch a success action to the store
    yield put({ type: types.CENTERS_SUCCESS, centers});

  } catch (error) {
    // dispatch a failure action to the store with the error
    yield put(DEFAULT_ERROR_MSG);
  }
}

export function* watchCenterRequest() {
  yield takeLatest(types.CENTERS_REQUEST, fetchCenters);
}

export default function* centerSaga() {
  yield all([
    watchCenterRequest()
  ]);
}
</code></pre>

<p>So the question is,</p>

<ul>
<li>Do we still need redux if we use hooks?</li>
<li>How can we rewrite the above code using hooks?</li>
</ul>
