diff --git a/ui/resources/public/less/page/new-invoice.less b/ui/resources/public/less/page/new-invoice.less index db800143..ae5ded0f 100644 --- a/ui/resources/public/less/page/new-invoice.less +++ b/ui/resources/public/less/page/new-invoice.less @@ -95,9 +95,17 @@ } } - > .max-available > div { - display: inline; - margin-left: 0.3rem; + > .max-available { + &.not-enough { + color: red; + } + > div { + margin-bottom: 0.3rem; + > div { + display: inline; + margin-left: 0.3rem; + } + } } } diff --git a/ui/src/ethlance/ui/page/new_invoice.cljs b/ui/src/ethlance/ui/page/new_invoice.cljs index 09dbb3e2..10d848f4 100644 --- a/ui/src/ethlance/ui/page/new_invoice.cljs +++ b/ui/src/ethlance/ui/page/new_invoice.cljs @@ -74,6 +74,7 @@ no-job-selected? (nil? @*invoiced-job) focus-on-element (fn [id _event] (.focus (.getElementById js/document id))) validations (re/subscribe [:page.new-invoice/validations]) + enough-funding? (:invoice-amount-enough @validations) tx-in-progress? @(re/subscribe [:page.new-invoice/tx-in-progress?]) button-disabled? (not (every? true? (vals @validations)))] [c-main-layout {:container-opts {:class :new-invoice-main-container}} @@ -120,7 +121,12 @@ [:div.post-label token-display-name]] [:div.usd-estimate @estimated-usd] (when show-balance-left? - [:div.max-available "Max available:" [c-token-info balance-left job-token-details]])] + [:div.max-available + {:class (when-not enough-funding? "not-enough")} + [:div "Max available:" [c-token-info balance-left job-token-details]] + [:div.warning + {:style {:visibility (if enough-funding? "hidden" "visible")}} + "You cannot create an invoice that exceeds the available funds for the job."]])] [:div.right-form [:div.label "Message"] [c-textarea-input diff --git a/ui/src/ethlance/ui/page/new_invoice/subscriptions.cljs b/ui/src/ethlance/ui/page/new_invoice/subscriptions.cljs index ac921964..059a5673 100644 --- a/ui/src/ethlance/ui/page/new_invoice/subscriptions.cljs +++ b/ui/src/ethlance/ui/page/new_invoice/subscriptions.cljs @@ -64,8 +64,10 @@ :page.new-invoice/validations :<- [::form-fields] (fn [{:keys [invoiced-job invoice-amount]}] - (let [balance-left (get-in invoiced-job [:job :balance-left])] + (let [balance-left (get-in invoiced-job [:job :balance-left]) + positive-invoice-amount? (and (not (nil? (get invoice-amount :token-amount))) + (> (:token-amount invoice-amount) 0))] {:invoiced-job (not (nil? invoiced-job)) - :invoice-amount (and (not (nil? (get invoice-amount :token-amount))) - (> (:token-amount invoice-amount) 0) - (<= (:token-amount invoice-amount) balance-left))}))) + :invoice-amount positive-invoice-amount? + :invoice-amount-enough (or (not positive-invoice-amount?) + (<= (:token-amount invoice-amount) balance-left))})))