reagent

A minimalistic ClojureScript interface to React.js http://reagent-project.github.io/
william 2020-11-28T03:21:41.271800Z

Hi! I have a couple question on reagent (was sent here from the #clojurescript channel. Some context: my page is trying to display a graph managed with cytoscape.js 1. I have the entire graph in my r/atom. However, when the graph is updated, I don't want to redraw all the graph (because to keep positions of the already displayed nodes I want to pass only those to cytoscape). Instead, I want to calculate the diff between what was previously in the atom and my new version, and use that diff to issue the proper command to cytoscape. I cannot figure where to put this logic in the reagent framework, though. 2. I'd like to intercept when a node in my graph is clicked, and put that information in my global atom. But that part of the dom is built by cytoscape. How can I intercept the click events on the nodes?

william 2020-11-28T14:40:30.275500Z

unfortunately your suggestion is still a bit opaque to me. Could you explain it a bit more?

p-himik 2020-11-28T14:46:12.275700Z

I don't know of any examples offhand. You can look at the implementation of run!. If you need the previous value, just use add-watch.

william 2020-11-28T16:05:38.275900Z

thanks, got it working now. The missing point for me was how add-watch was a reagent-specific one. This enabled me to find documentation. Thanks again 🙂

1👍
p-himik 2020-11-28T03:26:31.271900Z

1. Probably in the component that uses Cytoscape and manages that ratom. You can explicitly monitor for ratom changes, e.g. with run! or with watches. Reagent docs, examples, and blog articles should cover that. 2. Do it through Cytoscape if it allows you to listen for click events. I imagine it should, it would be reasonable.

william 2020-11-28T03:29:49.272100Z

for 1., in which lifecycle function should that happen?

p-himik 2020-11-28T03:31:31.272300Z

Not in a lifecycle function at all. Read about run! and atom watches.

p-himik 2020-11-28T03:33:18.272500Z

A call to run! itself, if you decide to go with it, can be put in the outer function if you're using a form-2 component or in the with-let block if you're using that.

william 2020-11-28T03:33:45.272700Z

where are run! and atom watches discussed? I'm googling, is this it https://cljdoc.org/d/reagent/reagent/1.0.0-rc1/doc/tutorials/-wip-managing-state-atoms-cursors-reactions-and-tracking#reactions ?

william 2020-11-28T03:35:12.273Z

ok found https://cljdoc.org/d/reagent/reagent/1.0.0-rc1/api/reagent.ratom#run! at least, but still searching for a proper introduction

william 2020-11-28T12:56:10.274200Z

Hi, I'd like to find the documentation for the run! function in reagent, as well as for the concept of atom watches

william 2020-11-28T13:57:03.275400Z

to offer more context, I have an r/atom and I want to generate a new one that stores the diff between versions of the first. While I understand how to create a reaction, I don't know how to access the value previous to the change

william 2020-11-28T14:40:30.275500Z

unfortunately your suggestion is still a bit opaque to me. Could you explain it a bit more?

p-himik 2020-11-28T14:46:12.275700Z

I don't know of any examples offhand. You can look at the implementation of run!. If you need the previous value, just use add-watch.

william 2020-11-28T16:05:38.275900Z

thanks, got it working now. The missing point for me was how add-watch was a reagent-specific one. This enabled me to find documentation. Thanks again 🙂

1👍
william 2020-11-28T16:06:16.276600Z

It was pointed to me that we have the function add-watch that works for general atoms. This solves my problems above