Adding Prettier and fixing up eslint version

Issue-ID: SDC-1094
Change-Id: Ie83ad95a03899345dd90235daf0323cbe3bc6afd
Signed-off-by: Einav Weiss Keidar <einavw@amdocs.com>

6 files changed, 228 insertions, 137 deletions

diff --git a/openecomp-ui/src/sdc-app/common/activity-log/ActivityLog.js b/openecomp-ui/src/sdc-app/common/activity-log/ActivityLog.js
index a1ad437f5b..2978cacda4 100644
--- a/openecomp-ui/src/sdc-app/common/activity-log/ActivityLog.js
+++ b/openecomp-ui/src/sdc-app/common/activity-log/ActivityLog.js
@@ -13,16 +13,28 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import {connect} from 'react-redux';
+import { connect } from 'react-redux';
 import ActivityLogView from './ActivityLogView.jsx';
 
-export const mapStateToProps = ({users: {usersList}, licenseModel: {activityLog}}) => {
-
-	let activities = activityLog;
-	return {
-		activities: activities.map(activity => ({...activity, user: {id: activity.user, name: usersList.find(userObject => userObject.userId === activity.user).fullName}})),
-		usersList
-	};
+export const mapStateToProps = ({
+    users: { usersList },
+    licenseModel: { activityLog }
+}) => {
+    let activities = activityLog;
+    return {
+        activities: activities.map(activity => ({
+            ...activity,
+            user: {
+                id: activity.user,
+                name: usersList.find(
+                    userObject => userObject.userId === activity.user
+                ).fullName
+            }
+        })),
+        usersList
+    };
 };
 
-export default connect(mapStateToProps, undefined, null, {withRef: true})(ActivityLogView);
+export default connect(mapStateToProps, undefined, null, { withRef: true })(
+    ActivityLogView
+);
diff --git a/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogActionHelper.js b/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogActionHelper.js
index 729d8fb5f3..6856b08c8b 100644
--- a/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogActionHelper.js
+++ b/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogActionHelper.js
@@ -17,8 +17,13 @@ import ActivityLogConstants from './ActivityLogConstants.js';
 import ItemHelper from 'sdc-app/common/helpers/ItemsHelper.js';
 
 export default {
-
-	fetchActivityLog(dispatch, {itemId, versionId}){
-		return ItemHelper.fetchActivityLog({itemId, versionId}).then(response => dispatch({type: ActivityLogConstants.ACTIVITY_LOG_UPDATED, response}));
-	}
+    fetchActivityLog(dispatch, { itemId, versionId }) {
+        return ItemHelper.fetchActivityLog({ itemId, versionId }).then(
+            response =>
+                dispatch({
+                    type: ActivityLogConstants.ACTIVITY_LOG_UPDATED,
+                    response
+                })
+        );
+    }
 };
diff --git a/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogConstants.js b/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogConstants.js
index 69faf7cbb6..2da3c7799e 100644
--- a/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogConstants.js
+++ b/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogConstants.js
@@ -16,8 +16,5 @@
 import keyMirror from 'nfvo-utils/KeyMirror.js';
 
 export default keyMirror({
-
-	ACTIVITY_LOG_UPDATED: null
-
+    ACTIVITY_LOG_UPDATED: null
 });
-
diff --git a/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogReducer.js b/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogReducer.js
index fc3dfa1515..418a9b9e3d 100644
--- a/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogReducer.js
+++ b/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogReducer.js
@@ -16,10 +16,10 @@
 import ActivityLogConstants from './ActivityLogConstants.js';
 
 export default (state = [], action) => {
-	switch (action.type) {
-		case ActivityLogConstants.ACTIVITY_LOG_UPDATED:
-			return [...action.response.results];
-	}
+    switch (action.type) {
+        case ActivityLogConstants.ACTIVITY_LOG_UPDATED:
+            return [...action.response.results];
+    }
 
-	return state;
+    return state;
 };
diff --git a/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogView.jsx b/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogView.jsx
index 5b8c29b719..d65e667163 100644
--- a/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogView.jsx
+++ b/openecomp-ui/src/sdc-app/common/activity-log/ActivityLogView.jsx
@@ -13,7 +13,7 @@
  * or implied. See the License for the specific language governing
  * permissions and limitations under the License.
  */
-import React, {Component} from 'react';
+import React, { Component } from 'react';
 import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger.js';
 import Tooltip from 'react-bootstrap/lib/Tooltip.js';
 import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx';
@@ -21,108 +21,177 @@ import SVGIcon from 'sdc-ui/lib/react/SVGIcon.js';
 import i18n from 'nfvo-utils/i18n/i18n.js';
 import LogDetails from './LogixUtil.jsx';
 
-function ActivityLogSortableCellHeader({isHeader, data, isDes, onSort}) {
-	//TODO check icon sdc-ui
-	if (isHeader) {
-		return (
-			<span className='date-header' onClick={onSort}>
-				<span>{data}</span>
-				<span className={`header-sort-arrow ${isDes ? 'up' : 'down'}`}></span>
-			</span>
-		);
-	}
-	return (
-		<span className='date-cell'>
-			<span>{i18n.dateNormal(data, {
-				year: 'numeric', month: 'numeric', day: 'numeric'
-			})}</span>
-			<span>{i18n.dateNormal(data, {
-				hour: 'numeric', minute: 'numeric',
-				hour12: true
-			})}</span>
-		</span>
-	);
+function ActivityLogSortableCellHeader({ isHeader, data, isDes, onSort }) {
+    //TODO check icon sdc-ui
+    if (isHeader) {
+        return (
+            <span className="date-header" onClick={onSort}>
+                <span>{data}</span>
+                <span
+                    className={`header-sort-arrow ${isDes ? 'up' : 'down'}`}
+                />
+            </span>
+        );
+    }
+    return (
+        <span className="date-cell">
+            <span>
+                {i18n.dateNormal(data, {
+                    year: 'numeric',
+                    month: 'numeric',
+                    day: 'numeric'
+                })}
+            </span>
+            <span>
+                {i18n.dateNormal(data, {
+                    hour: 'numeric',
+                    minute: 'numeric',
+                    hour12: true
+                })}
+            </span>
+        </span>
+    );
 }
 
-function ActivityLogStatus({status, isHeader}) {
-	if (isHeader) {
-		return <span>{status}</span>;
-	}
-	let {message, success} = status;
-	return (
-		<span>
-			<span className={`status-icon ${success}`}>{`${success ? i18n('Success') : i18n('Failure')}`}</span>
-			{success && <SVGIcon name='checkCircle' color='positive'/>}
-			{!success && <OverlayTrigger placement='bottom' overlay={<Tooltip className='activity-log-message-tooltip' id={'activity-log-message-tooltip'}>
-				<div className='message-block'>{message}</div>
-			</Tooltip>}>
-				<span className='message-further-info-icon'>{'?'}</span>
-			</OverlayTrigger>}
-		</span>
-	);
+function ActivityLogStatus({ status, isHeader }) {
+    if (isHeader) {
+        return <span>{status}</span>;
+    }
+    let { message, success } = status;
+    return (
+        <span>
+            <span className={`status-icon ${success}`}>{`${
+                success ? i18n('Success') : i18n('Failure')
+            }`}</span>
+            {success && <SVGIcon name="checkCircle" color="positive" />}
+            {!success && (
+                <OverlayTrigger
+                    placement="bottom"
+                    overlay={
+                        <Tooltip
+                            className="activity-log-message-tooltip"
+                            id={'activity-log-message-tooltip'}>
+                            <div className="message-block">{message}</div>
+                        </Tooltip>
+                    }>
+                    <span className="message-further-info-icon">{'?'}</span>
+                </OverlayTrigger>
+            )}
+        </span>
+    );
 }
 
-export function ActivityListItem({activity, isHeader, isDes, onSort}) {
-	let {type, timestamp, comment, user, status} = activity;
-	return (
-		<li className={`activity-list-item ${isHeader ? 'header' : ''}`} data-test-id='activity-list-item'>
-			<div className='table-cell activity-date' data-test-id='activity-date'><ActivityLogSortableCellHeader isHeader={isHeader} data={timestamp} isDes={isDes} onSort={onSort}/></div>
-			<div className='table-cell activity-action' data-test-id='activity-action'>{i18n(type)}</div>
-			<div className='table-cell activity-comment' title={isHeader ? '' : comment} data-test-id='activity-comment'><span>{i18n(comment)}</span></div>
-			<div className='table-cell activity-username' data-test-id='activity-username'>{isHeader ? i18n(activity.user) : `${i18n(user.name)} (${user.id})`}</div>
-			<div className='table-cell activity-status' data-test-id='activity-status'><ActivityLogStatus isHeader={isHeader} status={status}/></div>
-		</li>
-	);
+export function ActivityListItem({ activity, isHeader, isDes, onSort }) {
+    let { type, timestamp, comment, user, status } = activity;
+    return (
+        <li
+            className={`activity-list-item ${isHeader ? 'header' : ''}`}
+            data-test-id="activity-list-item">
+            <div
+                className="table-cell activity-date"
+                data-test-id="activity-date">
+                <ActivityLogSortableCellHeader
+                    isHeader={isHeader}
+                    data={timestamp}
+                    isDes={isDes}
+                    onSort={onSort}
+                />
+            </div>
+            <div
+                className="table-cell activity-action"
+                data-test-id="activity-action">
+                {i18n(type)}
+            </div>
+            <div
+                className="table-cell activity-comment"
+                title={isHeader ? '' : comment}
+                data-test-id="activity-comment">
+                <span>{i18n(comment)}</span>
+            </div>
+            <div
+                className="table-cell activity-username"
+                data-test-id="activity-username">
+                {isHeader
+                    ? i18n(activity.user)
+                    : `${i18n(user.name)} (${user.id})`}
+            </div>
+            <div
+                className="table-cell activity-status"
+                data-test-id="activity-status">
+                <ActivityLogStatus isHeader={isHeader} status={status} />
+            </div>
+        </li>
+    );
 }
 
 class ActivityLogView extends Component {
+    state = {
+        localFilter: '',
+        sortDescending: true
+    };
 
-	state = {
-		localFilter: '',
-		sortDescending: true
-	};
+    render() {
+        return (
+            <div className="activity-log-view">
+                <LogDetails display={this.state.localFilter} />
+                <ListEditorView
+                    title={i18n('Activity Log')}
+                    filterValue={this.state.localFilter}
+                    onFilter={filter => this.setState({ localFilter: filter })}>
+                    <ActivityListItem
+                        activity={{
+                            timestamp: 'Date',
+                            type: 'Action',
+                            comment: 'Comment',
+                            user: 'Username',
+                            status: 'Status'
+                        }}
+                        isDes={this.state.sortDescending}
+                        onSort={() =>
+                            this.setState({
+                                sortDescending: !this.state.sortDescending
+                            })
+                        }
+                        isHeader
+                    />
+                    {this.sortActivities(
+                        this.filterActivities(),
+                        this.state.sortDescending
+                    ).map(activity => (
+                        <ActivityListItem
+                            key={activity.id}
+                            activity={activity}
+                        />
+                    ))}
+                </ListEditorView>
+            </div>
+        );
+    }
 
-	render() {
-		return (
-			<div className='activity-log-view'>
-				<LogDetails display={this.state.localFilter}/>
-				<ListEditorView
-					title={i18n('Activity Log')}
-					filterValue={this.state.localFilter}
-					onFilter={filter => this.setState({localFilter: filter})}>
-					<ActivityListItem
-						activity={{timestamp: 'Date', type: 'Action', comment: 'Comment', user: 'Username', status: 'Status'}}
-						isDes={this.state.sortDescending}
-						onSort={() => this.setState({sortDescending: !this.state.sortDescending})}
-						isHeader/>
-					{this.sortActivities(this.filterActivities(), this.state.sortDescending).map(activity => <ActivityListItem key={activity.id} activity={activity}/>)}
-				</ListEditorView>
-			</div>
-		);
-	}
-
-	filterActivities() {
-		let {activities} = this.props;
-		let {localFilter} = this.state;
-		if (localFilter.trim()) {
-			const filter = new RegExp(escape(localFilter), 'i');
-			return activities.filter(({user = {id: '', name: ''}, comment = '', type = ''}) =>
-			escape(user.id).match(filter) || escape(user.name).match(filter) || escape(comment).match(filter) || escape(type).match(filter));
-		}
-		else {
-			return activities;
-		}
-	}
-
-	sortActivities(activities) {
-		if (this.state.sortDescending) {
-			return activities.sort((a, b) => a.timestamp - b.timestamp);
-		}
-		else {
-			return activities.reverse();
-		}
-	}
+    filterActivities() {
+        let { activities } = this.props;
+        let { localFilter } = this.state;
+        if (localFilter.trim()) {
+            const filter = new RegExp(escape(localFilter), 'i');
+            return activities.filter(
+                ({ user = { id: '', name: '' }, comment = '', type = '' }) =>
+                    escape(user.id).match(filter) ||
+                    escape(user.name).match(filter) ||
+                    escape(comment).match(filter) ||
+                    escape(type).match(filter)
+            );
+        } else {
+            return activities;
+        }
+    }
 
+    sortActivities(activities) {
+        if (this.state.sortDescending) {
+            return activities.sort((a, b) => a.timestamp - b.timestamp);
+        } else {
+            return activities.reverse();
+        }
+    }
 }
 
 export default ActivityLogView;
diff --git a/openecomp-ui/src/sdc-app/common/activity-log/LogixUtil.jsx b/openecomp-ui/src/sdc-app/common/activity-log/LogixUtil.jsx
index bd40e113e9..0dbf518768 100644
--- a/openecomp-ui/src/sdc-app/common/activity-log/LogixUtil.jsx
+++ b/openecomp-ui/src/sdc-app/common/activity-log/LogixUtil.jsx
@@ -1,28 +1,36 @@
-import React, {Component} from 'react';
-// eslint-disable-next-line max-len
-const style = 'LnJhYmJpdHt3aWR0aDo1ZW07aGVpZ2h0OjNlbTtiYWNrZ3JvdW5kOiM5OTk7Ym9yZGVyLXJhZGl1czo3MCUgOTAlIDYwJSA1MCU7cG9zaXRpb246cmVsYXRpdmU7LW1vei10cmFuc2Zvcm06cm90YXRlKDApIHRyYW5zbGF0ZSgtMmVtLDApOy1tcy10cmFuc2Zvcm06cm90YXRlKDApIHRyYW5zbGF0ZSgtMmVtLDApOy13ZWJraXQtdHJhbnNmb3JtOnJvdGF0ZSgwKSB0cmFuc2xhdGUoLTJlbSwwKTt0cmFuc2Zvcm06cm90YXRlKDApIHRyYW5zbGF0ZSgtMmVtLDApO2FuaW1hdGlvbjpob3AgMXMgaW5maW5pdGUgbGluZWFyO3otaW5kZXg6MX0ucmFiYml0OmFmdGVyLC5yYWJiaXQ6YmVmb3Jle2NvbnRlbnQ6IiI7cG9zaXRpb246YWJzb2x1dGU7YmFja2dyb3VuZDojZjFmMWYxfS5uby1mbGV4Ym94IC5yYWJiaXR7bWFyZ2luOjEwZW0gYXV0byAwfS5yYWJiaXQ6YmVmb3Jle3dpZHRoOjFlbTtoZWlnaHQ6MWVtO2JvcmRlci1yYWRpdXM6MTAwJTt0b3A6LjVlbTtsZWZ0Oi0uM2VtO2JveC1zaGFkb3c6NGVtIC40ZW0gMCAtLjM1ZW0gIzNmMzMzNCwuNWVtIDFlbSAwICNmMWYxZjEsNGVtIDFlbSAwIC0uM2VtICNmMWYxZjEsNGVtIDFlbSAwIC0uM2VtICNmMWYxZjEsNGVtIDFlbSAwIC0uNGVtICNmMWYxZjE7YW5pbWF0aW9uOmtpY2sgMXMgaW5maW5pdGUgbGluZWFyfS5yYWJiaXQ6YWZ0ZXJ7d2lkdGg6Ljc1ZW07aGVpZ2h0OjJlbTtib3JkZXItcmFkaXVzOjUwJSAxMDAlIDAgMDstbW96LXRyYW5zZm9ybTpyb3RhdGUoLTMwZGVnKTstbXMtdHJhbnNmb3JtOnJvdGF0ZSgtMzBkZWcpOy13ZWJraXQtdHJhbnNmb3JtOnJvdGF0ZSgtMzBkZWcpO3RyYW5zZm9ybTpyb3RhdGUoLTMwZGVnKTtyaWdodDoxZW07dG9wOi0xZW07Ym9yZGVyLXRvcDoxcHggc29saWQgI2Y3ZjVmNDtib3JkZXItbGVmdDoxcHggc29saWQgI2Y3ZjVmNDtib3gtc2hhZG93Oi0uNWVtIDAgMCAtLjFlbSAjZjFmMWYxfUBrZXlmcmFtZXMgaG9wezIwJXstbW96LXRyYW5zZm9ybTpyb3RhdGUoLTEwZGVnKSB0cmFuc2xhdGUoMWVtLC0yZW0pOy1tcy10cmFuc2Zvcm06cm90YXRlKC0xMGRlZykgdHJhbnNsYXRlKDFlbSwtMmVtKTstd2Via2l0LXRyYW5zZm9ybTpyb3RhdGUoLTEwZGVnKSB0cmFuc2xhdGUoMWVtLC0yZW0pO3RyYW5zZm9ybTpyb3RhdGUoLTEwZGVnKSB0cmFuc2xhdGUoMWVtLC0yZW0pfTQwJXstbW96LXRyYW5zZm9ybTpyb3RhdGUoMTBkZWcpIHRyYW5zbGF0ZSgzZW0sLTRlbSk7LW1zLXRyYW5zZm9ybTpyb3RhdGUoMTBkZWcpIHRyYW5zbGF0ZSgzZW0sLTRlbSk7LXdlYmtpdC10cmFuc2Zvcm06cm90YXRlKDEwZGVnKSB0cmFuc2xhdGUoM2VtLC00ZW0pO3RyYW5zZm9ybTpyb3RhdGUoMTBkZWcpIHRyYW5zbGF0ZSgzZW0sLTRlbSl9NjAlLDc1JXstbW96LXRyYW5zZm9ybTpyb3RhdGUoMCkgdHJhbnNsYXRlKDRlbSwwKTstbXMtdHJhbnNmb3JtOnJvdGF0ZSgwKSB0cmFuc2xhdGUoNGVtLDApOy13ZWJraXQtdHJhbnNmb3JtOnJvdGF0ZSgwKSB0cmFuc2xhdGUoNGVtLDApO3RyYW5zZm9ybTpyb3RhdGUoMCkgdHJhbnNsYXRlKDRlbSwwKX19QGtleWZyYW1lcyBraWNrezIwJSw1MCV7Ym94LXNoYWRvdzo0ZW0gLjRlbSAwIC0uMzVlbSAjM2YzMzM0LC41ZW0gMS41ZW0gMCAjZjFmMWYxLDRlbSAxLjc1ZW0gMCAtLjNlbSAjZjFmMWYxLDRlbSAxLjc1ZW0gMCAtLjNlbSAjZjFmMWYxLDRlbSAxLjllbSAwIC0uNGVtICNmMWYxZjF9NDAle2JveC1zaGFkb3c6NGVtIC40ZW0gMCAtLjM1ZW0gIzNmMzMzNCwuNWVtIDJlbSAwICNmMWYxZjEsNGVtIDEuNzVlbSAwIC0uM2VtICNmMWYxZjEsNC4yZW0gMS43NWVtIDAgLS4yZW0gI2YxZjFmMSw0LjRlbSAxLjllbSAwIC0uMmVtICNmMWYxZjF9fQ==';
+import React, { Component } from 'react'; /* eslint-disable max-len */
+const style =
+    'LnJhYmJpdHt3aWR0aDo1ZW07aGVpZ2h0OjNlbTtiYWNrZ3JvdW5kOiM5OTk7Ym9yZGVyLXJhZGl1czo3MCUgOTAlIDYwJSA1MCU7cG9zaXRpb246cmVsYXRpdmU7LW1vei10cmFuc2Zvcm06cm90YXRlKDApIHRyYW5zbGF0ZSgtMmVtLDApOy1tcy10cmFuc2Zvcm06cm90YXRlKDApIHRyYW5zbGF0ZSgtMmVtLDApOy13ZWJraXQtdHJhbnNmb3JtOnJvdGF0ZSgwKSB0cmFuc2xhdGUoLTJlbSwwKTt0cmFuc2Zvcm06cm90YXRlKDApIHRyYW5zbGF0ZSgtMmVtLDApO2FuaW1hdGlvbjpob3AgMXMgaW5maW5pdGUgbGluZWFyO3otaW5kZXg6MX0ucmFiYml0OmFmdGVyLC5yYWJiaXQ6YmVmb3Jle2NvbnRlbnQ6IiI7cG9zaXRpb246YWJzb2x1dGU7YmFja2dyb3VuZDojZjFmMWYxfS5uby1mbGV4Ym94IC5yYWJiaXR7bWFyZ2luOjEwZW0gYXV0byAwfS5yYWJiaXQ6YmVmb3Jle3dpZHRoOjFlbTtoZWlnaHQ6MWVtO2JvcmRlci1yYWRpdXM6MTAwJTt0b3A6LjVlbTtsZWZ0Oi0uM2VtO2JveC1zaGFkb3c6NGVtIC40ZW0gMCAtLjM1ZW0gIzNmMzMzNCwuNWVtIDFlbSAwICNmMWYxZjEsNGVtIDFlbSAwIC0uM2VtICNmMWYxZjEsNGVtIDFlbSAwIC0uM2VtICNmMWYxZjEsNGVtIDFlbSAwIC0uNGVtICNmMWYxZjE7YW5pbWF0aW9uOmtpY2sgMXMgaW5maW5pdGUgbGluZWFyfS5yYWJiaXQ6YWZ0ZXJ7d2lkdGg6Ljc1ZW07aGVpZ2h0OjJlbTtib3JkZXItcmFkaXVzOjUwJSAxMDAlIDAgMDstbW96LXRyYW5zZm9ybTpyb3RhdGUoLTMwZGVnKTstbXMtdHJhbnNmb3JtOnJvdGF0ZSgtMzBkZWcpOy13ZWJraXQtdHJhbnNmb3JtOnJvdGF0ZSgtMzBkZWcpO3RyYW5zZm9ybTpyb3RhdGUoLTMwZGVnKTtyaWdodDoxZW07dG9wOi0xZW07Ym9yZGVyLXRvcDoxcHggc29saWQgI2Y3ZjVmNDtib3JkZXItbGVmdDoxcHggc29saWQgI2Y3ZjVmNDtib3gtc2hhZG93Oi0uNWVtIDAgMCAtLjFlbSAjZjFmMWYxfUBrZXlmcmFtZXMgaG9wezIwJXstbW96LXRyYW5zZm9ybTpyb3RhdGUoLTEwZGVnKSB0cmFuc2xhdGUoMWVtLC0yZW0pOy1tcy10cmFuc2Zvcm06cm90YXRlKC0xMGRlZykgdHJhbnNsYXRlKDFlbSwtMmVtKTstd2Via2l0LXRyYW5zZm9ybTpyb3RhdGUoLTEwZGVnKSB0cmFuc2xhdGUoMWVtLC0yZW0pO3RyYW5zZm9ybTpyb3RhdGUoLTEwZGVnKSB0cmFuc2xhdGUoMWVtLC0yZW0pfTQwJXstbW96LXRyYW5zZm9ybTpyb3RhdGUoMTBkZWcpIHRyYW5zbGF0ZSgzZW0sLTRlbSk7LW1zLXRyYW5zZm9ybTpyb3RhdGUoMTBkZWcpIHRyYW5zbGF0ZSgzZW0sLTRlbSk7LXdlYmtpdC10cmFuc2Zvcm06cm90YXRlKDEwZGVnKSB0cmFuc2xhdGUoM2VtLC00ZW0pO3RyYW5zZm9ybTpyb3RhdGUoMTBkZWcpIHRyYW5zbGF0ZSgzZW0sLTRlbSl9NjAlLDc1JXstbW96LXRyYW5zZm9ybTpyb3RhdGUoMCkgdHJhbnNsYXRlKDRlbSwwKTstbXMtdHJhbnNmb3JtOnJvdGF0ZSgwKSB0cmFuc2xhdGUoNGVtLDApOy13ZWJraXQtdHJhbnNmb3JtOnJvdGF0ZSgwKSB0cmFuc2xhdGUoNGVtLDApO3RyYW5zZm9ybTpyb3RhdGUoMCkgdHJhbnNsYXRlKDRlbSwwKX19QGtleWZyYW1lcyBraWNrezIwJSw1MCV7Ym94LXNoYWRvdzo0ZW0gLjRlbSAwIC0uMzVlbSAjM2YzMzM0LC41ZW0gMS41ZW0gMCAjZjFmMWYxLDRlbSAxLjc1ZW0gMCAtLjNlbSAjZjFmMWYxLDRlbSAxLjc1ZW0gMCAtLjNlbSAjZjFmMWYxLDRlbSAxLjllbSAwIC0uNGVtICNmMWYxZjF9NDAle2JveC1zaGFkb3c6NGVtIC40ZW0gMCAtLjM1ZW0gIzNmMzMzNCwuNWVtIDJlbSAwICNmMWYxZjEsNGVtIDEuNzVlbSAwIC0uM2VtICNmMWYxZjEsNC4yZW0gMS43NWVtIDAgLS4yZW0gI2YxZjFmMSw0LjRlbSAxLjllbSAwIC0uMmVtICNmMWYxZjF9fQ==';
+/* eslint-enable max-len */
 class LogixUtil extends Component {
+    state = {
+        whatToDisplay: false
+    };
 
-	state = {
-		whatToDisplay: false
-	};
-
-	componentWillReceiveProps(nextProps) {
-		this.setState({whatToDisplay: window.btoa(nextProps.display) === 'YnJpdG5leSBiaXRjaCE='});
-	}
-
-	render() {
-		if (this.state.whatToDisplay) {
-			setTimeout(() => this.setState({whatToDisplay: false}), 5000);
-		}
-		return (
-			<div style={{display: this.state.whatToDisplay ? 'block' : 'none', position: 'fixed',top: '50%', left: '45%'}}>
-				<style>{window.atob(style)}</style>
-				<div className='rabbit'></div>
-			</div>
-		);
-	}
+    componentWillReceiveProps(nextProps) {
+        this.setState({
+            whatToDisplay:
+                window.btoa(nextProps.display) === 'YnJpdG5leSBiaXRjaCE='
+        });
+    }
 
+    render() {
+        if (this.state.whatToDisplay) {
+            setTimeout(() => this.setState({ whatToDisplay: false }), 5000);
+        }
+        return (
+            <div
+                style={{
+                    display: this.state.whatToDisplay ? 'block' : 'none',
+                    position: 'fixed',
+                    top: '50%',
+                    left: '45%'
+                }}>
+                <style>{window.atob(style)}</style>
+                <div className="rabbit" />
+            </div>
+        );
+    }
 }
 
 export default LogixUtil;