Is there a way to return React dom nodes from a function that normally returns hiccup for Reagent? I need it for React interop with the InfiniteLoader from React-Virtualized.

I think I found it here: https://reagent-project.github.io/news/news050.html

as-element

react-virtualized is awesome by the way

I have some sample code if you need it

for reagent I mean

@pesterhazy That would come in handy I think!

There might also be something in Reagent that takes care of this?

(defn is-row-loaded [props]
  (let [{:strs [index]} (js->clj props)]
    …)

the destructuring part I mean

@borkdude I've gisted it up for you: https://gist.github.com/pesterhazy/10b4a01908e7632825a2321c06130989

didn't have time to clean it up too much, hope it's helpful anyway

@pesterhazy many thanks 🙂

Does Reagent have a utility for this? https://clojurians.slack.com/archives/reagent/p1486657376004840

ah. no unfortunately not

probably better to do (let [index (goog.object/get props "index")])?

js->clj is not perfectly reliable and may do too much work

ah

I agree it's cumbersome

I’ll just use plain interop then

if you plan to use adv compilation, goog.object/get is your best option

I think

why is this? I’ve heard it before vaguely

google closure minifies property names

so it will break direct access like (.-index ...)

ah, of course

I almost never run into this, but that’s of course because of proper cljsjs externs

But in this case that must work too I guess

yeah externs don't apply in all cases, e.g. callbacks

goog.object it is then

@pesterhazy What does this notation mean? :> js/ReactVirtualized.AutoSizer

short cut for adapt-react-class

Ah, r/reactify-component

nope, adapt-react-class

https://reagent-project.github.io/news/news060-alpha.html

yeah, I meant the other way around, the utility I was searching for

right!

but :> is now also clear, thanks for the link

Hmm, > Uncaught Error: InfiniteLoader.render(): A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.

you need to return e.g. (r/as-element [:div ...])

This is what I’ve got right now: https://gist.github.com/borkdude/e64e0701fbe26bace8495ea35d613fb7

Trying to follow these docs: https://github.com/bvaughn/react-virtualized/blob/master/docs/InfiniteLoader.md

The problem is in the List

Maybe I should write: (r/create-element js/ReactVirtualized.List #js {…}), but that doesn’t work either

Turns out List isn’t even defined, doh

I’m working with “7.11.8-1” because that was the latest on cljsjs

yeah it's a bit outdated

Hi all. core.logic for facts & queries, +reagent for web front-end decision tree for our users. Does it make any sense to even consider using those two birds together?

A lot of systems and constraints make for non-intuitive decisions in the course of our work, hence the desire on my part, to let core.logic do the dirty work of ifs-and-thens.

But not sure how to tie query results

(run* [q] …)

(defn advice-component [] (if (run* [q] …

Realize I need to test if no one has done this before (doubtful) but googling for this = nil.

Ok, now I upgraded the cljsjs package myself. I get: Warning: Something is calling a React component directly. Use a factory or JSX instead, for:

(r/create-element js/ReactVirtualized.List
                         #js {...})

<List .... />

Wrapping it in a createFactory gives me the same message, like so:

(def List* (.createFactory js/React js/ReactVirtualized.List))

(List* #js {…})

@borkdude you might try (aget js/ReactVirtualized "List")

It’s already solved now. I used js/React.createElement js/ReactVirtualized.List

but there was also a problem with r/reactify-component, I had to wrap that result in a factory as well

with the aget mentioned above, I think you could use something like this- (def List (aget js/ReactVirtualized "List") and then to call it in code [:> List ... ]

or I should say, I have used that before, but not sure if it would for that lib 🙂

Yeah, in this case it doesn’t fit the pattern, because I need to give React a function that returns a component