nilsmehlhorn/ngrx-wieder

Can I use PatchListener with Class?

moJiXiang opened this issue · 1 comments

Change state todos to an Class instance, then can't get undoredo stack from ngrx-wi`eder

// app.state.ts
export class Todos {
  list: Todo[] = [
    {id: id(), text: 'Travel', checked: true},
    {id: id(), text: 'Relax', checked: false},
    {id: id(), text: 'Work', checked: false}
  ]

  addTodo(id, text) {
    this.list.push(new Todo(id, text))
  }
}

export const initial: State = {
  todos: new Todos()
}

// app.reducer.ts
 case addTodo.type:
        // next.todos.push({id: id(), text: action.text, checked: false})
        next.todos.addTodo(id(), action.text)

I think immer just shallow copy the instance object, when I add new todo, actually change in the deep todos.list array. Do you have some idea ? Thank you.

Yes, by default immer will only do shallow copies for classes. You can mark your class as being compatible by using the special immerable symbol:

import {immerable} from "immer"

export class Todos {

  [immerable] = true

  list: Todo[] = [
    {id: id(), text: 'Travel', checked: true},
    {id: id(), text: 'Relax', checked: false},
    {id: id(), text: 'Work', checked: false}
  ]

  addTodo(id, text) {
    this.list.push(new Todo(id, text))
  }
}

By now there's also a page in their docs about that: https://immerjs.github.io/immer/docs/complex-objects