From 32f72199679a3bdd247270d2b3d0e20df5882d73 Mon Sep 17 00:00:00 2001
From: David Walsh <dlwalsh@gmail.com>
Date: Tue, 10 Mar 2020 11:39:23 +1100
Subject: [PATCH] Fix bug in docs for createAsyncThunk example

fetchUserById payloadCreator should fetch when in pending (not idle) state
---
 docs/api/createAsyncThunk.md | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/docs/api/createAsyncThunk.md b/docs/api/createAsyncThunk.md
index 3110795cae..9e6c7a2cea 100644
--- a/docs/api/createAsyncThunk.md
+++ b/docs/api/createAsyncThunk.md
@@ -325,9 +325,9 @@ import { userAPI } from './userAPI'
 
 const fetchUserById = createAsyncThunk(
   'users/fetchByIdStatus',
-  async (userId, { getState }) => {
-    const { loading } = getState().users
-    if (loading !== 'idle') {
+  async (userId, { getState, requestId }) => {
+    const { currentRequestId, loading } = getState().users
+    if (loading !== 'pending' || requestId !== currentRequestId) {
       return
     }
     const response = await userAPI.fetchById(userId)
@@ -340,6 +340,7 @@ const usersSlice = createSlice({
   initialState: {
     entities: [],
     loading: 'idle',
+    currentRequestId: undefined,
     error: null
   },
   reducers: {},
@@ -347,18 +348,23 @@ const usersSlice = createSlice({
     [fetchUserById.pending]: (state, action) => {
       if (state.loading === 'idle') {
         state.loading = 'pending'
+        state.currentRequestId = action.meta.requestId
       }
     },
     [fetchUserById.fulfilled]: (state, action) => {
-      if (state.loading === 'pending') {
+      const { requestId } = action.meta
+      if (state.loading === 'pending' && state.currentRequestId === requestId) {
         state.loading = 'idle'
-        state.push(action.payload)
+        state.entities.push(action.payload)
+        state.currentRequestId = undefined
       }
     },
     [fetchUserById.rejected]: (state, action) => {
-      if (state.loading === 'pending') {
+      const { requestId } = action.meta
+      if (state.loading === 'pending' && state.currentRequestId === requestId) {
         state.loading = 'idle'
         state.error = action.error
+        state.currentRequestId = undefined
       }
     }
   }