helix

https://github.com/Lokeh/helix
lilactown 2020-05-05T00:35:32.173500Z

ah I found some old code I wrote where I had made this hook:

(defn useChan [chan on-take on-close]
  (hooks/use-effect
   [chan on-take on-close]
   (let [cleanup? (a/chan)]
     (a/go-loop []
       (let [[v ch] (a/alts! [chan cleanup?])]
         (cond
           (= ch cleanup?) (on-close)
           (nil? v) (on-close)
           :else (do (on-take v)
                     (recur)))))
     #(do (a/put! cleanup? true))))))

Aron 2020-05-05T00:45:42.175900Z

thanks, that's very nice

Aron 2020-05-05T00:46:13.176400Z

not a defhook macro at least : D I am guessing that's why the go-loop recur is complaining

lilactown 2020-05-05T02:45:29.176800Z

does go-loop and recur not work when used inside defhook?

Aron 2020-05-05T02:47:54.177400Z

I am probably doing something wrong, it's a bit late at night, I need a coffee : )

Aron 2020-05-05T02:48:25.178Z

I was getting a lot of help from people, and tried out always the easiest. Will check the useChan right now

Aron 2020-05-05T02:48:38.178200Z

in #beginners

Aron 2020-05-05T02:53:38.179100Z

and from all the responses together I get the feeling that the problem is somewhere else

Luis C. Arbildo 2020-05-05T05:10:06.184300Z

Howdy, How can I do if I want add on-click event to style-components

(defstyled StyleNumberButton
  :div
  {:display "flex"
   :color "white"
   :border "1px solid black"
   :border-radius "10px"
   :background "gray"
   :height "100px"
   :width "50px"})

Luis C. Arbildo 2020-05-05T19:01:41.191400Z

@lilactown any idea?

lilactown 2020-05-05T19:01:56.191600Z

I’m not familiar with styled-components, sorry

lilactown 2020-05-05T19:02:17.191800Z

I would assume you can pass in an on-click handler to it when you invoke it?

Luis C. Arbildo 2020-05-05T19:03:50.192Z

No ... you just can pass an component

lilactown 2020-05-05T19:04:28.192200Z

I don’t know what you mean

lilactown 2020-05-05T19:04:43.192400Z

I’m guessing you can do (StyleNumberButton {:on-click ,,,}) or something?

lilactown 2020-05-05T19:04:58.192600Z

again, I do not know how this CLJS styled-components library works

Luis C. Arbildo 2020-05-05T19:15:26.192800Z

I guessed that too, but that doesn't work ... I was wondering if is possible helix give this returned element the possibility to add this events

lilactown 2020-05-05T19:15:56.193Z

I don’t see how helix comes into this?

lilactown 2020-05-05T19:18:50.193200Z

if that doesn’t work, it’s a bug with styled components and you should file a report

👍 1
lilactown 2020-05-05T19:20:54.193500Z

you could try :onClick

👍 1
💯 1
Luis C. Arbildo 2020-05-05T19:21:55.193700Z

I will try, thank you

Luis C. Arbildo 2020-05-05T19:29:45.194100Z

WORKS WITH :onClick !!! thank you master

Aron 2020-05-05T08:54:45.185200Z

@lilactown definitely something else, because not even this example works https://clojurians.slack.com/archives/C053AK3F9/p1588644858480300 basically, any time I used recur it said it cannot do it

Aron 2020-05-05T09:14:09.185900Z

but (go (loop instead of go-loop seems to work. Dunno why I haven't tried this first?

Aron 2020-05-05T16:48:07.186300Z

I am not sure the ($ macro is helping me with the props thing

lilactown 2020-05-05T16:59:18.186800Z

happy to help if you explain the problem 🙂

lilactown 2020-05-05T17:00:11.187600Z

if you’re ever curious about what $ is doing you can use macroexpand:

(macroexpand '($ foo {:bar "baz"}))
;; => (. (helix.core/get-react) createElement foo (helix.impl.props/props {:bar "baz"}))

lilactown 2020-05-05T17:00:43.188100Z

if you macroexpand the helix.impl.props/props call you can see exactly how it creates the JS object:

(macroexpand '(helix.impl.props/props {:bar "baz"}))
;; => (let* [obj85058 (js* "({~{}:~{}})" "bar" "baz")] obj85058)

Aron 2020-05-05T17:27:13.189100Z

@lilactown (mapv #($ ListFile {& %}) files) ? 🙂

Aron 2020-05-05T17:28:06.190100Z

(apply <> (mapv I think, but inside the mapv?

Aron 2020-05-05T17:28:31.190500Z

well, it works without the apply I think, haven't read the source

lilactown 2020-05-05T18:52:46.191300Z

yeah you should be able to pass a seq of elements to any other element, but you probably need to add a :key prop to help React

Aron 2020-05-05T20:16:36.194700Z

@lilactown but I can't create the seq of elements like that

Aron 2020-05-05T20:17:09.195400Z

is there maybe a branch or something with an easy sandbox to demonstrate

Aron 2020-05-05T20:26:09.196300Z

Ok, I think I got it working. In retrospect, it's probably me being very inept with clojure what's causing most of my problems.

2020-05-05T20:52:57.197700Z

If I want to pass a non-literal map to a component as props, is using a factory the best option? Eg ((helix/factory my-component) my-map) ?

2020-05-05T20:55:48.198800Z

Thanks. So if I have my-map as a local, do I need something like ($ component {& my-map}) ?

lilactown 2020-05-05T20:59:34.199700Z

yep

2020-05-05T21:00:15.200300Z

Thanks again. Maybe the docs should mention this variant of dynamic props. It wasn't immediately obvious that this was the preferred solution, though it makes sense now that I know it.

lilactown 2020-05-05T21:00:59.200800Z

Do you mean that the docs I linked are not clear that you can use a local binding?

2020-05-05T21:03:16.202200Z

That part was clear. What wasn't clear to me was that this is the preferred way to pass props to a subcomponent when all you have is a local binding, since we also have the option to use factories, and the factory approach seems to produce the same result.

lilactown 2020-05-05T21:04:26.202700Z

factories vs $ is sort of a separate issue. they both solve the same problem, it’s a question of syntax

lilactown 2020-05-05T21:04:45.203100Z

I’ve written almost no docs on factory functions

lilactown 2020-05-05T21:05:02.203500Z

we don’t use them on our project at work

lilactown 2020-05-05T21:06:22.204Z

I would accept a PR to clarify the docs, I’m just not sure how to be clearer yet 😄

2020-05-05T21:06:51.204400Z

I think I know a decent addition, I'll get you the pr in a few minutes. thanks for the help.

2020-05-05T21:28:47.205600Z

@lilactown If you're open to it, I'd be happy to also write a quick "integration with reagent" guide to help people with my use case - a primarily reagent+re-frame project with bits of helix added to make integration with js react libs easier

lilactown 2020-05-05T22:10:41.206300Z

that would be awesome and super useful to people I bet!