hey, just confused about the Boilerplate Code of Doc

[Torres7707]

Hello,

I just read the Update Externally chapter of the doc, and I have a question about the Boilerplate Code:

as you can see from the screenshot, I am a little confused about the get counter(), cause you did not pass any Parameter to it, but when you use it inside of the increment func, you pass a Callback _ => { _.count++ }. This makes me confused.

I hope that you'll be able to help me figure it out.
thanks!

[NoMoreDeps]

HI,

In fact updateCounter will return a method, that can be used in several ways :

const update = updateCounter();

// Then you can update the state from inside the method by using a handler

// apply all pending modification to the ripple
// updateCounter(handler: (ripple) => void ) => void
updateCounter(ripple => {
  ripple.count++;
});

// cancel pending modifications
// update(handler: (ripple) => "restore") => void
update(ripple => "restore");

// reset the ripple to its initial state
// update(handler: (ripple) => "reset") => void
update(ripple => "reset");

// replace the ripple with a new value. Does not replace the initial state
// update(handler: (ripple) => typeof ripple) => void
update(ripple => {
  return {
    count: 0,
  };
});

So when the code do a this.counter it returns the method that can be used to update.
Why it use a method to get the method ?

Just because it create at the same time a proxy state dedicated to this call.
Without this, it may modify a shared state if you import twice into 2 components that try a update at the same time.

I will update the documentation to rename maybe variables to make it less confusing.
Thanks for the feedback, you are right it is ambigous.

To make it easier in the TodoService exemple I directly propose to get it that way :

class TodoService {
  constructor(protected update = updateTasks()) { }
  ...
}