rose-ash/blog/sx/filters.sx

;; Blog filter components

(defcomp ~blog-action-button (&key (href :as string) (hx-select :as string) (btn-class :as string) (title :as string) (icon-class :as string) (label :as string))
  (a :href href :sx-get href :sx-target "#main-panel"
    :sx-select hx-select :sx-swap "outerHTML" :sx-push-url "true"
    :class btn-class :title title (i :class icon-class) label))

(defcomp ~blog-drafts-button (&key (href :as string) (hx-select :as string) (btn-class :as string) (title :as string) (label :as string) (draft-count :as number))
  (a :href href :sx-get href :sx-target "#main-panel"
    :sx-select hx-select :sx-swap "outerHTML" :sx-push-url "true"
    :class btn-class :title title (i :class "fa fa-file-text-o mr-1") " Drafts "
    (span :class "inline-block bg-stone-500 text-white px-1.5 py-0.5 text-xs font-medium rounded ml-1" draft-count)))

(defcomp ~blog-drafts-button-amber (&key href hx-select btn-class title label draft-count)
  (a :href href :sx-get href :sx-target "#main-panel"
    :sx-select hx-select :sx-swap "outerHTML" :sx-push-url "true"
    :class btn-class :title title (i :class "fa fa-file-text-o mr-1") " Drafts "
    (span :class "inline-block bg-amber-500 text-white px-1.5 py-0.5 text-xs font-medium rounded ml-1" draft-count)))

(defcomp ~blog-action-buttons-wrapper (&key inner)
  (div :class "flex flex-wrap gap-2 px-4 py-3" inner))

(defcomp ~blog-filter-any-topic (&key cls hx-select)
  (li (a :class (str "px-3 py-1 rounded border " cls)
    :sx-get "?page=1" :sx-target "#main-panel" :sx-select hx-select
    :sx-swap "outerHTML" :sx-push-url "true" "Any Topic")))

(defcomp ~blog-filter-group-icon-image (&key src name)
  (img :src src :alt name :class "h-6 w-6 rounded-full object-cover border border-stone-300 flex-shrink-0"))

(defcomp ~blog-filter-group-icon-color (&key style initial)
  (div :class "h-6 w-6 rounded-full text-[10px] font-semibold flex items-center justify-center border border-stone-300 flex-shrink-0" :style style initial))

(defcomp ~blog-filter-group-li (&key cls hx-get hx-select icon name count)
  (li (a :class (str "flex items-center gap-2 px-3 py-1 rounded border " cls)
    :sx-get hx-get :sx-target "#main-panel" :sx-select hx-select
    :sx-swap "outerHTML" :sx-push-url "true"
    icon
    (span :class "inline-block rounded-full bg-stone-100 text-stone-600 px-2 py-1 text-sm font-medium border border-stone-200" name)
    (span :class "flex-1")
    (span :class "inline-block bg-stone-100 text-stone-600 px-2 py-1 text-xs font-medium border border-stone-200" count))))

(defcomp ~blog-filter-nav (&key items)
  (nav :class "max-w-3xl mx-auto px-4 pb-4 flex flex-wrap gap-2 text-sm"
    (ul :class "divide-y flex flex-col gap-3" items)))

(defcomp ~blog-filter-any-author (&key cls hx-select)
  (li (a :class (str "px-3 py-1 rounded " cls)
    :sx-get "?page=1" :sx-target "#main-panel" :sx-select hx-select
    :sx-swap "outerHTML" :sx-push-url "true" "Any author")))

(defcomp ~blog-filter-author-icon (&key src name)
  (img :src src :alt name :class "h-5 w-5 rounded-full object-cover"))

(defcomp ~blog-filter-author-li (&key cls hx-get hx-select icon name count)
  (li (a :class (str "flex items-center gap-2 px-3 py-1 rounded " cls)
    :sx-get hx-get :sx-target "#main-panel" :sx-select hx-select
    :sx-swap "outerHTML" :sx-push-url "true"
    icon
    (span :class "text-stone-700" name)
    (span :class "flex-1")
    (span :class "inline-block bg-stone-100 text-stone-600 px-2 py-1 text-xs font-medium border border-stone-200" count))))

(defcomp ~blog-filter-summary (&key (text :as string))
  (span :class "text-sm text-stone-600" text))

;; Data-driven tag groups filter (replaces Python _tag_groups_filter_sx loop)
(defcomp ~blog-tag-groups-filter-from-data (&key groups selected-groups hx-select)
  (let* ((is-any (empty? (or selected-groups (list))))
         (any-cls (if is-any "bg-stone-900 text-white border-stone-900" "bg-white text-stone-600 border-stone-300 hover:bg-stone-50")))
    (~blog-filter-nav
      :items (<>
        (~blog-filter-any-topic :cls any-cls :hx-select hx-select)
        (map (lambda (g)
          (let* ((slug (get g "slug"))
                 (name (get g "name"))
                 (is-on (contains? selected-groups slug))
                 (cls (if is-on "bg-stone-900 text-white border-stone-900" "bg-white text-stone-600 border-stone-300 hover:bg-stone-50"))
                 (icon (if (get g "feature_image")
                   (~blog-filter-group-icon-image :src (get g "feature_image") :name name)
                   (~blog-filter-group-icon-color :style (get g "style") :initial (get g "initial")))))
            (~blog-filter-group-li :cls cls :hx-get (str "?group=" slug "&page=1") :hx-select hx-select
              :icon icon :name name :count (get g "count"))))
          (or groups (list)))))))

;; Data-driven authors filter (replaces Python _authors_filter_sx loop)
(defcomp ~blog-authors-filter-from-data (&key authors selected-authors hx-select)
  (let* ((is-any (empty? (or selected-authors (list))))
         (any-cls (if is-any "bg-stone-900 text-white border-stone-900" "bg-white text-stone-600 border-stone-300 hover:bg-stone-50")))
    (~blog-filter-nav
      :items (<>
        (~blog-filter-any-author :cls any-cls :hx-select hx-select)
        (map (lambda (a)
          (let* ((slug (get a "slug"))
                 (is-on (contains? selected-authors slug))
                 (cls (if is-on "bg-stone-900 text-white border-stone-900" "bg-white text-stone-600 border-stone-300 hover:bg-stone-50"))
                 (icon (when (get a "profile_image")
                   (~blog-filter-author-icon :src (get a "profile_image") :name (get a "name")))))
            (~blog-filter-author-li :cls cls :hx-get (str "?author=" slug "&page=1") :hx-select hx-select
              :icon icon :name (get a "name") :count (get a "count"))))
          (or authors (list)))))))