started working on validation on action form.

src/cljs/auto_ap/views/components/typeahead.cljs

@@ -2,7 +2,7 @@
   (:require [reagent.core :as r]
             [clojure.string :as str]))
 
-(defn typeahead [{:keys [matches on-change field value]}]
+(defn typeahead [{:keys [matches on-change field value class]}]
   (let [text (r/atom (or (second (first (filter #(= (first %) value) matches))) ""))
         highlighted (r/atom 0)
         selected (r/atom (first (first (filter #(= (first %) value) matches))))
@@ -12,19 +12,20 @@
                  (println [id t])
                  (when on-change
                    (on-change id)))]
-    (fn [{:keys [matches on-change field value]}]
+    (fn [{:keys [matches on-change field value class]}]
       (let [valid-matches (take 5 (for [[[id t :as match] i] (map vector  matches (range))
                                         :when (str/includes? (.toLowerCase t) (.toLowerCase @text))]
                                     match))]
         [:div.typeahead
          (if @selected
-           [:div.input
+           [:div.input {:class class}
             [:div.control
              [:div.tags.has-addons
               [:span.tag @text]
               [:a.tag.is-delete {:on-click (fn [] (select [nil ""]))}]]]]
            
            [:input.input {:type "text"
+                          :class class
                           :field [:vendor]
                           :value @text
                           :on-blur (fn [e]

src/cljs/auto_ap/views/pages/unpaid_invoices.cljs

@@ -3,6 +3,7 @@
             [reagent.core :as r]
             [clojure.string :as str]
             [auto-ap.entities.companies :as company]
+            [auto-ap.entities.invoice :as invoice]
             [auto-ap.entities.vendors :as vendor]
             [auto-ap.views.utils :refer [dispatch-event bind-field horizontal-field]]
             [auto-ap.utils :refer [by]]
@@ -280,6 +281,7 @@
                    :type "typeahead"
                    :field [:vendor-id]
                    :event change-event
+                   :spec ::invoice/vendor-id
                    :subscription data}]]]
      [horizontal-field
       [:label.label  "Date"]
@@ -287,6 +289,7 @@
        [:input.input {:type "text"
                       :field [:date]
                       :event change-event
+                      :spec ::invoice/date
                       :subscription data}]]]
 
      [horizontal-field
@@ -296,6 +299,7 @@
                    :type "typeahead"
                    :field [:company-id]
                    :event change-event
+                   :spec ::invoice/company-id
                    :subscription data}]]]
 
      [horizontal-field
@@ -304,6 +308,7 @@
        [:input.input {:type "text"
                       :field [:invoice-number]
                       :event change-event
+                      :spec ::invoice/invoice-number
                       :subscription data}]]]
 
      [horizontal-field
@@ -316,6 +321,7 @@
                         :field [:total]
                         :event change-event
                         :subscription data
+                        :spec ::invoice/total
                         :step "0.01"}]]]]]]))
 
 (def unpaid-invoices-page