re-frame

https://github.com/Day8/re-frame/blob/master/docs/README.md https://github.com/Day8/re-frame/blob/master/docs/External-Resources.md
Ovidiu Stoica 2021-05-29T06:54:34.043400Z

Does anyone have any idea why re-frame won’t recognise a handler i have? Handler :

(rf/reg-fx
  :ajax/get
  (fn [{:keys [url success-event error-event success-path]}]
    (GET url
         (cond-> {:headers {"Accept" "application/transit+json"}}
                 success-event (assoc :handler
                                      #(rf/dispatch
                                         (conj success-event
                                               (if success-path
                                                 (get-in % success-path)
                                                 %))))
                 error-event   (assoc :error-handler
                                      #(rf/dispatch
                                         (conj error-event %)))))))
event-fx that dispatches it:
(rf/reg-event-fx
  :messages/load
  (fn [{:keys [db]} _]
    {:ajax/get {:url           "/api/messages"
                :success-path  [:messages]
                :success-event [:messages/set]}}))
And i get this in the console:
re-frame: no handler registered for effect: {ns: "ajax", name: "get", fqn: "ajax/get", _hash: 1697424003, cljs$lang$protocol_mask$partition0$: 2153775105, …} . Ignoring.
I am kinda lost on this one

lloydshark 2021-05-29T07:12:14.043700Z

Is the namespace that defines the :ajax/get handler definitely loaded?

p-himik 2021-05-29T07:37:59.044Z

That, and also seems like you would benefit from installing https://github.com/binaryage/cljs-devtools

Ovidiu Stoica 2021-05-29T07:50:14.044300Z

@lloydshark I think you are correct. The namespace that has the ajax handler is not required in any other place. Would simply requiring it in the main ns solve this?

p-himik 2021-05-29T07:50:38.044500Z

Yes.

Ovidiu Stoica 2021-05-29T07:50:46.044700Z

@p-himik thank you. I am a beginner with clojurescript so any other good resources like that one are much apreciated πŸ˜„

p-himik 2021-05-29T07:52:25.044900Z

Also https://github.com/binaryage/dirac then, but I'm not sure whether it works with shadow-cljs right now. And, well, shadow-cljs if you work with NPM packages a lot. And since you're using re-frame, https://github.com/Day8/re-frame-10x or https://github.com/flexsurfer/re-frisk

❀️ 1
Ovidiu Stoica 2021-05-29T07:52:41.045100Z

Thank you, that fixed it πŸ’ͺ

p-himik 2021-05-29T07:52:57.045300Z

There are many other tools that help during development of course.

Ovidiu Stoica 2021-05-29T06:55:04.043500Z

They are in separate namespaces but I don’t think that is the problem

Lukas 2021-05-29T11:28:04.049700Z

Hey, I'm trying to get a component with react ref and re-frame sub working. My problem is, that when data gets dispatched a new "view" is created instead of updating the existing one. This probably ain't that hard, but I'm fairly new to reagent/re-frame. This is what I've got so far

(defn result-view [source]
  (let [!view (atom nil)]
    (fn [source]
      ;; update the ref
      (when-let [v @!view]
       (. v (dispatch (. (. v -state)
                         (update  #js {:changes {:from 0 :insert "0"}})))))
      [:div
       {:ref
        (fn [el]
          (reset!
           !view
           (EditorView.
            #js {:state
                 (.create
                  EditorState
                  #js {:doc (with-out-str (fipp source))
                       :extensions extensions-read-only})
                 :parent el})))}])))

(defn result-box []
  (let [source (rf/subscribe [:results])]
    (fn []
      (let [[_ form] @source]
       [:div {:class "code-box"}
        [result-view form]]))))
I'm really grateful for any pointer how to get this running 😊

p-himik 2021-05-29T11:37:06.050Z

subscribe returns a Reagent reaction, so this question isn't really re-frame-specific. If you don't get an answer here, I'd try asking in #reagent

Lukas 2021-05-29T11:39:34.050200Z

okay thank you I give it a shot

p-himik 2021-05-29T11:45:37.050400Z

The "if you don't get an answer here" was an important part. :) In general, you should wait for at least a few hours. People are in different time zones and have different schedules.

Lukas 2021-05-29T11:48:55.050600Z

Thanks again, deleted the post on #reagent πŸ™‚

πŸ‘ 1
lilactown 2021-05-29T14:45:28.051100Z

there's a couple issues with your code

lilactown 2021-05-29T14:48:55.051400Z

I think the one that's biting you rn is that you're passing in a new function to the :ref prop every render, which is causing React to reinitialize the ref

lilactown 2021-05-29T14:50:36.052Z

if you move the ref fn that creates the EditorState outside of the inner render fn of your form-2 component, then it should stop recreating it every render

lilactown 2021-05-29T14:52:51.052300Z

I'm guessing that calling .dispatch on the view during render with some dummy data is just a test you're doing, but I'm inferring that you want to render the current source passed to the results-view component in the editor

lilactown 2021-05-29T14:53:51.052500Z

in that case, you'll want to use a form-3 component that has a component-did-update method which will dispatch the update to the view immediately after a successful render. this way, your render fn stays pure and you won't run into weird bugs later

Lukas 2021-05-29T14:55:42.052700Z

Thank you a lot for this detailed explanation 😍

Lukas 2021-05-29T14:56:33.052900Z

I will give it another shot with the stuff I just learned πŸ™

Lukas 2021-05-29T15:08:02.053100Z

@lilactown awesome it seems to work πŸ’ͺ

(defn result-view2 [source]
  (let [!view (atom nil)
        !mount (fn [el]
                   (reset!
                    !view
                    (EditorView.
                     #js {:state
                          (.create
                           EditorState
                           #js {:doc (with-out-str (fipp '(load-db db-name "resources")))
                                :extensions extensions})
                          :parent el})))]
    (r/create-class
     {:display-name "result-view"
      :component-did-update
      (fn []
        (println "hallo?"))
      :reagent-render
      (fn [source]
        [:div {:ref !mount}])}))) 
πŸ‘† thanks again πŸ˜‡

lilactown 2021-05-29T19:15:57.053300Z

yw!