Fork me on GitHub
#reagent
<
2016-12-30
>
pesterhazy16:12:09

New blog post on Reagent and the reloading workflow: http://presumably.de/reagent-2.html

metametadata16:12:27

Has anyone used Reagent with cljsjs/react-bootstrap? I can't get controlled FormControl inputs work without cursor jumps :white_frowning_face:

pesterhazy16:12:18

yeah that's a common problem

pesterhazy16:12:50

you could try wrapping the component in something with component-local state

pesterhazy16:12:02

that sort of syncs with your state atom?

metametadata16:12:02

Thank you for the tip! I guess in the worst case I'll just use Reagent's input with Bootstrap CSS classes

pesterhazy16:12:51

yeah, just plain [:input] works

pesterhazy16:12:10

I'd be curious how a simple r/state based wrapper could work

metametadata16:12:18

I'll look into this

johanatan21:12:31

Hi, is there a way to extract the path for a reagent/cursor back out of it?

gadfly36121:12:14

@johanatan I am not aware of any straighforward way to get the path back out of it. However, I believe you can define your own set-get function for a cursor ... and maybe you could add a print side-effect or something. https://github.com/reagent-project/reagent/blob/master/src/reagent/core.cljs#L280-L282

johanatan21:12:03

Yea, that was my conclusion as well (after reading the deprecated reagent-cursor (which I think is the same src in reagent itself now).

johanatan21:12:38

It's ok. I just took this as an opportunity to allow cursors to propagate further throughout my app (as I have a mix of cursors and prefixes being passed around)

metametadata21:12:54

@pesterhazy I guess I've managed to solve the jumping cursor by using local state and r/force-update. And to sync the inner state of the component with the outer world I had to override :should-component-update and :component-will-receive-props

pesterhazy21:12:36

I think you need thread the on-change prop through to render

pesterhazy21:12:28

Otherwise it will always use the initial value, might lead to subtle bugs

metametadata21:12:51

I've commented about this in the docstring 🙂

pesterhazy21:12:25

Ah I did not see that

metametadata21:12:44

I agree it should be fixed

pesterhazy21:12:51

Is force-update required?

pesterhazy21:12:28

I thought updating state would have an immediate effect

metametadata21:12:32

because replace-state still rerenders asynchronously

pesterhazy21:12:17

Could you get around that by writing a react component directly?

pesterhazy21:12:46

Using React.createClass

pesterhazy21:12:29

Just wondering, nothing wrong with force-update of course

metametadata21:12:42

I guess so, but not 100% sure. Maybe it would make code a bit more readable because of no "async stuff"

metametadata21:12:05

here's the quote from the site: reagent.core/set-state and reagent.core/replace-state are now implemented using an reagent.core/atom, and are consequently async.

metametadata21:12:52

yeah, it's from v0.4.0

pesterhazy21:12:31

Well you can still access the actual component state by reaching into the js .-state

pesterhazy21:12:20

I was thinking that one could write a general purpose wrapper for this kind of application

pesterhazy21:12:35

A higher order component so to speak

pesterhazy22:12:45

How is rect-bootstrap by the way?

metametadata22:12:53

Well, I'm only trying it the sample project at the moment. I like that it's very close to raw Bootstrap, so I can google all the common solutions, add custom classes or reuse existing classes in Reagent components. It's also a bit smaller than Material UI wrappers. So far I don't like that inputs are broken and I can't override the <a> content of NavItems without hacks. Also no flexbox 🙂

david_clojurian23:12:53

Hello, I have a question. I use goog.events to handle browser events. When I register a handler for the mouse_up event and change the state of an atom inside this handler, the components will not be rerendered immediately. In the repl I see that the value of the atom is already changed. Only when I do an interaction the view will be updated and the atom takes affect. Is it possible to force reagent to do a check of pending changes? In advance: reagent/flush do it not. Only reagent/force-update-all works, but the performance is horrible and not for production use. Any ideas?