Fork me on GitHub
#re-frame
<
2021-03-12
>
defa08:03:20

Hi, I’m struggling with events. I have a working solution but it doesn’t feel like “the right thing to do”. I have a long running (5-30 sec.) calculation in a coeffect injected into an effect that will write changes to the app-db. I’d like to open a progress indicator (modal dialog) while the calculation is running and I already have events for showing/hiding this indicator. As I understand, there is no way to dispatch these events in order: [:show-progress-indicator] [:perform-calculation] [:hide-progress-indicator] . My working solution is to use :dispatch-later for the first two events to order them and give the run-loop/react time to show the modal and pass the hide-event as an argument to the calculation-event so it can be dispatched when the calculation is done:

{:fx [[:dispatch-later {:ms 1 :dispatch [:show-progress-indicator]}]
        [:dispatch-later {:ms 500 :dispatch [:perform-calculation [:hide-progress-indicator]]}]]}
But this does look like an aweful hack and I think I’m missing something here. A less complicated solution is to not dispatch :hide/show-progress-indicator and modify the hide/show-flag in app-db directly in :perform-calculation.

p-himik10:03:13

> there is no way to dispatch these events in order There is. You just call dispatch in the right order, that's it. The order is preserved.

p-himik10:03:22

The reason for why your progress indicator might not be showing up is because re-frame doesn't give Reagent a chance to re-render the right parts. This documentation section is helpful in that regard: https://day8.github.io/re-frame/Solve-the-CPU-hog-problem/#forcing-a-one-off-render

defa15:03:39

@U2FRKM4TW of course you’re right these events are dispatched, as it is written in the docs. I was a bit sloppy in formulating my problem. It is not a order problem at all but exactly that what is described in the link you sent. Thanks! I guess I’ll have to try ^:flush-dom and get rid of :dispatch-later stuff.

👍 3
David Pham17:03:43

Is it possible to listen to events? As, throw events after some events have been seen? I think async-flow might be a good solution, but I wondered if there was an alternative?

p-himik17:03:17

I don't remember reading about such an alternative. Unless you know you event dependency graph in advance - then perhaps https://github.com/ingesolvoll/re-chain can be helpful.

p-himik17:03:49

Oh, nice, thanks!

David Pham09:03:58

That function is quite handy :)

David Pham09:03:02

Thanks a lot!!

oliy16:03:48

I also wrote alrightee for this: https://github.com/oliyh/alrightee

lucian30321:03:04

i got an error like this and other similar ones. how do i know which effect it's talking about? i looked in the structure it dumps out, but it is of no help. i can't correlate it back to anything in cljs: re-frame: in ":fx" effect found {meta: null, cnt: 2, shift: 5, root: {…}, tail: Array(2), …}cljs$lang$protocol_mask$partition0$: 167666463cljs$lang$protocol_mask$partition1$: 139268cnt: 2meta: nullroot: {edit: null, arr: Array(32)}shift: 5tail: (2) [{…}, {…}]__hash: 773031096__proto__: Object which has no associated handler. Ignoring.

p-himik21:03:59

I strongly suggest using Chromium-like browser along with https://github.com/binaryage/cljs-devtools used in your CLJS build. It will make printed CLJS objects readable.

p-himik21:03:38

When you see stuff like {meta: ..., root: ..., tail: ...}, it's almost certainly a CLJS collection printed as a JS object.

lucian30321:03:56

ah, gotcha. thanks. that was not working before but it finally is working now and it makes sense