{"id":18611568,"url":"https://github.com/robertdp/purescript-react-halo","last_synced_at":"2025-04-10T23:30:49.549Z","repository":{"id":47125757,"uuid":"305554855","full_name":"robertdp/purescript-react-halo","owner":"robertdp","description":"A Halogen-inspired interface for React. Use it as a hook in existing components, or use the provided helpers to make entire components using it.","archived":false,"fork":false,"pushed_at":"2022-11-17T03:12:15.000Z","size":203,"stargazers_count":27,"open_issues_count":0,"forks_count":2,"subscribers_count":4,"default_branch":"master","last_synced_at":"2023-03-06T18:16:41.416Z","etag":null,"topics":["async","halo","hook","react"],"latest_commit_sha":null,"homepage":"","language":"PureScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-3-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/robertdp.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-10-20T01:18:53.000Z","updated_at":"2022-11-21T23:24:13.000Z","dependencies_parsed_at":"2022-08-30T09:22:08.848Z","dependency_job_id":null,"html_url":"https://github.com/robertdp/purescript-react-halo","commit_stats":null,"previous_names":[],"tags_count":null,"template":null,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/robertdp%2Fpurescript-react-halo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/robertdp%2Fpurescript-react-halo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/robertdp%2Fpurescript-react-halo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/robertdp%2Fpurescript-react-halo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/robertdp","download_url":"https://codeload.github.com/robertdp/purescript-react-halo/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":223449748,"owners_count":17146984,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["async","halo","hook","react"],"created_at":"2024-11-07T03:14:13.741Z","updated_at":"2024-11-07T03:14:14.467Z","avatar_url":"https://github.com/robertdp.png","language":"PureScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Halo\n\nHalo is a [Halogen](https://github.com/purescript-halogen/purescript-halogen)-inspired interface for React.\n\nIt is available as a hook: `useHalo`; for building entire components there is `component`.\n\n## Documentation\n\nModule documentation is [published on Pursuit](http://pursuit.purescript.org/packages/purescript-react-halo).\n\n## Using with [Spago](https://github.com/purescript/spago)\n\n`$ spago install react-halo`\nor\n`$ npx spago install react-halo`\n\n## What does Halo provide?\n\nWhether you are using the hook or one of the component helpers, the main feature that Halo provides is the `eval` function. It looks like:\n\n```purescript\nLifecycle props action -\u003e HaloM props state action m Unit\n```\n\nwhere `Lifecycle` is:\n\n```purescript\ndata Lifecycle props action\n  = Initialize          -- when the component mounts\n  | Update props        -- when the props change, passing the previous props\n  | Action action       -- when an action is dispatched, passing the action\n  | Finalize            -- when the component unmounts\n```\n\nThe helper `mkEval` exists to make this easier to work with:\n\n```purescript\ndata Action\n  = LoadRemoteState\n  | PersistRemoteState\n  | ...\n\nhandleAction :: forall props state m. Action -\u003e HaloM props state Action m Unit\n\neval = Halo.mkEval Halo.defaultEval { initialize = Just LoadRemoteState, finalize = Just PersistRemoteState, handleAction = handleAction }\n```\n\n`HaloM` is also a monad transformer, and so you can lift any monad `m` logic into `HaloM`. Just be aware that in order to run the logic, Halo requires that you `hoist` (convert) your chosen monad into `Aff` before returning it.\n\n### Hoisting\n\n```purescript\nhoist :: forall props state action m m'. Functor m =\u003e (m ~\u003e m') -\u003e HaloM props state action m ~\u003e HaloM props state action m'\n```\n\nExample:\n\n```purescript\n-- Inverting a reader\nhoistReaderT ::\n  forall props state action env m.\n  HaloM props state action (ReaderT env m) ~\u003e\n  ReaderT env (HaloM props state action m)\nhoistReaderT x = do\n  env \u003c- ask\n  lift (Halo.hoist (flip runReaderT env) x)\n```\n\n### Working with props\n\n```purescript\nprops :: forall props action state m. HaloM props state action m props\n```\n\nExample:\n\n```purescript\nfireOnChange ::\n  forall props state action m a.\n  MonadEffect m =\u003e\n  HaloM { onChange :: a -\u003e Effect Unit | props } { value :: a | state } action m Unit\nfireOnChange = do\n  { onChange } \u003c- Halo.props\n  { value } \u003c- Halo.get\n  liftEffect (onChange value)\n```\n\n### Working with state\n\n`HaloM` doesn't have any special interface for reading and modifying state, instead providing an instance of [MonadState](https://pursuit.purescript.org/packages/purescript-transformers/docs/Control.Monad.State.Class) for flexibility.\n\n### Subscriptions\n\nSubscriptions registered using these functions are automatically tracked by Halo.\n\n```purescript\nsubscribe :: forall props state action m. Emitter action -\u003e HaloM props state action m SubscriptionId\n\nunsubscribe :: forall props state action m. SubscriptionId -\u003e HaloM props state action m Unit\n```\n\n`Emitter` is from the `purescript-halogen-subscriptions` library.\n\nThere is also a version for subscriptions that want to unsubscribe themselves:\n\n```purescript\nsubscribe' :: forall props state action m. (SubscriptionId -\u003e Emitter action) -\u003e HaloM props state action m SubscriptionId\n```\n\nAny subscriptions that remain when the component is unmounted are automatically unsubscribed. This prevents requiring manual clean up in the `Finalize` lifecycle event. Also note that new subscriptions will not be created once the `Finalize` event has been fired.\n\n### Forking\n\nAlso provided are functions for creating and killing forks which launch processes in separate \"threads\" (or as useful an approximation as we can get in JavaScript):\n\n```purescript\nfork :: forall props state action m. HaloM props state action m Unit -\u003e HaloM props state action m ForkId\n\nkill :: forall props state action m. ForkId -\u003e HaloM props state action m Unit\n```\n\nSimilarly to subscriptions, when the component unmounts all still-running forks will be killed. However new forks _can_ be created during the `Finalize` phase but there is no way of killing them (as with Halogen).\n\n### Parallelism\n\nFinally `HaloM` provides an instance of `Parallel` for converting back and forth between `HaloAp`, it's applicative counterpart. This allows any logic to be easily converted to run in `parallel` or `sequential`ly.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frobertdp%2Fpurescript-react-halo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frobertdp%2Fpurescript-react-halo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frobertdp%2Fpurescript-react-halo/lists"}