Fork me on GitHub
#reagent
<
2017-03-25
>
Pablo Fernandez14:03:16

I have this reagent component that uses setInterval to change its state:

Pablo Fernandez14:03:00

I can see the value being printed, a different one each time, but the html doesn't change. Why is that?

noisesmith15:03:25

what would make the component re-render?

Pablo Fernandez15:03:45

O, fuuu, it's an atom not a ratom.

Pablo Fernandez15:03:09

Yeah yeah... I know about this, I've been using reagent long enough... I just had a brain fart.

pesterhazy15:03:53

it's a common enough issue (especially because reagent docs (used to?) encourage referring r/atom as atom)

rgdelato16:03:44

sorry if this has been answered in other places, but how do I remove react-dom-server from my build? (I assume it's not needed if I'm not server-rendering)

pesterhazy16:03:00

@rgdelato I think it shouldn't be included by default

pesterhazy16:03:50

it's packaged as a separate cljsjs maven coordinate

pesterhazy16:03:13

if it's a transitive dep, try lein deps :tree or boot show --deps to see where the dependency comes from

pesterhazy16:03:55

in which case you can use excludes for that dependency (or global excludes) to remove it from the build

rgdelato16:03:42

lein deps :tree gives me this:

[reagent "0.6.0"]
   [cljsjs/react-dom-server "15.2.1-0"]
   [cljsjs/react-dom "15.2.1-0"]
     [cljsjs/react "15.2.1-0"]

pesterhazy16:03:04

ah, I did not know that reagent defaults to including react-dom-server

pesterhazy16:03:09

:dependencies [[reagent "0.6.0" :exclusions [cljsjs/react-dom-server]] should do the trick

rgdelato16:03:28

hmm. adding the exclusion to 0.6.0 is making the build fail for me, but upgrading to 0.6.1 seems to remove react-dom-server from the minified build by default. weird o.o

rgdelato16:03:50

thank you for the help though!

Pablo Fernandez16:03:06

If I have a value that's been created by reagent/adapt-react-class, is a there a way to get to the backing react object?

Pablo Fernandez17:03:25

How do I add a property to a reagent component?

Frank Henard17:03:42

I'm trying to use react-bootstrap with bootstrap 4.0.0 (from webjars) with reagent. It seems that cljsjs.react-bootstrap is pulling the 3.3.6-1 version of bootstrap. Can I use it with bootstrap 4.0.0?

Frank Henard17:03:01

or what would be the recommended way to use bootstrap 4.0.0?

Frank Henard17:03:10

[cljsjs/react-bootstrap "0.30.7-0" :exclusions [[cljsjs/react]]]
   [cljsjs/bootstrap "3.3.6-1"]
     [cljsjs/jquery "1.9.1-0"]

Frank Henard17:03:51

^ that's what I mean by it pulling the 3.3.6-1 version of bootstrap. I'm not sure where that dependency is specified though

pesterhazy17:03:14

@pupeno what are you trying to accomplish?

Pablo Fernandez17:03:28

nvm, I figured it out.

pesterhazy17:03:48

I'd still be interested in what you found

pesterhazy17:03:13

@ballpark what do you need react-bootstrap for?

pesterhazy17:03:37

bootstrap works fine a pure css, unless you use the (relatively few) components that have a javascript component

pesterhazy17:03:54

in all other cases a react wrapper really only adds confusion

pesterhazy17:03:42

[:div.form-group [:input.form-input]] or whatever is pretty clear already

Pablo Fernandez17:03:42

@pesterhazy give me a sec to commit and push and I'll show you.

Frank Henard17:03:06

@pesterhazy Thanks for your reply. I was trying to do a dropdown in the navbar, which I'm pretty sure needs the js component. However, I'm pretty new to cljs development, so if people are getting by well without using the js components of bootstrap, I can do my best to avoid it.

pesterhazy17:03:33

yeah the dropdown is one of the components that needs it

pesterhazy17:03:22

haven't tried it with cljs though

Frank Henard17:03:01

cool! I'll take a look.

pesterhazy17:03:56

if it's just the dropdown, it might be possible to re-implement it in cljs easily

pesterhazy17:03:15

anyway you can specify a global exclusion for bootstrap

Frank Henard17:03:16

side question: If someone were to really want the js components to react bootstrap, would it make sense to try to generate the externs for it?

Frank Henard17:03:39

that's the one that seems to be depending on the 3.3.6-1 version of bootstrap

pesterhazy17:03:56

@ballpark doesn't your exclusions line have a pair of [] too many?

Frank Henard17:03:29

that came from lein deps :tree

pesterhazy17:03:18

you should be able to specify the exclusion, there must be a typo in your project.clj I think

Frank Henard17:03:37

ahh interesting

Frank Henard20:03:23

I ended up downgrading to bootstrap 3 cause I really wanted those js components. Thanks again for your help!

Pablo Fernandez18:03:17

I just have the structure with the reagent component and the properties in a vector, so, it was easy modify the properties in the vector.

pesterhazy18:03:36

interesting, thanks for sharing

pesterhazy18:03:49

so the problem is about identifying and manipulating children?

pesterhazy18:03:26

I can see how that could become hairy