Fork me on GitHub
#re-frame
<
2019-12-09
>
deas06:12:53

Appears react 16.9+ requires re-frame10x develop branch. Does anyone know which change(s) in react are to blame? And how far we are from getting master / releases play with latest 16.x?

Filipe Silva10:12:31

iirc react 16.9+ started adding warnings of this type

ūüĎć 4
Filipe Silva10:12:32

Warning: componentWillMount has been renamed, and is not recommended for use. See  for details.

* Move code with side effects to componentDidMount, and set initial state in the constructor.
* Rename componentWillMount to UNSAFE_componentWillMount to suppress this warning in non-strict mode. In React 17.x, only the UNSAFE_ name will work. To rename all deprecated lifecycles to their new names, you can run `npx react-codemod rename-unsafe-lifecycles` in your project source folder.

Please update the following components: DevcardBase, HistoryComponent, ReagentInput

Filipe Silva10:12:16

reagent has a couple of 0.9.0 rc versions that support it

Filipe Silva10:12:26

then re-frame picks up the rcs

Filipe Silva10:12:46

I assume that when reagent goes 0.9.0 final, other tools that use it will also update

ūüĎć 4
Filipe Silva10:12:44

although now that I think about it, for some projects it might be enough to just update reagent in place and the warnings for will go away because the java/clj dependency model is flat

deas10:12:47

Noticed the warnings. At github it reads 16.9+ is not "supported" by releases. Hence I was assuming things to break when using the release with recent react versions.

Filipe Silva10:12:31

I haven't seen stuff breaking down but the warnings started to annoy me so I just stayed on 16.8

Filipe Silva10:12:26

I wasn't using anything that actually required 16.9+, I just wanted to use latest

deas10:12:40

Well, ... rc3 sounds trustworthy and not far of from a release. Guess I should just try it out and ūüôŹ.

deas10:12:38

One more thing regarding re-frame10x: I'd like it to be available at all times, but it would be nice if one could make its default appearance (wide panel on right showing up unconditionally) a little less invasive. Anyone got a trick to share to get it there? Would be nice just to have a keybinding to show/hide it.

p-himik12:12:51

There is a keybinding, Ctrl+H. It's not really comfortable since it opens a history page when an input field is focused, but it works.

ūüĎć 4
deas12:12:59

Read about it. Quick try did not work for me and indeed opened the history pages on Chrome and FF. Could not imagine why people chose this keybinding. Assumed "Ctrl+H" must have been a typo.

p-himik12:12:20

Try clicking within the page to make sure it's in focus.

deas10:12:22

It's actually just a single property which needs toggling.

deas12:12:24

One last question: Doing just plain desktop web-development and using re-frame10x already. Might be missing something, but appears re-frisk does not add any value in this case, right?

p-himik12:12:07

FWIW, I immediately stopped using re-frisk once I've discovered re-frame-10x.

ūüĎć 4
deas12:12:43

re-frisk advertises remote capabilities (which re-frame10x does not have, but which I don't need either). Other than that, re-frame10x seems to have all that re-frisk offers and some more on top and there is really no reason for me to keep both around.

Filipe Silva13:12:14

since we're talking about re-frame-10x... when using it with datascript/re-posh, is there some super obvious way of showing the db content in re-frame-10x?

p-himik13:12:46

I have worked with neither of them. Do they not use the re-frame's db?

Filipe Silva13:12:18

datascript is a datalog db, and when you hook up re-posh (a re-frame lib for datascript) then it starts using that db instead

Filipe Silva13:12:43

I suppose the smart thing to do is to create some sort of db representation and stick it into app-db when it changes

p-himik13:12:19

That would be too convoluted IMO. re-frame-10x attaches trace handlers to re-frame. It seems like it should be possible to override the places where it happens so that instead of tracing re-frame's db you'd start tracing datalog db.

Filipe Silva13:12:05

hmmm yeah, that makes sense. maybe 10x allows for custom tracing tabs

p-himik13:12:34

I don't think it does. ūüôā May be wrong though. But it relies on the regular re-frame subs and event handlers. And you can override those just by calling the appropriate registering functions with the same IDs. Yes, there will be some repetition of the code that already exists in re-frame-10x.

p-himik13:12:57

Maybe it also makes sense to make it possible within re-frame-10x source code and make a PR.

Filipe Silva14:12:56

well if nothing else, I should make an issue since there's none on the topic

Ramon Rios17:12:21

I woud like to dispatch 2 events, one after other is that possible? I know dispatch-n but it could be Syncronous?

p-himik17:12:13

Assuming I understood you correctly, you can make the first event handler dispatch the second event.

Ramon Rios17:12:22

I have one event that saves my customer

Ramon Rios17:12:32

(rf/reg-event-fx
 :customer/create
 (fn [{:keys [db]} [_ customer]]
   (let [customer (or customer (d/current db))]
     {:http-xhrio {:uri "api/customer"
                   :method :post
                   :format ajax/json-request
                   :response-format ajax/json-response
                   :params customer
                   :on-success [:customer/create-success]
                   :on-failure [:customer/create-failure]}})))

Ramon Rios17:12:40

On the :on-success it saves a value on app-db

Ramon Rios17:12:59

(rf/reg-event-db
 :customer/create-success
 (fn [db [_ cust]]
   (d/add-customer db cust)))

p-himik17:12:41

Looks reasonable.

Ramon Rios17:12:03

I would like that, right after it add the response on app-db i dispatch another event. Because i need the customer id on the response for another rest call

Ramon Rios17:12:34

I don't know if a simple reg-event-fx would made it one after another.

p-himik17:12:34

(rf/reg-event-fx
 :customer/create-success
 (fn [{db :db} [_ cust]]
   {:db (d/add-customer db cust)
    :dispatch [:make-that-other-api-call (:id cust}))

Ramon Rios17:12:52

(rf/reg-event-fx
 :customer-create-2
 (fn [cofx [_ cust]]
   {:db (d/add-customer (:db cofx) cust)
    :dispatch [:customer/create-address]}))

Ramon Rios17:12:01

I tought something similar