0

I have a redux state that I need to update, it looks like this:

[
    {
        date: moment("2019-06-15").toObject(),
        attendance: [
            {
                name: "Ruben Hensen",
                membershipNumber: "2084700",
                attending: true,
                present: false
            },
            {
                name: "Peter Petersen",
                membershipNumber: "2084701",
                attending: true,
                present: false
            },
            {
                name: "Karel Kootjes",
                membershipNumber: "2084702",
                attending: true,
                present: false
            },
            {
                name: "Niedaar Mennekes",
                membershipNumber: "2084703",
                attending: true,
                present: false
            },
        ]

    },
...
...
...
]

My reducer tries to find the correct week so it can update it later but is unable to find the correct week inside the array.

TOGGLE_PRESENCE: (state, action) => {
        console.log(state);
        console.log(action);
        const index = state.findIndex(week => week.date === action.payload.date);
        console.log(index);

    }

The problem is that I use Redux Starter Kit and it uses Immer inside reducers. If I run my reducer this is the result of the console logs.

console.log results

It's not able to find the correct week. Any tips or pointers would be appreciated. I don't really understand Immer or the Proxy objects it uses.

Edit: @markerikson solved the problem. I changed this:

const index = state.findIndex(week => week.date === action.payload.date);

to this:

const index = state.findIndex(week =>moment(week.date).isSame(action.payload.date));

And now it finds the correct index. Solution results

Ruben Hensen
  • 796
  • 1
  • 9
  • 24
  • 1
    are you trying to compare dates? `toObject` would be an object, not a date you can compare right? as in you are accessing `action.payload.date` which is an object because thats what the key is called for the `moment.toObject`. So wouldn't it be `action.payload.date.date`? – John Ruddell Jun 28 '19 at 17:25
  • I'll try, but the date that it's comparing to is also from the state. So they should both be date objects. I'll report back once I tried it out. – Ruben Hensen Jun 28 '19 at 20:47
  • 1
    an `==` comparison on an object doesn't compare the keys of the objects. It compares the objects location in memory. aka `{'a': 'b'} == {'a': 'b'}` is false. – John Ruddell Jun 28 '19 at 21:05

1 Answers1

2

The moment instances are not going to be === equal to each other. You probably need to use Moment's APIs for comparing them, like:

const index = state.findIndex(week => week.date.isSame(action.payload.date));

Note that this part doesn't have anything to do with Immer or Redux Starter Kit specifically - it's that different object instances are going to have different references.

markerikson
  • 63,178
  • 10
  • 141
  • 157