ionic-team / stencil-redux

MIT License
97 stars 20 forks source link

Discussion on Stencil-Redux future implementation #71

Open stanley85 opened 4 years ago

stanley85 commented 4 years ago

For the future of stencil-redux, I suggest to Impement a Decorator named Store, this should only be an adapter. Stencil-redux would use this adapter.

Would be awesome to have a syntax like this as soon as redux is available to a stencil project.

@Store({ name: 'default', action: this.documentChange, type: 'redux' }) document: any = {};

Each member decorated with @Store shares the same store. Action is associated with the redux action. @Store Decorator would inherit behaviour from @State. Name could be the name of the reducer.

Having the type as an optional parameter (default = 'redux') could allow to further define custom stores. Maybe a dynamic store for firebase could allow for a simple change like eg.

@Store({ name: 'default', action: this.documentChange, type: 'firestore' }) document: any = {};

Name could be the name of the database document.

Originally posted by @stanley85 in https://github.com/ionic-team/stencil-redux/pull/70#issuecomment-555411123

turtledev1 commented 4 years ago

Hmm I'm not really sure about the action and reducer parameters, or maybe I'm missing something. Components accessing the store should only call dispatch on it. If you want a part of the state, you should use selectors.

So maybe something like:

import { MyStore } from './store';
import { inventorySelector } from './store/inventory.selector';
// ...

// ...
@Store() store: MyStore;
@State() inventory$: Observable<Inventory> = inventorySelector.getInventory();

componentDidLoad() {
    this.store.dispatch({ type: 'IM_READY' });
}
// ...
stanley85 commented 4 years ago

Hmm I'm not really sure about the action and reducer parameters, or maybe I'm missing something.

This is a wish-post, stencil-redux is no longer working on Stencil 1.8 I thought it would be a good time to suggest future implementation. @Store should be an adapter interface, so redux could use it and one using firebase could implement his own @Store adapter.

In my head it makes sense to inherit or copy behaviour from @State since any change on the value should trigger redraw. Additonally to this behaviour the new value would be stored within redux or any other adapter implementation. I want this adapter to expose the lifecycle of a @State member. So any Change (only on this member) could be detected and the corresponding Action is called.

manucorporat commented 4 years ago

It's unlikely we will add a new decorator to stencil/core, https://github.com/manucorporat/stencil-store stencil/store is an experiment to solve the global state re-rendering problem, and we expect it to be the foundation level for redux, any kind of global state system, dynamic i8n...

stanley85 commented 4 years ago

This looks very promising.