Files
integreat/src/cljs/auto_ap/views/components/multi.cljs
2022-07-22 22:55:26 -07:00

82 lines
3.8 KiB
Clojure

(ns auto-ap.views.components.multi
(:require
[cemerick.url]
#_{:clj-kondo/ignore [:unused-namespace]}
[reagent.core :as reagent]
[react :as react]
[auto-ap.entities.shared :as shared]
[auto-ap.views.utils :refer [appearing-group]]
[auto-ap.forms.builder :as form-builder]))
;; TODO just embrace the fact that it will need to be remounted, and use index based keys
(defn multi-field-v2-internal [{:keys [template key-fn allow-change? disable-new? disable-remove? schema on-change disabled new-text] prop-value :value :as props} ]
(let [prop-value (if (seq prop-value)
prop-value
[])]
[form-builder/virtual-builder {:value prop-value
:schema schema
:on-change on-change}
[:fieldset {:disabled disabled}
[:div {:style {:margin-bottom "0.25em"}}
(into [(if key-fn
appearing-group
[:<>])]
(for [[i override] (map vector (range) prop-value)
:let [extant? (if key-fn
(boolean (key-fn override))
true)
is-disabled? (boolean (and (= false allow-change?)
extant?))]]
^{:key (or (when key-fn (key-fn override))
(::key override)
i)}
[form-builder/with-scope {:scope [i]}
^{:key (or (when key-fn (key-fn override))
(::key override)
i)}
[:div.level {:style {:margin-bottom "0.25em"}}
[:div.level-left {:style {:padding "0.5em 1em"}
:class (when-not extant?
"has-background-info-light")}
(let [template (if (fn? template)
(template override)
template)]
[:fieldset.level-left {:disabled is-disabled?
:style {:padding "0.5em 1em"}
:class (when-not extant?
"has-background-info-light")}
(for [[idx template] (map vector (range ) template)]
^{:key idx}
[:div.level-item
template])
(when-not (and disable-remove?
extant?)
[:div.level-item
[:a.button.level-item
{:disabled is-disabled?
:on-click (fn []
(on-change (into []
(for [[idx item] (map vector (range) prop-value)
:when (not= idx i)]
item))))}
[:span.icon [:span.icon-remove]]]])])
]]]))
(when-not disable-new?
[:button.button.is-outline
{:type "button"
:on-click (fn [e]
(on-change (conj prop-value {::key (random-uuid)}))
(.stopPropagation e)
(.preventDefault e))}
[:span.icon [:i.fa.fa-plus]]
[:span (or new-text "New")]])]]]))
(defn multi-field-v2 []
(into
[:f> multi-field-v2-internal
(reagent/props (reagent/current-component))]
(reagent/children (reagent/current-component))))