Fork me on GitHub
#fulcro
<
2022-03-04
>
dvingo02:03:57

if an exception is throw during mutation processing is the exception caught silently with no indication? I'm seeing that happening and wondering if anyone else has run into this

dvingo02:03:14

oh it's a PEBCAK - I had timbre deny the tx-processing ns :face_with_hand_over_mouth:

Timofey Sitnikov12:03:33

Good Morning! I am trying to learn about routes, and assuming I have a router:

(defrouter TopRouter [_this {:keys [current-state _pending-path-segment]}]
  {:router-targets [Main People]}
  (case current-state
    :pending (dom/div "Loading...")
    :failed (dom/div "Loading seems to have failed. Try another route.")
    (dom/div "Unknown route")))
The People route is a page with list of people, like so:
(defsc Person [this {:person/keys  [id name city state] :as props}]
  {:query   [:person/id 
             :person/name 
             :person/city 
             :person/state]
   :ident    :person/id}
  (dom/div "Person" (str name)))

(def ui-person (comp/factory Person {:keyfn :person/id}))

(defsc People [_this {:root/keys [people] :as _props}]
  {:ident :root/people                       ; <<====== WHAT SHOULD THIS BE?
   :query [{:root/people (comp/get-query Person)}]
   :route-segment ["people"]
   :initial-state {}}
  (dom/div {}
   (dom/h1 "People:") 
   (dom/ul (map ui-person people))))  
I am little confused what should the ident of People be? The complete source of can be seen https://gitlab.com/sittim/fulcro-routing-temp/-/blob/main/src/main/app/client.cljs

xceno14:03:08

The ident for your people list can be a "singleton" like [:component/id ::People]or [:lists :people]. Whatever fits your needs. Just remember to target that list when you load your data

Timofey Sitnikov14:03:30

@U012ADU90SW, if I set it to :ident (fn [] [:component/id :people]) than the when I add multiple people like so:

(merge/merge-component! SPA Person {:person/id    1
                                      :person/name  "John Doe"
                                      :person/city  "New York"
                                      :person/state "New York"}
                        :append [:component/id :people])
  (merge/merge-component! SPA Person {:person/id    2
                                      :person/name  "Ken Smith"
                                      :person/city  "Los Angelos"
                                      :person/state "California"}
                        :append [:component/id :people])
  (merge/merge-component! SPA Person {:person/id    3
                                      :person/name  "Kate Middleton"
                                      :person/city  "London"
                                      :person/state "England"}
                        :append [:component/id :people]))
I end up with a single person like below:

Jakub Holý (HolyJak)15:03:50

You have all the people, at the correct place, under :person/id <id> The client DB's :component/id :people must not be a VECTOR as in your case but a MAP and the ppl should be a property inside this map. Chang your append to something like :append [:component/id :people :people] To make it clearer, I would change the People ident to (fn [] [:component/id ::People]) (and the append to ... ::People people)

Timofey Sitnikov12:03:43

@U0522TWDA, OK that works, but I tripped a lot to get there. Do you think we can add a page to the community guides that simply shows this example with the view of Fulcro Inspect database? I added a pull request to the guides repo.

👀 1
Timofey Sitnikov12:03:03

Its just sometimes its hard to have a complete view on things.

Jakub Holý (HolyJak)12:03:29

What is the key misunderstanding you had that caused you the trouble to arrive to the correct solution?

Timofey Sitnikov12:03:44

My big challenge is trying to tie the app to the Fulcro Inspect DB. That is why I placed both on the page. Also, have a bird's eye view, overall view of the whole application is sometimes important.

Jakub Holý (HolyJak)19:03:57

What do you mean by "tie the app to F I DB"? Is it understanding the relation between the rendered Web page you see and the data (client DB) that generated it?

Timofey Sitnikov22:03:52

@U0522TWDA, yes, exactly, data locations and flow is confusing to me without seeing the whole picture.

Timofey Sitnikov23:03:10

@U0522TWDA, another question for you. Is it possible to remove routing and keep data in the same place? Below is my example, but the data is at different location as below. I would love to add this example to use cases as well, but there is a big jump of data location.

(ns app.client
  (:require
   [com.fulcrologic.fulcro.algorithms.merge :as merge]
   [com.fulcrologic.fulcro.application :as app]
   [com.fulcrologic.fulcro.components :as comp :refer [defsc]]
   [com.fulcrologic.fulcro.dom :as dom]))

; ------------------------------------------------------------------------------
(defsc Person [_this {:person/keys  [name city state] :as _props}]
  {:query   [:person/id 
             :person/name 
             :person/city 
             :person/state]
   :ident    :person/id}
  (dom/div (str "Name: " name ", City: " city ", State: " state)))

(def ui-person (comp/factory Person {:keyfn :person/id}))

; ------------------------------------------------------------------------------
(defsc People [_this {:keys [people] :as _props}]
  {:ident (fn [] [:component/id ::People])
   :query [{:people (comp/get-query Person)}]
   :route-segment ["people"]
   :initial-state {}}
  (dom/div {}
   (dom/h1 "People:") 
   (dom/ul (map ui-person people))))

(def ui-people (comp/factory People))

; ------------------------------------------------------------------------------
(defsc Root [_this {:keys [root]}] 
  {:query [{:root (comp/get-query People)}]
   :initial-state {}}
  (dom/div 
    (ui-people root)))

; ------------------------------------------------------------------------------
(defonce SPA (app/fulcro-app))

(defn ^:export init []
  (app/mount! SPA Root "app")
  (merge/merge-component! SPA Person {:person/id    1
                                      :person/name  "John Doe"
                                      :person/city  "New York"
                                      :person/state "New York"}
                        :append [:root :people])
  (merge/merge-component! SPA Person {:person/id    2
                                      :person/name  "Ken Smith"
                                      :person/city  "Los Angelos"
                                      :person/state "California"}
                        :append [:root :people])
  (merge/merge-component! SPA Person {:person/id    2})
  (merge/merge-component! SPA Person {:person/id    3
                                      :person/name  "Kate Middleton"
                                      :person/city  "London"
                                      :person/state "England"}
                        :append [:root :people]))

Jakub Holý (HolyJak)19:03:52

Hi! Sorry, I have not seen this question. Routing does not really change the structure (it just adds an extra edge for its own needs - see the img under https://blog.jakubholy.net/2020/fulcro-divergent-ui-data/#_inserting_a_stateful_ui_component_between_a_parent_child_entities So it should be perfectly possible