reitit_nested_routing.cljs

(defn router-component [match]
  (let [[view-component & nested-view-components] (:views match)]
    (if view-component
      [view-component (assoc match :views nested-view-components)])))

(defn topics-view [match]
  [:div
   [:div "List of topics..."]
   ;; Nested router, renders nothing or topic-view if in :topic
   [router-component match]])
   
(def topic-view [match]
  [:h1 "Topic"])

(def router
  (rf/router
    [["/" {:name :frontpage
           :views [frontpage-view]}]
     ["/topics"
      {:views [topics-view]}
      [""
       {:name :topics}
      ["/:id"
       {:name :topic
        :viwes [topic-view]}]]]))

(defn main-view [match]
  ;; for :topic-view, :views is [topics-view topic-view]
  ;; first router renders topics-view, and calls the component with match with updated :views list
  ;; nested router renders the next view component etc.
  [router-component match])

;; Notes:
;; All components need to now take match as parameter
;; Could be possible to use React context or something