feat(grfn/bbbg): Add styling for active nav item r/3376

Change-Id: I5fbbd5ea6965d107cb9a44dff89ac77d0598c1f1
Reviewed-on: https://cl.tvl.fyi/c/depot/+/4588
Reviewed-by: grfn <grfn@gws.fyi>
Autosubmit: grfn <grfn@gws.fyi>
Tested-by: BuildkiteCI

3 files changed, 28 insertions, 7 deletions

diff --git a/users/grfn/bbbg/src/bbbg/handlers/core.clj b/users/grfn/bbbg/src/bbbg/handlers/core.clj
index d272064ec593..e30381de5bcf 100644
--- a/users/grfn/bbbg/src/bbbg/handlers/core.clj
+++ b/users/grfn/bbbg/src/bbbg/handlers/core.clj
@@ -3,7 +3,8 @@
    [bbbg.user :as user]
    [bbbg.views.flash :as flash]
    [hiccup.core :refer [html]]
-   [ring.util.response :refer [content-type response]]))
+   [ring.util.response :refer [content-type response]]
+   [clojure.string :as str]))
 
 (def ^:dynamic *authenticated?* false)
 
@@ -20,14 +21,29 @@
     (binding [*authenticated?* (authenticated? req)]
       (handler req))))
 
+(def ^:dynamic *current-uri*)
+
+(defn wrap-current-uri [handler]
+  (fn [req]
+    (binding [*current-uri* (:uri req)]
+      (handler req))))
+
+(defn nav-item [href label]
+  (let [active?
+        (when *current-uri*
+          (str/starts-with?
+           *current-uri*
+           href))]
+    [:li {:class (when active? "active")}
+     [:a {:href href}
+      label]]))
+
 (defn global-nav []
   [:nav.global-nav
    [:ul
-    [:li [:a {:href "/events"}
-          "Events"]]
+    (nav-item "/events" "Events")
     (when *authenticated?*
-      [:li [:a {:href "/attendees"}
-            "Attendees"]])
+      (nav-item "/attendees" "Attendees"))
     [:li.spacer]
     [:li
      (if *authenticated?*
diff --git a/users/grfn/bbbg/src/bbbg/styles.clj b/users/grfn/bbbg/src/bbbg/styles.clj
index 408c1cf01576..37c1aa901c6b 100644
--- a/users/grfn/bbbg/src/bbbg/styles.clj
+++ b/users/grfn/bbbg/src/bbbg/styles.clj
@@ -69,6 +69,10 @@
      [(& hover)
       {:color blue}]]
 
+   [:li.active
+    {:font-weight "bold"
+     :border-bottom [["1px" "solid" black]]}]
+
    [:.spacer
     {:flex 1}]])
 
diff --git a/users/grfn/bbbg/src/bbbg/web.clj b/users/grfn/bbbg/src/bbbg/web.clj
index bb47efbdadbe..714c5c98370c 100644
--- a/users/grfn/bbbg/src/bbbg/web.clj
+++ b/users/grfn/bbbg/src/bbbg/web.clj
@@ -3,7 +3,7 @@
    [bbbg.discord.auth :as discord.auth :refer [wrap-discord-auth]]
    [bbbg.handlers.attendee-checks :as attendee-checks]
    [bbbg.handlers.attendees :as attendees]
-   [bbbg.handlers.core :refer [wrap-dynamic-auth]]
+   [bbbg.handlers.core :refer [wrap-dynamic-auth wrap-current-uri]]
    [bbbg.handlers.events :as events]
    [bbbg.handlers.home :as home]
    [bbbg.handlers.signup-form :as signup-form]
@@ -23,7 +23,7 @@
    [ring.middleware.resource :refer [wrap-resource]]
    [ring.middleware.session :refer [wrap-session]]
    [ring.middleware.session.cookie :refer [cookie-store]]
-   [ring.util.response :refer [content-type resource-response response]]
+   [ring.util.response :refer [content-type response]]
    [clojure.java.io :as io])
   (:import
    java.util.Base64))
@@ -89,6 +89,7 @@
 (defn middleware [app env]
   (-> app
       (wrap-resource "public")
+      wrap-current-uri
       wrap-dynamic-auth
       (wrap-discord-auth env)
       wrap-keyword-params