fluxible
fluxible copied to clipboard
feat: draft implementation of useStore in #733 (not production ready)
Co-authored-by: pablopalacios [email protected]
I confirm that this contribution is made under the terms of the license found in the root directory of this repository's source tree and that I have the authority necessary to make this contribution on behalf of its copyright owner.
Cool, let's go step by step. Important tests that we should have:
- It registers/unregsiters to the given store
- It updates when the store is updated
You can take a look at connectToStores
tests as reference. As I mentioned in the issue, one thing that I'm concerned is the unregister
part. We must make sure that when the component unmounts, we are removing the listener, otherwise we will have a memory leak.
@billyrrr @pablopalacios Still interested in this feature?
@redonkulus I do. At work we are using 2 custom hooks for stores: useStore
and useStoreSubscription
. The difference is that the later one subscribes to changes for the given store while the first not. We normally use the first when we are sure that the data is static (normally server side data). If this difference is not confusing you, I would propose to include both of them in the API (or, if you have a better idea...).
This is an example on how we use it:
function MyComponent() {
const { locale } = useStore(AppStore).getState();
const { count } = useStoreSubscription(CountStore).getState();
return <span>Count: {new Intl.NumberFormat(locale).format(count)}</span>;
}
We have been using these hooks in production successfully since probably the time this PR was created. @billyrrr do you still have interested in moving the PR forward, otherwise I can prepare another one.
Yep, I can continue to work on this issue.