Merge pull request #108 from metosin/frontend-routing-easy

Add easy-simple wrapper over frontend router

examples/frontend-controllers/src/frontend/core.cljs

@@ -2,15 +2,13 @@
     (:require [reagent.core :as r]
               [reitit.core :as re]
               [reitit.frontend :as rf]
-              [reitit.frontend.history :as rfh]
+              [reitit.frontend.easy :as rfe]
               [reitit.frontend.controllers :as rfc]
               [reitit.coercion :as rc]
               [reitit.coercion.schema :as rsc]
               [schema.core :as s]
               [fipp.edn :as fedn]))
 
-(defonce history (atom nil))
-
 (defn home-page []
   [:div
    [:h2 "Welcome to frontend"]
@@ -21,8 +19,8 @@
         {:keys [id]} path]
     [:div
      [:ul
-      [:li [:a {:href (rfh/href @history ::item {:id 1})} "Item 1"]]
+      [:li [:a {:href (rfe/href ::item {:id 1})} "Item 1"]]
-      [:li [:a {:href (rfh/href @history ::item {:id 2} {:foo "bar"})} "Item 2"]]]
+      [:li [:a {:href (rfe/href ::item {:id 2} {:foo "bar"})} "Item 2"]]]
      (if id
        [:h2 "Selected item " id])
      (if (:foo query)
@@ -33,9 +31,9 @@
 (defn current-page []
   [:div
    [:ul
-    [:li [:a {:href (rfh/href @history ::frontpage)} "Frontpage"]]
+    [:li [:a {:href (rfe/href ::frontpage)} "Frontpage"]]
     [:li
-     [:a {:href (rfh/href @history ::item-list)} "Item list"]
+     [:a {:href (rfe/href ::item-list)} "Item list"]
      ]]
    (if @match
      (let [view (:view (:data @match))]
@@ -80,16 +78,14 @@
             :coercion rsc/coercion}}))
 
 (defn init! []
-  (swap! history (fn [old-history]
+  (rfe/start!
-                   (rfh/stop! old-history)
-                   (rfh/start!
     routes
     (fn [new-match]
       (swap! match (fn [old-match]
                      (if new-match
                        (assoc new-match :controllers (rfc/apply-controllers (:controllers old-match) new-match))))))
     {:use-fragment true
-                      :path-prefix "/"})))
+     :path-prefix "/"})
   (r/render [current-page] (.getElementById js/document "app")))
 
 (init!)

examples/frontend/src/frontend/core.cljs

@@ -2,14 +2,12 @@
     (:require [reagent.core :as r]
               [reitit.core :as re]
               [reitit.frontend :as rf]
-              [reitit.frontend.history :as rfh]
+              [reitit.frontend.easy :as rfe]
               [reitit.coercion :as rc]
               [reitit.coercion.schema :as rsc]
               [schema.core :as s]
               [fipp.edn :as fedn]))
 
-(defonce history (atom nil))
-
 (defn home-page []
   [:div
    [:h2 "Welcome to frontend"]])
@@ -19,8 +17,8 @@
    [:h2 "About frontend"]
    [:ul
     [:li [:a {:href "http://google.com"} "external link"]]
-    [:li [:a {:href (rfh/href @history ::foobar)} "Missing route"]]
+    [:li [:a {:href (rfe/href ::foobar)} "Missing route"]]
-    [:li [:a {:href (rfh/href @history ::item)} "Missing route params"]]]])
+    [:li [:a {:href (rfe/href ::item)} "Missing route params"]]]])
 
 (defn item-page [match]
   (let [{:keys [path query]} (:parameters match)
@@ -35,10 +33,10 @@
 (defn current-page []
   [:div
    [:ul
-    [:li [:a {:href (rfh/href @history ::frontpage)} "Frontpage"]]
+    [:li [:a {:href (rfe/href ::frontpage)} "Frontpage"]]
-    [:li [:a {:href (rfh/href @history ::about)} "About"]]
+    [:li [:a {:href (rfe/href ::about)} "About"]]
-    [:li [:a {:href (rfh/href @history ::item {:id 1})} "Item 1"]]
+    [:li [:a {:href (rfe/href ::item {:id 1})} "Item 1"]]
-    [:li [:a {:href (rfh/href @history ::item {:id 2} {:foo "bar"})} "Item 2"]]]
+    [:li [:a {:href (rfe/href ::item {:id 2} {:foo "bar"})} "Item 2"]]]
    (if @match
      (let [view (:view (:data @match))]
        [view @match]))
@@ -62,12 +60,10 @@
      :data {:coercion rsc/coercion}}))
 
 (defn init! []
-  (swap! history (fn [old-history]
+  (rfe/start! routes
-                   (rfh/stop! old-history)
-                   (rfh/start! routes
               (fn [m] (reset! match m))
               {:use-fragment true
-                                :path-prefix "/"})))
+               :path-prefix "/"})
   (r/render [current-page] (.getElementById js/document "app")))
 
 (init!)

modules/reitit-frontend/src/reitit/frontend/easy.cljs

@@ -0,0 +1,39 @@
+(ns reitit.frontend.easy
+  "Easy wrapper over reitit.frontend.history,
+  handling the state. Only one router can be active
+  at a time."
+  (:require [reitit.frontend.history :as rfh]))
+
+(defonce history (atom nil))
+
+(defn start!
+  [routes on-navigate opts]
+  (swap! history (fn [old-history]
+                   (rfh/stop! old-history)
+                   (rfh/start! routes on-navigate opts))))
+
+(defn href
+  ([k]
+   (rfh/href @history k))
+  ([k params]
+   (rfh/href @history k params))
+  ([k params query]
+   (rfh/href @history k params query)))
+
+(defn set-token
+  "Sets the new route, leaving previous route in history."
+  ([k]
+   (rfh/set-token @history k))
+  ([k params]
+   (rfh/set-token @history k params))
+  ([k params query]
+   (rfh/set-token @history k params query)))
+
+(defn replace-token
+  "Replaces current route. I.e. current route is not left on history."
+  ([k]
+   (rfh/replace-token @history k))
+  ([k params]
+   (rfh/replace-token @history k params))
+  ([k params query]
+   (rfh/replace-token @history k params query)))

modules/reitit-frontend/src/reitit/frontend/history.cljs

@@ -138,6 +138,8 @@
 
 (defn set-token
   "Sets the new route, leaving previous route in history."
+  ([state k]
+   (set-token state k nil))
   ([state k params]
    (set-token state k params nil))
   ([{:keys [router history]} k params query]
@@ -147,6 +149,8 @@
 
 (defn replace-token
   "Replaces current route. I.e. current route is not left on history."
+  ([state k]
+   (replace-token state k nil))
   ([state k params]
    (replace-token state k params nil))
   ([{:keys [router history]} k params query]