1 files changed, 53 insertions, 44 deletions
diff --git a/openecomp-ui/src/sdc-app/flows/FlowsPunchOut.jsx b/openecomp-ui/src/sdc-app/flows/FlowsPunchOut.jsx
index a2a5554203..7d302444e4 100644
--- a/openecomp-ui/src/sdc-app/flows/FlowsPunchOut.jsx
+++ b/openecomp-ui/src/sdc-app/flows/FlowsPunchOut.jsx
@@ -22,57 +22,66 @@ import FlowsListEditor from './FlowsListEditor.js';
 import FlowsActions from './FlowsActions.js';
 
 class FlowsListEditorPunchOutWrapper extends React.Component {
+    componentDidMount() {
+        let element = ReactDOM.findDOMNode(this);
+        element.addEventListener('click', event => {
+            if (event.target.tagName === 'A') {
+                event.preventDefault();
+            }
+        });
+        ['wheel', 'mousewheel', 'DOMMouseScroll'].forEach(eventType =>
+            element.addEventListener(eventType, event =>
+                event.stopPropagation()
+            )
+        );
+    }
 
-	componentDidMount() {
-		let element = ReactDOM.findDOMNode(this);
-		element.addEventListener('click', event => {
-			if (event.target.tagName === 'A') {
-				event.preventDefault();
-			}
-		});
-		['wheel', 'mousewheel', 'DOMMouseScroll'].forEach(eventType =>
-			element.addEventListener(eventType, event => event.stopPropagation())
-		);
-	}
-
-	render() {
-		return <FlowsListEditor/>;
-	}
+    render() {
+        return <FlowsListEditor />;
+    }
 }
 
 export default class DiagramPunchOut {
+    render({ options: { data, apiRoot, apiHeaders }, onEvent }, element) {
+        if (!this.isConfigSet) {
+            Configuration.setCatalogApiRoot(apiRoot);
+            Configuration.setCatalogApiHeaders(apiHeaders);
+            this.isConfigSet = true;
+        }
 
-	render({options: {data, apiRoot, apiHeaders}, onEvent}, element) {
-
-		if (!this.isConfigSet) {
-			Configuration.setCatalogApiRoot(apiRoot);
-			Configuration.setCatalogApiHeaders(apiHeaders);
-			this.isConfigSet = true;
-		}
-
-		this.onEvent = onEvent;
-		this.handleData(data);
+        this.onEvent = onEvent;
+        this.handleData(data);
 
-		if (!this.rendered) {
-			ReactDOM.render(<Application><div className='dox-ui'><FlowsListEditorPunchOutWrapper/></div></Application>, element);
-			this.rendered = true;
-		}
-	}
+        if (!this.rendered) {
+            ReactDOM.render(
+                <Application>
+                    <div className="dox-ui">
+                        <FlowsListEditorPunchOutWrapper />
+                    </div>
+                </Application>,
+                element
+            );
+            this.rendered = true;
+        }
+    }
 
-	unmount(element) {
-		let dispatch = action => store.dispatch(action);
-		ReactDOM.unmountComponentAtNode(element);
-		FlowsActions.reset(dispatch);
-	}
+    unmount(element) {
+        let dispatch = action => store.dispatch(action);
+        ReactDOM.unmountComponentAtNode(element);
+        FlowsActions.reset(dispatch);
+    }
 
-	handleData(data) {
-		let {serviceID, diagramType} = data;
-		let dispatch = action => store.dispatch(action);
+    handleData(data) {
+        let { serviceID, diagramType } = data;
+        let dispatch = action => store.dispatch(action);
 
-		if (serviceID !== this.prevServiceID || diagramType !== this.prevDiagramType) {
-			this.prevServiceID = serviceID;
-			this.prevDiagramType = diagramType;
-			FlowsActions.fetchFlowArtifacts(dispatch, {...data});
-		}
-	}
+        if (
+            serviceID !== this.prevServiceID ||
+            diagramType !== this.prevDiagramType
+        ) {
+            this.prevServiceID = serviceID;
+            this.prevDiagramType = diagramType;
+            FlowsActions.fetchFlowArtifacts(dispatch, { ...data });
+        }
+    }
 }