JS. Сортировка работает с первого раза, но не после

Question

Ниже приведен мой код редуктора Redux. Он содержит тестовые данные initialState, состоящие из массива объектов, отсортированных по алфавиту. Когда я запускаю приложение React, эти тестовые данные initialState сортируются правильно.

Однако, когда я вызываю метод addOnLineUser редуктора, новый пользователь добавляется в конец массива ... но метод .sort не сортирует массив .

В попытке выяснить, что происходит, я удалил метод .sort из данных initialState. При запуске приложения, как и ожидалось, данные не сортируются. Теперь, когда я вызываю метод addOnLineUser редуктора, добавляется новый пользователь, и массив сортируется правильно!

Продолжая, я вызываю метод deleteOnLineUser редуктора, и, как и ожидалось, пользователь удаляется из массива. Когда я вызываю метод addOnLineUser редуктора второй раз, пользователь добавляется, но массив снова не сортируется.

Я использую «реагировать»: «^ 16.8.6», «избыточность»: «^ 4.0.1 "," Reaction-redux ":" ^ 5.1.1 "

Любые предложения о том, почему метод .sort работает один раз, но не во второй раз, будут высоко оценены.

import { createReducer } from '../../../app/common/utils/reducerUtils';
import { ADD_ONLINE_USER, DELETE_ONLINE_USER } from './usersOnLinConstants';

const initialState = [
    {
        displayName: 'John',
        sortKey: 'john',
        id: 'asdfgh',
        photoURL: 'https://randomuser.me/api/portraits/men/20.jpg'
    },
    {
        displayName: 'Jane',
        sortKey: 'jane',
        id: 'dfghjk',
        photoURL: 'https://randomuser.me/api/portraits/women/20.jpg'
    },
    {
        displayName: 'Nancy',
        sortKey: 'nancy',
        id: 'fghjkl',
        photoURL: 'https://randomuser.me/api/portraits/women/21.jpg'
    },
    {
        displayName: 'Sam',
        sortKey: 'sam',`enter code here`
        id: 'ghjklq',
        photoURL: 'https://randomuser.me/api/portraits/men/22.jpg'
    },
    {
        displayName: 'Susan',
        id: 'o4X6CUq62KfirJEh5zFdTcG0Ve92',
        photoURL: 'https://randomuser.me/api/portraits/women/22.jpg'
    },
    {
        displayName: 'Bill',
        sortKey: 'bill',
        id: 'sdfghj',
        photoURL: 'https://randomuser.me/api/portraits/men/21.jpg'
    }
].sort((a, b) => (a.sortKey < b.sortKey ? -1 : a.sortKey > b.sortKey ? 1 : 0));

const addOnLineUser = (state, payload) => {
    const newState = [...state, payload.user];
    newState.sort((a, b) =>
        a.sortKey < b.sortKey ? -1 : a.sortKey > b.sortKey ? 1 : 0
    );
    return newState;
};

const deleteOnLineUser = (state, payload) => {
    const newState = state.filter(e => e.id !== payload.user.id);
    return newState;
};

export default createReducer(initialState, {
    [ADD_ONLINE_USER]: addOnLineUser,
    [DELETE_ONLINE_USER]: deleteOnLineUser
});