Fork me on GitHub
#re-frame
<
2016-07-07
>
lwhorton11:07:41

does anyone have a good strategy for showing a temporary event message? i.e. user clicks “save” — show it for a few seconds then make it go away.

lwhorton11:07:09

the easiest is probably a settimeout and dispatch again shortly thereafter, but this seems icky, and probably better done through middleware

mikethompson13:07:12

@lwhorton: re-frame is event based. Very dispatch oriented. The app doesn't move forward unless an event happens. So the original putting up of the message will happen because of a dispatch and the taking down of the message should also happen because of a dispatch. So, in the handler which puts the message "up", also organize to take it down via something like (js/setTimeout #(dispatch [:take-it-down]) 2000)

mikethompson13:07:26

Can't see much way around it

mikethompson13:07:03

With the new Effectful event handlers it will becomes a bit cleaner

mikethompson13:07:20

But it will be the same general principle

mikethompson13:07:56

-------------- Alternatively, could CSS help here?

mikethompson13:07:26

Show the message, but give it the necessary CSS so that animates to invisible/transparent after 2 seconds.

mikethompson13:07:52

That way you never have to take the message down.

lwhorton16:07:57

I considered that, too.. and also a react transition group - but i dont quite yet want to get into trying to animate things in reframe.

lwhorton16:07:39

I ended up with a custom middleware (cause i sense this is going to happen often) that takes care of the set-timeout removal so my handlers are cleaner.

dobladez17:07:22

@lwhorton: IMHO: that's not "application state", it's just "ephemeral" state not worth keeping on your app-db. I'd probably use setTimeout to change a simple local ratom (all local to your component)

dobladez17:07:37

@lwhorton: I'm just starting to use re-frame, so don't trust my judgement too much

richiardiandrea22:07:46

can't wait for effectful handlers, my idea was to implement them exactly with a timeout that executes the "registered" functions for effectful events

richiardiandrea22:07:18

and dispatches the effectful function's generated events