Instead of dealing with ( model, Cmd msg )
we get a more robust type
that allows us to deal with other styles of effects.
{ init : Context flags -> Tea flags model msg effect
, subscriptions : Context flags -> model -> Platform.Sub.Sub msg
, update : Context flags -> msg -> model -> Tea flags model msg effect
, urlChanged : Context flags -> model -> Tea flags model msg effect
, view : Context flags -> model -> Html msg
}
A little more than a Browser.element
but less than a Browser.application
Branch flags (Maybe model) msg effect
A little more than a Browser.element
but less than a Browser.application
, and can handle URLs
Just a wrapper for effectful things
toApplication : { decodeFlags : encodedFlags -> flags, root : Branch flags model msg effect, rootEffect : effect -> model -> ( model, Platform.Cmd.Cmd msg ) } -> { init : encodedFlags -> Url -> Browser.Navigation.Key -> ( Model model flags, Platform.Cmd.Cmd (Msg msg) ), subscriptions : Model model flags -> Platform.Sub.Sub (Msg msg), update : Msg msg -> Model model flags -> ( Model model flags, Platform.Cmd.Cmd (Msg msg) ), view : Model model flags -> Browser.Document (Msg msg), onUrlRequest : Browser.UrlRequest -> Msg msg, onUrlChange : Url -> Msg msg }
Converting your Tea app into a Browser.application
.
route : { pathHandler : List String -> PathHandler args, init : args -> Context flags -> Tea flags model msg effect, subscriptions : Context flags -> model -> Platform.Sub.Sub msg, update : Context flags -> msg -> model -> Tea flags model msg effect, urlChanged : args -> Context flags -> model -> Tea flags model msg effect, view : Context flags -> model -> Html msg } -> Route flags model msg effect
Create a branch of your Tea app that can handle URLs
Whether you want to match on the current, relative path or not.
If you match, you specify how much of the path to match on (this will be consumed and unavailable in the Context
),
as well as an additional args you may extract from the URL.
For storing things like the logged in User, current theme, etc.
The overall model of your Tea app
The root msg of your Tea app
Maybe model
Helpful alias for working with routes
absolutePath : Context flags -> List String
Get the full URL path
relativePath : Context flags -> List String
Get the portion of the URL path that is available to this branch, i.e. hasn't been consumed by parent components
consumePath : List String -> Context flags -> Context flags
Used when you want to consume a portion of the URL path before passing Context
on to a child.
This will likely go away in the future, but can be useful now for consuming dynamic paths.
flags : Context flags -> flags
Get the flags out of the context
save : model -> Tea flags model msg effect
Save the state of your model
withCmd : Platform.Cmd.Cmd msg -> Tea flags model msg effect -> Tea flags model msg effect
Add a Cmd to your Tea
withMsg : msg -> Tea flags model msg effect -> Tea flags model msg effect
Add a Msg to your Tea, to be handled in a future update
withEffect : effect -> Tea flags model msg effect -> Tea flags model msg effect
Add an effect to your Tea, to be handled by the parent component
mapModel : (model1 -> model2) -> Tea flags model1 msg effect -> Tea flags model2 msg effect
Map over the model of your Tea
mapMsg : (msg1 -> msg2) -> Tea flags model msg1 effect -> Tea flags model msg2 effect
Map over the msg of your Tea
andThen : (model1 -> Tea flags model2 msg effects) -> Tea flags model1 msg effects -> Tea flags model2 msg effects
Go from one Tea to another, with access to the model of the first
applyEffects : (childEffect -> Tea flags model msg parentEffect -> Tea flags model msg parentEffect) -> Tea flags model msg childEffect -> Tea flags model msg parentEffect
Convert the effects of a child into something concrete, or maybe wrap them in your own effect to pass further upwards
extractModel : Tea flags model msg effect -> ( model, Effects msg effect )
Useful for when you have multiple child components
withChildEffects : (childMsg -> parentMsg) -> (childEffect -> Tea flags model parentMsg parentEffect -> Tea flags model parentMsg parentEffect) -> Effects childMsg childEffect -> Tea flags model parentMsg parentEffect -> Tea flags model parentMsg parentEffect
The pairing helper for extractModel
setFlags : flags -> Tea flags model msg effect -> Tea flags model msg effect
Used to update the flags in your Tea
navigate : String -> Tea flags model msg effect -> Tea flags model msg effect
For manual, non-link based navigation