Clojurians Log v2

It’s strange. The router-props are an ident [:component/id :ns/component] to the target. Should they be a map? @tony.kay do you have any idea on how I can debug this further?

(defrouter AuthenticatedRouter [this {:keys [route-factory route-props]}]
  {:always-render-body? true
   :router-targets      [DashboardRoot CompanyRoot PersonRoot InvestorRoot]}
  (when route-factory
    (do
      (log/spy route-props)
      (route-factory route-props))))

(def ui-authenticated-router (comp/factory AuthenticatedRouter))

And the error is

timbre_support.cljs:80 ERROR [com.fulcrologic.fulcro.components:874] -  Props passed to fierce.pyxis.dashboard.ui/DashboardRoot are of the type PersistentVector instead of a map. Perhaps you meant to `map` the component over the props?

have to see more of the composition in code

(defsc AuthenticatedRoot [this {::keys   [router]
                                :ui/keys [sidebar mobile-sidebar]}]
  {:query         [::auth-root
                   {:ui/sidebar (comp/get-query sidebar/Sidebar)}
                   {:ui/mobile-sidebar (comp/get-query sidebar/MobileSidebar)}
                   {::router (comp/get-query router/AuthenticatedRouter)}
                   (uism/asm-ident ::router/AuthenticatedRouter)]

   :ident         (fn [] [:component/id ::auth-root])

   :initial-state (fn [_] {:ui/sidebar        {:ui/sub-sidebars [(dashboard-sidebar-items)
                                                                 (discover-sidebar-items)
                                                                 (account-sidebar-items)]
                                               :ui/account      (comp/get-initial-state account-ui/AccountRoot)}
                           :ui/mobile-sidebar {:ui/items                   mobile-main-sidebar
                                               ::account/name              "Kathrin Mutinelli"
                                               ::account/profile-image-url "/images/kathrin-mutinelli.jpg"
                                               ::organisation/name         "Stratico"
                                               :ui/dropdown-open?          false
                                               :ui/open?                   false}
                           ::router           {}})}
  (log/info router)
  (let [active-route (some-> (dr/current-route this this) first keyword)]
    (div {:className "h-screen flex overflow-hidden bg-white"}
      (sidebar/mobile-sidebar (assoc mobile-sidebar :ui/active-route active-route))
      (sidebar/sidebar (assoc sidebar :ui/active-route active-route))
      (router/ui-authenticated-router router))))

(def ui-authenticated-root (comp/factory AuthenticatedRoot))

That logs the router correctly, but when it passes the props through the router as route-props, it’s an ident.

so it is not working at all in latest, but works .4 back?

not just that it says an error, but that it is actually busted?

in that case, a minimal repro case and an issue would be ideal

I don’t think it’s working at all. The logging was added 17

Would I expect an error if it was working? Why would a route target receive an ident rather than props. That doesn’t sound correct.

Routing works, but I get that error on every route change.

@tony.kay Here it is https://gist.github.com/stuartrexking/89e92a917c36ad75cabc1b80be7d8bdc

It’s the authenticated flow that’s the problem.

line 70

do not pass an extra param to get-query

that disables dynamic query, which the router needs

I’ve pulled those components from various namespaces and was trying different things. I don’t have it in my actual code. The gist now reflects that.

Also, that component should prob have an ident, though technically not required. I’m guessing your extra arg to get-query is the problem

It’s not the problem.

Well, I’ve removed it and I still get the error.

OH

you’re using fn for initial state, but you’re using the magic notation…that won’t work

72

and 56

Looking..

you have to call get-initial-state just like get-query if you’re using a fn form for initial state

https://book.fulcrologic.com/#_step_1the_initial_state

and https://book.fulcrologic.com/#_initial_state_2

Rage Emoji.

Thanks Tony. Really appreciate it.

that fix it?

Just working through it but it looks like it.

initLocalState should not be used this way

you can use it in normal lifecycle methods…but initLocalState is sort of mixed into the low-level js constructor.

I/O, in general, should not, IMO, be tied to component lifecycle, either. Your data model and logic should drive the UI, not the other way around (the exception being a user-event which is obviously given to you from the UI). When you couple your data lifecycle with your UI component lifecycle you’re asking for trouble (or at least a lot of I/O you don’t need).

So, for example, a UI event triggers a route change. A route change calls will-enter (not a UI lifecycle, but a routing lifecycle…subtle but important difference). That, in turn, could trigger something on a UISM that is managing the overall mechanisms of your UI. This is basically how RAD does it: a form is just UI and event triggering on a UISM, where the overall life of the form is managed in logic/data.

Another way of saying it: tie your transactions and I/O to user driven things whenever possible. The user activated a route is different than some component on that route “appeared”.

they happen very closely in time, but are modeled in code very differently.

Am I using dr/change-route! wrong? Here’s what I’m doing:

;; Where I do it:
(dr/change-route! this (dr/path-to TagPage "my-id"))

;; My component
(defsc TagPage [this {:keys [node/id] :as rest}]
  {:ident :node/id
   :query [:node/id :node/name]
   :initial-state (fn [{:node/keys [id]}]
                    {:node/id id
                     :node/name ""})
   :route-segment ["page" :node-id]
   :will-enter (fn [_app {:keys [node-id]}]
                 (log/info "Here it is: " node-id)
                 (dr/route-immediate [:node/id node-id]))}
  ;; Render logic
)

;; The warning I'm getting:
[com.fulcrologic.fulcro.algorithms.indexing:103] - component .../TagPage's ident ([:node/id nil]) has a `nil` second element. This warning can be safely ignored if that is intended. Props were [:node/id "my-id"]