Hi, is there any non-trivialish Om/Next app source code available to read ? Any recommendations ? thanks

Newbiew here: I want to build a fairly typical ItemList component. In examples I see, the root component has the query for the data, and ItemList declares no queries. Now, if I want ItemList to transact! (to add/remove items), it fails with transact! invoked by component [object Object] that does not implement IQuery.

I discard calling transact! from the Root component. The logic doesn't belong there

I want to give ItemList a query, but cannot figure out the right way. The query for the top-level key (say, :item/list) is already on the Root query. I cannot query for the same top-level key on ItemList, right?

I'm surely missing some basic concept here 😕

@dobladez: Your root queries should actually be repeated. (and @yusup) - to see how to structure your application see the Kanban demo.

thanks... I'll dig deeper into that app. Now, If I simply declare the same query on ItemList, after calling transact! I get No queries exist for component path ... ... this is why I thought it was not the right way to do it

@dobladez: can’t your ItemList be the root component?

thanks, but not really... I'd need my app's root to hold common stuff, and have many sub-widgets (ItemList being one of them)

@dobladez: I read your initial question again. I’d do the following: 1. removing items should be the easiest. each item knows how to remove itself so transact! on that 2. adding items can be done by passing the transact! call as a computed prop from the root to the ItemsList component

yeah, thought about 2. as an options... but wouldn't that pollute the Root component with stuff from all over the app?

I'm thinking of a typical "admin" app, with a menu on the left to going to different admin pages... some of those pages showing a list of items (say, Users). I cannot think of the top-level component having that detailed knowledge of all sub-components

I apologize if I am asking dumb questions. I'm pretty new to both Om and React. But after going through the docs and tutorials, I couldn't really find a good way to structure an app like that

thanks, I will look into that.

@dobladez: Adding is affecting all the items because it is adding to the list of them. The place where the list is is the parent (the root component in your case). So when you (transact this, the this needs to be the parent/root component, because it is the 'holder' of all the items.

right... I'm calling transact from ItemList, not from Item

however, the root component has the query. I'd like to have the query on ItemList (too?)

Oh okay - as long as parent, forget I said root,

Yes the root has joins to all the queries - see the Kanban demo - all data is loaded in from the top (root component), and you deliver the props down the rest of the inverted tree.

So, if my hierarchy is Root->ItemList->Item, the query for ItemList could look like [:item/list] (ignoring Item for now)

right? Then, the query at Root cannot simply include [:item/list] and pass it on. It worked for me when it first initializes , but after a transact, I get No queries exist for component path Root ItemList which I don't event know how to decode yet

I guess Root should query for something like [ { :xyz [ :item/list ] }] (or the equivalent [{ :xyz (om/get-query ItemList)] })

The root query should consist of all joins - so {} needs to be there.

right, typo... editing the msg

The same joins repeated on lower components, just not all in one as they are at the root component.

I'll keep banging at it... I'm trying to figure out what to do with :xyz above 🙂 I have nothing to join from! it's just a list I read from a top-level key