@danburton: regarding the parameter, you can try to define your component with ui. Are you using set-query! for now ?

Hey Folks 🙂 Wondering if anyone may be able to help me out? I've been learning ClojureScript & Om for a couple of days now. I am having a problem in regards to the following code snippet below:

;; Build the todo-input area to enter a todo task and then when
;; a user hits the return key, add the todo to the list area.
(defn todo-input [todos owner]
  (om/component
   (html
    [:input ;; Type input -> text.
     {:type "text"
      :placeholder "What needs doing?"
      :on-key-up (fn [event] ;; Trigger an event handler.
                   (let [input (.-target event)]
                     (when (= 13 (.-keyCode event)) ;; When user hits ENTER.
                       (om/transact! todos ;; Evlautation closure.
                                     (partial add-todo (.-value input))) ;; Take the value of input.
                       (set! (.-value input) ""))))} ;; After add-todo method has been executed -> reset input.
     ])))

;; Build the add-todo button to capture the input value and add
;; task to the list of todo items. No return key functionality required.
(defn todo-add-btn [todos owner]
  (om/component
   (html
    [:button {:class "add-btn" ;; Button type with class add-btn.
              :on-click (fn [event] ;; Trigger an event and function.
                   (let [input (.-target event)] ;; Event handler.
                       (om/transact! todos ;; Begin evaluation closure.
                                     (partial add-todo (.-value input))) ;; Take the value of input.
                       (set! (.-value input) "")))} "Add task" ;; After adding todo item -> reset input.
     ])))

Following from #C03S1L9DN channel. I haven’t write any om app so I probably not be able to point directly how to solve your issue in om way. But I believe I can explain what’s happening. First of all, (let [input (.-target event)]) means bind target of event to input symbol. You might view input as a local variable. Now the reason why todo-input works but todo-add-btn doesn’t is because the event fires from todo-input contains todo text because it’s html input tag. On the other hand, the event fires from todo-add-btndoesn’t contain anything because it fires from html button.

Does this make sense?

I’m not sure how to fix this in Om way but if I were to do it with my limited om knowledge. I would have an intermediate state to keep current text of todo-input. Then whenever, add button is pressed, grab that intermediate state and add it to the todos list

In on-key-up, you might do something like (om/transact! :editing-text ….. Then in on-click, you have to take data stored in editing-text and do (om/transact! todos … editing-text …).

regarding the editing text, you might consider component's local state ? ( Btw, I'm not sure are you guys talking about the same question ? and is it about om.now or om.next )

@nxqd: I’m not quite sure either. I have almost zero knowledge about Om. All I know is that @kino seems to have some misconception from reading his question. >My assumptions are that the input is a global variable

@tap Thank you sir! Makes sense… From what you say, it seems like having an intermediate state that stores the input value would be ideal in this scenario…

I am not really looking to go much further in the application than deleting todos, adding todos and clearing all todos. It’s more of an educational play around and for my current dissertation thesis.

@tap When you mention to implement a state like the following: (om/transact! :editing-text …) does this mean I would need something like (om/transact! :editing-text {:text text :done false}) ?

Or would I need to define and add editing-text to my function add-todo ?

(defn add-todo [text todos]
  (conj todos {:text text :done false}))

no not really, I'm not familiar with om.now so I couldn't help you. There would be more people later today, they will help you for sure.

@nxqd: Thank you 🙂 Will see what other peoples thoughts are… I will also dig around and research some more.

@kino: I don’t think you should modify your add-todo function as its purpose is to add a todo to the todo list. I believe you want something similar to add-todo but a different one. But please wait for other people to jump in, I don’t want to lead you to the wrong path. I intentionally left that unclear because I’m not familiar with them either.

@anmonteiro: I had to add a defmethod for compassus/read [nil :db/id] because I have mutations that modify references which get read from the top level (compassus throws an exception if I do not have this). Is it expected to have to add methods for compassus/read when giving additional read keys to transactions? (i.e. (om/transact! this '[(entity/update {}) :other-key-to-read]))

Does anyone have opinions on terminology between these cases: - A component that uses component local state, but has no query - A component that has a query - A component (say D3) that manages other hidden state and is therefore "stateful" I'm leaning towards: "stateful component" - A component that has component-local state (explicit via initLocalState but also including data that is hidden in places like the DOM by things like D3) "stateless component" - A component without state (opposite of stateful). May or may not have an Om query. "?????" - A component that has an Om query

Building docs and I'd like to be clear

"Queried component", "Data-driven component", "Component w/Query", "Om component", other suggestions?

It has to be said a lot, so I'm trying to find a nice concise term

perhaps I should just say "component means a component with a query unless otherwise specified"

@tony.kay: you could probably say that components without queries are just plain React components

And components with queries are "Om Next components"

That's probably simple enough

@cmcfarlen: I didn't anticipate that, no. Could you put together a simple example?

@anmonteiro: Sure, I'll put one together tonight.

@dnolen: I made a PR to fix an issue I had with om/process-roots and recursive queries a while back. Is there anything I need to do to have it considered for acceptance?

Thanks!

@cmcfarlen: did you send me a CA?

@dnolen: no sir. Not yet