Using `takeLatest` to Prevent Unnecessary API Calls

Provide an example of using the `takeLatest` effect in Redux-Saga for making API calls where only the result of the last call is of interest, thus cancelling any previous unfinished calls to optimize performance.
import { takeLatest, call, put } from 'redux-saga/effects';
Import necessary effects from Redux-Saga.
import { fetchDataApi } from './api';
Import the API call function.
function* fetchData(action) { try { const data = yield call(fetchDataApi, action.payload); yield put({type: 'FETCH_SUCCESS', data}); } catch (error) { yield put({type: 'FETCH_FAILURE', error}); } }
Define the fetchData generator function which makes an API call and handles success or failure.
function* watchFetchData() { yield takeLatest('FETCH_REQUEST', fetchData); }
Use takeLatest to automatically cancel any previous saga started if it's still running when a new FETCH_REQUEST action is dispatched.
export default watchFetchData;
Export the saga watcher.