Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add higher-order component for connecting to global state #45

Merged
merged 6 commits into from Sep 23, 2019

Conversation

thomashoneyman
Copy link
Owner

Rationale

Conduit has a global state which contains the currently logged in user via a mutable reference. That information is in global state because several components (the router, the home page, and the editor) need to know about the current user in order to function correctly. Those components need to take several actions to properly hook up to the global state:

  1. On initialization, they must fetch the value of the current user from global state, and also fetch a reference to the bus which pushes updates out when that value changes
  2. They must provide an action, typically HandleUserBus, which updates their state when the value of the current user changes
  3. They must, on initialization, use the action to subscribe to updates in the value of the current user

This is all a bit tedious and largely irrelevant to the components other than having an always up-to-date reference to the current user. Ideally, we could just have that reference and not worry about the mechanics of getting it and updating it.

This PR introduces a new higher-order component, Connect.component, which takes care of all of this behind the scenes. With this change, components can remove all the steps I described.

Instead, they now have currentUser :: Maybe Profile inserted into their input type and can use the ordinary receive function from Halogen to update their state when this value changes. Parent components can use the child components as usual, without even knowing that the higher order component is in place. As far as the parent is concerned the component has its old input; as far as the child is concerned, its input has currentUser inserted. Querying, messages, and so on all behave as usual.

Other notes

This module could use some extra explanatory comments about higher-order components in Halogen, but I'm wary of stuffing it full of information not relevant for folks already versed in Halogen and who have used higher order components before.

This build has not been tested locally yet and will require that before merging.

@thomashoneyman thomashoneyman self-assigned this Sep 17, 2019
@thomashoneyman thomashoneyman merged commit 4581af1 into master Sep 23, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants