Fork me on GitHub
#shadow-cljs
<
2022-04-20
>
pinkfrog10:04:13

I got a hotloading issue. I am on react native, but that should not matter much as regard to react on web. The problem is, the main screen is A. Starting from A, I navigated to B, and then C. Now I edit the code related to C. Shadowcljs happily reloaded the code of C. But how do I re-render C and show it? Currently I added a dev/after-load on the starting-screen A, which is the entry point. But that makes the screen to show A instead of C everytime I change code.

thheller10:04:35

that it entirely out of the control of shadow-cljs. it just calls a function. what that renders is up to you.

pinkfrog11:04:16

I take my words back. seems adding the ^dev/after-load at register-component indeed calls that function, but some other mechanism is needed to trick RN to rerender all the app

(defn register-component {:dev/after-load true}
  []
  (.registerComponent ^js (.-AppRegistry rn)
                      "myapp"
                      ;; wrap in :>f to make a functional component
                      #(r/reactify-component (constantly [:f> app]))))

thheller12:04:35

your version does not work propery with hot-reload

thheller12:04:49

I created the render-root helper for this purpose

pinkfrog12:04:55

Yup. I was searching for the forceUpdate method, but seems the result from r/reactify-component does not contain such field.

thheller12:04:46

you are free to copy this but all the steps it does are necessary. so be careful if you try to build your own. https://github.com/thheller/shadow-cljs/blob/master/src/main/shadow/react_native.cljs

thheller12:04:54

its not just .forceUpdate

pinkfrog14:04:48

Now I doubt this works. The method only updates the root component, but cannot recursively updating child components.

pinkfrog14:04:35

Just tested. Only the root component is foreced to be updated.

thheller15:04:10

then one of your components decides to skip rendering. see the gotchas described here https://code.thheller.com/blog/shadow-cljs/2019/08/25/hot-reload-in-clojurescript.html