1 files changed, 92 insertions, 59 deletions
diff --git a/openecomp-ui/src/nfvo-components/datepicker/Datepicker.jsx b/openecomp-ui/src/nfvo-components/datepicker/Datepicker.jsx
index 25e7e7e02d..b4bc8be9ec 100644
--- a/openecomp-ui/src/nfvo-components/datepicker/Datepicker.jsx
+++ b/openecomp-ui/src/nfvo-components/datepicker/Datepicker.jsx
@@ -5,72 +5,105 @@ import moment from 'moment';
 import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
 
 class CustomInput extends React.Component {
+    static propTypes = {
+        placeHolderText: PropTypes.string,
+        onChange: PropTypes.func,
+        onClick: PropTypes.func,
+        value: PropTypes.string
+    };
 
-	static propTypes = {
-		placeHolderText: PropTypes.string,
-		onChange: PropTypes.func,
-		onClick: PropTypes.func,
-		value: PropTypes.string
-	};
-
-	render() {
-		const {placeholderText, onClick, onClear, inputRef, value: date} = this.props;
-		const text = date ? date : placeholderText;
-		const textStyle = date ? '' : 'placeholder';
-		return (
-			<div onClick={onClick} ref={inputRef} className='datepicker-custom-input'>
-				<div  className={`datepicker-text ${textStyle}`}>{text}</div>
-				{date && <SVGIcon onClick={e => {e.stopPropagation(); onClear();}} name='close' className='clear-input'/>}
-				<SVGIcon name='calendar'/>
-			</div>
-		);
-	}
-};
+    render() {
+        const {
+            placeholderText,
+            onClick,
+            onClear,
+            inputRef,
+            value: date
+        } = this.props;
+        const text = date ? date : placeholderText;
+        const textStyle = date ? '' : 'placeholder';
+        return (
+            <div
+                onClick={onClick}
+                ref={inputRef}
+                className="datepicker-custom-input">
+                <div className={`datepicker-text ${textStyle}`}>{text}</div>
+                {date && (
+                    <SVGIcon
+                        onClick={e => {
+                            e.stopPropagation();
+                            onClear();
+                        }}
+                        name="close"
+                        className="clear-input"
+                    />
+                )}
+                <SVGIcon name="calendar" />
+            </div>
+        );
+    }
+}
 
 const parseDate = (date, format) => {
-	return typeof date === 'number' ? moment.unix(date) : moment(date, format);
+    return typeof date === 'number' ? moment.unix(date) : moment(date, format);
 };
 
 class Datepicker extends React.Component {
-	static propTypes = {
-		date: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-		format: PropTypes.string,
-		onChange: PropTypes.func,
-		selectsStart: PropTypes.bool,
-		selectsEnd: PropTypes.bool,
-		startDate: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-		endDate: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-		disabled: PropTypes.bool,
-		label: PropTypes.string,
-		isRequired: PropTypes.bool
-	}
-	render() {
-		let {date,  format, onChange, selectsStart = false, startDate = null, endDate = null, selectsEnd = false,
-			disabled = false, inputRef} = this.props;
-		const placeholderText =  'Enter a date';
-		const props = {
-			format,
-			onChange,
-			disabled,
-			selected: date ? parseDate(date, format) : date,
-			selectsStart,
-			selectsEnd,
-			placeholderText,
-			startDate: startDate ? parseDate(startDate, format) : startDate,
-			endDate: endDate ? parseDate(endDate, format) : endDate
-		};
+    static propTypes = {
+        date: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+        format: PropTypes.string,
+        onChange: PropTypes.func,
+        selectsStart: PropTypes.bool,
+        selectsEnd: PropTypes.bool,
+        startDate: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+        endDate: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+        disabled: PropTypes.bool,
+        label: PropTypes.string,
+        isRequired: PropTypes.bool
+    };
+    render() {
+        let {
+            date,
+            format,
+            onChange,
+            selectsStart = false,
+            startDate = null,
+            endDate = null,
+            selectsEnd = false,
+            disabled = false,
+            inputRef
+        } = this.props;
+        const placeholderText = 'Enter a date';
+        const props = {
+            format,
+            onChange,
+            disabled,
+            selected: date ? parseDate(date, format) : date,
+            selectsStart,
+            selectsEnd,
+            placeholderText,
+            startDate: startDate ? parseDate(startDate, format) : startDate,
+            endDate: endDate ? parseDate(endDate, format) : endDate
+        };
 
-		return (
-			<div className='customized-date-picker'>
-				<DatePicker
-					calendarClassName='customized-date-picker-calendar'
-					customInput={<CustomInput inputRef={inputRef} onClear={() => onChange(undefined)} placeholderText={placeholderText}/>}
-					minDate={selectsEnd && props.startDate}
-					maxDate={selectsStart && props.endDate}
-					{...props}/>
-			</div>
-		);
-	}
+        return (
+            <div className="customized-date-picker">
+                <DatePicker
+                    calendarClassName="customized-date-picker-calendar"
+                    customInput={
+                        <CustomInput
+                            inputRef={inputRef}
+                            onClear={() => onChange(undefined)}
+                            placeholderText={placeholderText}
+                        />
+                    }
+                    minDate={selectsEnd && props.startDate}
+                    maxDate={selectsStart && props.endDate}
+                    {...props}
+                />
+            </div>
+        );
+    }
 }
 
 export default Datepicker;