From 6908cac000d7339b9ad8d2e851facfef5db5e3e6 Mon Sep 17 00:00:00 2001
From: "damian.przygodzki" <damian.przygodzki@jazzy.pro>
Date: Fri, 3 Mar 2017 12:15:09 +0100
Subject: [PATCH] #446 Errors indicators - refresh on focus

---
 src/components/widget/DatetimeRange.js |  2 +-
 src/components/widget/List/RawList.js  |  5 +--
 src/components/widget/Lookup/Lookup.js |  4 +--
 src/components/widget/RawWidget.js     | 42 ++++++++++++++++----------
 4 files changed, 32 insertions(+), 21 deletions(-)

diff --git a/src/components/widget/DatetimeRange.js b/src/components/widget/DatetimeRange.js
index 6bd551dfc..5130635c3 100644
--- a/src/components/widget/DatetimeRange.js
+++ b/src/components/widget/DatetimeRange.js
@@ -76,7 +76,7 @@ class DatetimeRange extends Component {
                 <button className={
                     'btn btn-block text-xs-left btn-meta-outline-secondary ' +
                     'btn-distance btn-sm input-icon-container input-primary ' +
-                    ((mandatory && !startDate && !endDate) ? 
+                    ((mandatory && !startDate && !endDate) ?
                         'input-mandatory ' : '') +
                     ((validStatus && !validStatus.valid) ?
                         'input-error ' : '')
diff --git a/src/components/widget/List/RawList.js b/src/components/widget/List/RawList.js
index 2ce570270..c79926a46 100644
--- a/src/components/widget/List/RawList.js
+++ b/src/components/widget/List/RawList.js
@@ -247,7 +247,7 @@ class RawList extends Component {
 
     render() {
         const {
-            list, rank, readonly, defaultValue, selected, align, updated, 
+            list, rank, readonly, defaultValue, selected, align, updated,
             loading, rowId, isModal, tabIndex, disabled, mandatory, validStatus
         } = this.props;
 
@@ -268,7 +268,8 @@ class RawList extends Component {
                     (rowId ? 'input-dropdown-container-static ' : '') +
                     ((rowId && !isModal) ? 'input-table ' : '') +
                     (validStatus &&
-                        !validStatus.valid ? 'input-error ' : '')
+                        !validStatus.valid &&
+                        !isOpen ? 'input-error ' : '')
                 }
             >
                 <div className={
diff --git a/src/components/widget/Lookup/Lookup.js b/src/components/widget/Lookup/Lookup.js
index 516039f43..5b4921e58 100644
--- a/src/components/widget/Lookup/Lookup.js
+++ b/src/components/widget/Lookup/Lookup.js
@@ -390,8 +390,8 @@ class Lookup extends Component {
                     (readonly ? 'input-disabled ' : '') +
                     (rowId ? 'input-dropdown-container-static ' : '') +
                     ((rowId && !isModal)? 'input-table ' : '') +
-                    (validStatus &&
-                        !validStatus.valid ? 'input-error ' : '')
+                    ((validStatus &&
+                        !validStatus.valid) ? 'input-error ' : '')
                 }
             >
                 <div className={
diff --git a/src/components/widget/RawWidget.js b/src/components/widget/RawWidget.js
index cf7c42b2c..682dad08c 100644
--- a/src/components/widget/RawWidget.js
+++ b/src/components/widget/RawWidget.js
@@ -53,7 +53,7 @@ class RawWidget extends Component {
         if(
             JSON.stringify(widgetData[0].value) !== JSON.stringify(value) ||
             JSON.stringify(widgetData[0].valueTo) !== JSON.stringify(valueTo) ||
-            (cachedValue !== null && 
+            (cachedValue !== null &&
                 (JSON.stringify(cachedValue) !== JSON.stringify(value)))
         ){
 
@@ -105,12 +105,16 @@ class RawWidget extends Component {
             widgetData, disabled, gridAlign, type, updated, rowId, isModal
         } = this.props;
 
+        const {isEdited} = this.state;
+
         return 'input-block ' +
             (icon ? 'input-icon-container ' : '') +
             (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
-            (widgetData[0].validStatus &&
-                !widgetData[0].validStatus.valid ? 'input-error ' : '') +
-            (widgetData[0].mandatory && 
+            ((widgetData[0].validStatus &&
+                !widgetData[0].validStatus.valid &&
+                !isEdited)  ? 'input-error ' : '') +
+            (widgetData[0].mandatory &&
+                widgetData[0].value &&
                 widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
             (gridAlign ? 'text-xs-' + gridAlign + ' ' : '') +
             (type === 'primary' ? 'input-primary ' : 'input-secondary ') +
@@ -129,7 +133,7 @@ class RawWidget extends Component {
     renderWidget = () => {
         const {
             handleChange, updated, isModal, filterWidget, filterId, id, range,
-            onHide, handleBackdropLock, subentity, subentityId, tabIndex, 
+            onHide, handleBackdropLock, subentity, subentityId, tabIndex,
             dropdownOpenCallback, autoFocus, fullScreen, widgetType, fields,
             windowType, dataId, type, widgetData, rowId, tabId, icon, gridAlign,
             entity, onShow, disabled, caption, viewId
@@ -138,7 +142,7 @@ class RawWidget extends Component {
         const {isEdited} = this.state;
 
         // TODO: API SHOULD RETURN THE SAME PROPERTIES FOR FILTERS
-        const widgetField = filterWidget ? 
+        const widgetField = filterWidget ?
             fields[0].parameterName : fields[0].field;
 
         switch(widgetType){
@@ -151,12 +155,12 @@ class RawWidget extends Component {
                         <DatetimeRange
                             onChange={(value, valueTo) =>
                                 this.handlePatch(widgetField,
-                                    value ? 
-                                        Moment(value).format(DATE_FORMAT) : 
+                                    value ?
+                                        Moment(value).format(DATE_FORMAT) :
                                         null,
                                     null,
-                                    valueTo ? 
-                                        Moment(valueTo).format(DATE_FORMAT) : 
+                                    valueTo ?
+                                        Moment(valueTo).format(DATE_FORMAT) :
                                         null
                                 )
                             }
@@ -183,7 +187,7 @@ class RawWidget extends Component {
                                     tabIndex: fullScreen ? -1 : tabIndex
                                 }}
                                 value={widgetData[0].value}
-                                onChange={(date) => 
+                                onChange={(date) =>
                                     handleChange(widgetField, date)}
                                 patch={(date) => this.handlePatch(
                                     widgetField,
@@ -477,16 +481,22 @@ class RawWidget extends Component {
                     <label
                         className={
                             'input-switch ' +
-                            (widgetData[0].readonly || disabled ? 'input-disabled ' : '') +
-                            (widgetData[0].mandatory && widgetData[0].value.length === 0 ? 'input-mandatory ' : '') +
-                            (validStatus &&
-                                !validStatus.valid ? 'input-error ' : '') +
+                            (widgetData[0].readonly || disabled ?
+                                'input-disabled ' : '') +
+                            (widgetData[0].mandatory &&
+                                widgetData[0].value.length === 0 ?
+                                    'input-mandatory ' : '') +
+                            (widgetData[0].validStatus &&
+                                !widgetData[0].validStatus.valid ?
+                                'input-error ' : '') +
                             (rowId && !isModal ? 'input-table ' : '')
                         }
                         tabIndex={fullScreen ? -1 : tabIndex}
                         ref={c => this.rawWidget = c}
                         onKeyDown={e => {e.key === ' ' &&
-                            this.handlePatch(widgetField, !widgetData[0].value, id)
+                            this.handlePatch(
+                                widgetField, !widgetData[0].value, id
+                            )
                         }}
                     >
                         <input