reagent

A minimalistic ClojureScript interface to React.js http://reagent-project.github.io/
Lucy Wang 2020-04-16T00:14:32.168700Z

created a pr to improve the doc about using react portals https://github.com/reagent-project/reagent/pull/488 (from the discussion in https://github.com/reagent-project/reagent/issues/418)

2020-04-16T05:27:39.168900Z

Hmm so that explains one thing but doesn't really still explain (at least to me) why the build fails. And only on Linux, not Mac.

2020-04-16T05:34:47.169100Z

Maybe I have some stuff left from previous build on my machine and that's why it works...

Oz 2020-04-16T08:04:26.175900Z

Hi, :spock-hand: a question about form 3 components. My app have a tabbed view of data for three little robots. I have a component, that renders a tab, and triggers a polling of some relevant data for the currently viewed robot. The active tab is an atom, so when I change it it re-renders the component:

(defn robot-panel []
           (let [active-tab (re-frame/subscribe [::subs/active-tab])]
           ;;some other stuff
              [robot-tab @active-tab]
           ;;some other stuff
           ))
Then, the robot-tab component, when mounted starts polling, and when unmounted stops polling
(defn robot-tab [n]
  "renders a tab displaying fish feeding robot data"
  (reagent/create-class 
    {:component-did-mount
     (fn [this]
       (request-robot n))
     :component-will-unmount
     (fn [this]
       (release-robot n))
     :reagent-render
     (fn [n] [:<> 
     ;;Some robot things that get rendered
      ])}))

Oz 2020-04-16T08:08:57.179800Z

However, when switching a robot tab,the component doesn't unmount and remount, so the polling don't update. I need to tell it to run (release-robot old-n) (request-robot new-n) When it updates.. So I should probably store them in local state and use them in :component-did-update

Oz 2020-04-16T08:09:36.180500Z

Thank you, that might be the solution https://emojipedia.org/face-with-tears-of-joy/

juhoteperi 2020-04-16T08:26:36.182500Z

@ozfraier You can control when the component is unmounted and remounted by changing its identity - React key. If you only change the props, the component is the same, but it is just re-rendered. ^{:key robot-id} [robot-tab n] would unmount the old robot-tab component and create new when the robot-id value changes.

juhoteperi 2020-04-16T08:27:15.183Z

(robot-id = n probably here)

Oz 2020-04-16T09:10:22.186400Z

Thank you @juhoteperi, It works! Edited: I had a bug here but it was caused by something else...

Lucy Wang 2020-04-16T14:33:49.188400Z

@ozfraier If you're using a client side router like reitit, another way is to bind these tabs to different urls (for instance <http://example.com/app#tab1|example.com/app#tab1> <http://example.com/app#tab2|example.com/app#tab2> ) and use the mechanism provided by the router to start/stop the poller when switching routes

1💡