agile-ts / agile

🌌 Global State and Logic Library for JavaScript/Typescript applications
https://agile-ts.org
MIT License
95 stars 8 forks source link

watchable computed states #221

Open leopf opened 2 years ago

leopf commented 2 years ago

🆕 Feature Request

Make computed states watchable.

❓ Is your feature request related to a problem?

It would be nice to react to changes on computed states.

📄 Describe the solution you'd like

Move the watch and removeWatcher methods from EnhancedState class to the State class. Additionally it would be nice to have a Watchable interface which is implemented on State. Since this proposed change won't make Collections watchable, by implementing the Watchable interface on the Collection class you could make it watchable with a few changes in the future.

The watchable interface would be used where only the watch and removeWatcher methods are used. For example the useWatcher react hook.

📃 Describe alternatives you've considered

Alternatively the Watchable interface is not required, would just be nice to have.

➕ Additional Notes

I have the changes implemented in a fork already. If this feature request is accepted, I would follow up with a PR.

bennobuilder commented 2 years ago

Thanks for the feature request ;D

In the past, there was only the normal State with the features of the EnhancedState. However, some people wanted a more lightweight solution so I outsourced 'not' necessary features into the EnhancedState due to the fact that classes can't be tree shaken.

The most weight of the enhanced State accounts for the persist logic:

STATE.persist();

As classes can't be tree shaken, you would load all the persist logic, although you might not need the persist feature. The only way to fix that issue is to make everything more functional. -> Then, to persist the State, you would write something similar to this:

persistState(STATE);

Thus, all the unnecessary functions can be tree shaken.

I've planned to rethink all the size (tree shake) problems in about 3 months as I'm currently busy with school stuff :/

I really appreciate your thoughts, and I am very glad that you want to use AgileTs. About 5 months ago, I stopped working on AgileTs as nobody seemed to need it (So I thought the wrong project at the wrong time), but since you want to use it, I've got a reason to keep working on it. Thanks a lot ;D

As I've already mentioned, I'm shortly before my final exams and can't spend so much time on open source work, but after that, I'll actively improve AgileTs ;D

A quick fix for your problem is to create a watcher callback via the sideEffect() method.

 STATE.addSideEffect(
      'watcher',
      (state) => {
         const value = state.value;

         // Your watcher logic
      },
      { weight: 0 }
    );
leopf commented 2 years ago

Thanks for the quick response.

Making everything more functional seems to be the way to go.

I'm currently planning to migrate a project to agile. For now the current state management solution of this project will do fine. You should definitely focus on school for now.

I will keep testing possible applications of agile in my project and keep making Issues for possible improvements. These will also be focused on making this projects' logic more functional. Once you have the time to keep working on this project, you can evaluate my suggestions. So I hope you don't feel stressed by my suggestions, or feel like you have to spend your limited time on my issues :wink:.