Fork me on GitHub
#fulcro
<
2020-12-11
>
tony.kay00:12:53

Make sure you check out the DB Explorer tab. The search by ID can be particularly fast/useful when you ahve a lot of nodes and know what you’re looking for. The DB tab gets slow if the db is big

nivekuil01:12:22

fulcro really is conceptually very simple but demands a real understanding of the basics or it will be very very hard. Something like an interactive quiz with "what the state will look like given this code" type qs would probably have been very helpful for me, rooting out bad assumptions and misunderstandings

👍 9
Aleksander Rendtslev03:12:56

It feels amazing when everything works. (text inputs are a lot more responsive than with reagent as well. Really good job with that!).. I am having some trouble figuring out how to tie my changes back to my components again. I’ll do a more thorough read through tomorrow and watch the video. I’m trying to append an “entry” to a list after it has been created in the local database (all local right now). And I narrowed it down to having to use targeting/integrate-ident I’m seeing the entry being added to a list in :component/id -> :entry-list -> :entry-list/entries in fulcro inspect, but it’s not reflected in the app. I’m guessing the identity isn’t properly attached somehow?

(defsc EntryList [_ {:entry-list/keys [entries] :as entry-list}]
  {:ident (fn [] [:component/id :entry-list])
   :query [{:entry-list/entries (comp/get-query Entry)}]
   :initial-state {:entry-list/entries []}}
  (ui/view
    (ui/text (str "They are right here below! " (.stringify js/JSON (clj->js entry-list))))
    (map ui-entry entries)))

(def ui-entry-list (comp/factory EntryList))


(defsc EntryPanel [_ {:user/keys [name]
                      :entry-panel/keys [entry entry-list]}]
  {:query [:user/name
           :entry-panel/entry
           {:entry-panel/entry-list (comp/get-query EntryList)}]
   :initial-state (fn [_] {:user/name "Aleksander"
                          :entry-panel/entry (comp/get-initial-state EntryOverlay)
                          :entry-panel/entry-list (comp/get-initial-state EntryList)})
   :ident (fn [] [:component/id :entry-panel])
   }
  (ui/view {:style (tw :w-full :flex-1 :p-5 :align-start :justify-start)}
           (comp/fragment
             (ui/text {:style (tw :text-sm :mb-1 :text-primary)} "Mon, Nov 17")
             (ui/text {:style (tw :text-2xl :mb-2 :text-primary)} (str  "Good morning, " name))
             (ui/text {:style (tw :text-lg :text-primary)} "What did you eat today??")
             (ui-entry-list entry-list)
             (ui-entry-overlay entry))))

Aleksander Rendtslev03:12:15

(if the answer is to read the manual and watch the video, that’s totally cool. Just wanted to throw this out there)

Jakub Holý (HolyJak)22:12:08

What if you force re-render from root?

Aleksander Rendtslev01:12:58

I’m still working through this and trying to understand why it isn’t working. Currently reading through the book, so I’ll keep going until I find the answer. However, I would have expected it to be in the section in the screenshot below (or here: https://book.fulcrologic.com/#_mutations_on_a_normalized_database). I just learned how to delete an entity from a list (meaning updating that view in the graph). How do I add to it?? I suppose I’ll just read on. It would have been neat with either an explicit example, or: For appending or prepending an element to a list you would do this: … Or read more about how to control the elements of lists here (link to the section) I know now that it’s just a node in the database, but for some reason I still can’t figure out how to update it correctly and get it to propagate on my screen

Aleksander Rendtslev01:12:18

Ok, I’m clueless about this one. Probably just a gotcha I can’t figure out, but if any of you can see what I’m doing wrong here, that would be super helpful:

Aleksander Rendtslev01:12:21

1. Everything works fine for EntryOverlay. It receives the added entry annd the cursor-pos changes to 9000 (I’m printing it on the screen to check it out) 2. Nothing changes for the EntryList. Neither the name (I’m trying to swap it from First to Second) or the elements added to the list. 3. All the changes are detectable in the graph:

Aleksander Rendtslev11:12:59

@holyjak any idea on this one? (In case it was too far hidden up a thread)

Jakub Holý (HolyJak)11:12:56

Sorry I am off computer. Look into the data-targeting namespace and the mutations ns

Jakub Holý (HolyJak)11:12:15

Is that so that the DB is as you expect only the UI does not reflect it? If so, try force render from Root - does it help? app/schedule-render! - find it in the book

Aleksander Rendtslev11:12:58

Yes, the DB is as i expect it to be. Ok, I'll try that. I'm still puzzled though if that's the case. I would expect an app of 4 defsc components to update as expected (otherwise i fear having to default to force rerenders for everything if i can't expect components to reliably update). My next steps are: - try a force rerender - add another component and see if that one works - try calling a mutation from the other component to see if changes are isolated to the component from where they're triggered (that would be puzzling to me as well)

Aleksander Rendtslev11:12:43

Thank you for pitching in!

Aleksander Rendtslev12:12:06

I figured it might have to do with my usage of transact!! which would make sense since it optimizes for funneling changes down to the text-input? (Reading through the notes it sounds like that might be exactly it) But I tried doing an explicit transact! (which should be asynchronous) on a button to push the change to the other component, and I’m still not seeing the change in the interface

👍 3
Aleksander Rendtslev13:12:10

Ok, Sorry for the long and winded sharing session. Boiling it down to basics helped: My issue was that I hadn’t connected the EntryPanel query in root:

bananadance 3
Aleksander Rendtslev13:12:25

(feel free to ignore all this, but I was hoping seeing the pitfalls and the gotchas of someone starting to use the framework might be helpful. I’ll be documenting all of these in an internal FAQ/Gotchas)

tony.kay17:12:52

Pifall numbers 1,2,3,4,5: failing on query/ident/initial state

🙌 3
tony.kay16:12:45

definitely watch the video. Depends where the code lives. In a mutation, see the merge-component, integrate-ident, and plain old data munging. For something you loaded, the params support targeting (see book/docstrings). For a mutation’s return value, see mutations ns helpers returning and with-target

genekim21:12:14

THANK YOU @holyjak for your help today — I promise I’ll writeup what I learned in the next day or two, and how you helped me get resolvers and queries working! It really is amazing seeing what Fulcro RAD can do… 🙏🙏 cc @tony.kay

💯 6
Jakub Holý (HolyJak)23:12:56

Thank you for the kind words! Helping people with Fulcro is fun. And I hope we can find ways to make the onboarding experience easier for everyone...