title: Redux filter array, UI doesn't update
body: <p>Using redux filter to remove an item yet it's removing from the DB but the UI isn't updating, not sure if i'm missing something stupid or being dumb.</p>
  <p>The expected functionality would be that it removes the item from the database and UI would update</p>
  <p>If i manually refresh the page, it's as it should be.</p>
  <p>This is inside my goalService</p>
  <pre><code>const deleteGoal = async (goalId, token) =&gt; {
    const config = {
      headers: {
        Authorization: `Bearer ${token}`,
      },
    };
  
    const response = await axios.delete(API_URL + goalId, config);
  
    return response.data;
  };
  </code></pre>
  <p>inside goalSlice</p>
  <pre><code>export const deleteGoal = createAsyncThunk(
    &quot;goals/delete&quot;,
    async (id, thunkAPI) =&gt; {
      try {
        const token = thunkAPI.getState().auth.user.token;
        return await goalService.deleteGoal(id, token);
      } catch (error) {
        const message =
          (error.response &amp;&amp;
            error.response.data &amp;&amp;
            error.response.data.message) ||
          error.message ||
          error.toString();
        return thunkAPI.rejectWithValue(message);
      }
    }
  );
  </code></pre>
  <pre><code>export const goalSlice = createSlice({
    name: &quot;goal&quot;,
    initialState,
    reducers: {
      reset: (state) =&gt; initialState,
    },
    extraReducers: (builder) =&gt; {
      builder
        .addCase(deleteGoal.pending, (state) =&gt; {
          state.isLoading = true;
        })
        .addCase(deleteGoal.fulfilled, (state, action) =&gt; {
          state.isLoading = false;
          state.isSuccess = true;
          state.goals = state.goals.filter(
            (goal) =&gt; goal._id !== action.payload.id
          );
        })
        .addCase(deleteGoal.rejected, (state, action) =&gt; {
          state.isLoading = false;
          state.isError = true;
          state.message = action.payload;
        });
    },
  });
  </code></pre>
  <p>Edit 1:</p>
  <pre><code>goals: {
      goals: [
        {
          user: '624dfed264387649da83d8db',
          text: 'dylanjcain',
          _id: '624f53d6fd65e29ed17506e3',
          createdAt: '2022-04-07T21:12:54.748Z',
          updatedAt: '2022-04-07T21:12:54.748Z',
          __v: 0
        }
      ],
      isError: false,
      isSuccess: true,
      isLoading: false,
      message: ''
    }
  </code></pre>
  <p>Response from API</p>
  <pre><code>{
      &quot;_id&quot;: &quot;624f554afd65e29ed17506e6&quot;,
      &quot;user&quot;: &quot;624dfed264387649da83d8db&quot;,
      &quot;text&quot;: &quot;test123&quot;,
      &quot;createdAt&quot;: &quot;2022-04-07T21:19:06.435Z&quot;,
      &quot;updatedAt&quot;: &quot;2022-04-07T21:19:06.435Z&quot;,
      &quot;__v&quot;: 0
  }
  </code></pre>