(ns lineup.components.edit.selector
  (:require
   [lineup.events :as events]
   [lineup.subs :as subs]
   [re-com.core :as re-com]
   [re-frame.core :as re-frame]))

(defn task-selector [which]
  (let [library-data (re-frame/subscribe [::subs/library])]
    [re-com/modal-panel
     :backdrop-on-click #(re-frame/dispatch [::events/select-selecting nil])
     :child
     [re-com/v-box
      :gap "10px"
      :align :center
      :children
      (concat
       [[re-com/title
         :label "Select an Activity"
         :level :level3]
        [:div "(TODO: search box here)"]]
       (map
        (fn [library-item]
          [re-com/h-box
           :gap "20px"
           :align :center
           :align-self :start
           :attr {:on-click #(re-frame/dispatch [::events/select-task which (:id library-item)])}
           :class "task-selector"
           :children
           [[re-com/box
             :width "50px"
             :height "50px"
             :max-width "50px"
             :max-height "50px"
             :justify :center
             :child
             [:img
              {:src (:image library-item)}]]
            [re-com/box
             :child
             [re-com/title
              :label (:name library-item)
              :level :level3]]]])
        @library-data))]]))
