Rework deploy action and close model

[clamp.git] / ui-react / src / components / loop_viewer / svg / LoopSvg.js

diff --git a/ui-react/src/components/loop_viewer/svg/LoopSvg.js b/ui-react/src/components/loop_viewer/svg/LoopSvg.js
index 91d74e4..1b1e242 100644 (file)
--- a/ui-react/src/components/loop_viewer/svg/LoopSvg.js
+++ b/ui-react/src/components/loop_viewer/svg/LoopSvg.js
@@ -32,7 +32,10 @@ const LoopViewSvgDivStyled = styled.div`
        background-color: ${props => (props.theme.loopViewerBackgroundColor)};
        border: 1px solid;
        border-color: ${props => (props.theme.loopViewerHeaderColor)};
-       height: 50%;
+       margin-left: auto;
+       margin-right:auto;
+       text-align: center;
+
 `
 
 class LoopViewSvg extends React.Component {
@@ -58,13 +61,14 @@ class LoopViewSvg extends React.Component {
                return this.state.svgContent !== nextState.svgContent;
        }
 
-       componentWillReceiveProps(newProps) {
-               this.setState({
-                       loopCache: newProps.loopCache,
-                       componentModalMapping: LoopComponentConverter.buildMapOfComponents(newProps.loopCache),
-
-               });
-               this.getSvg(newProps.loopCache.getLoopName());
+       componentWillReceiveProps(newProps) {   
+               if (this.state.loopCache !== newProps.loopCache) {
+                       this.setState({
+                               loopCache: newProps.loopCache,
+                               componentModalMapping: LoopComponentConverter.buildMapOfComponents(newProps.loopCache),
+                       });
+                       this.getSvg(newProps.loopCache.getLoopName());
+               }
        }
 
        getSvg(loopName) {
@@ -76,6 +80,8 @@ class LoopViewSvg extends React.Component {
                                        this.setState({ svgContent: LoopViewSvg.emptySvg })
                                }
                        });
+               } else {
+                       this.setState({ svgContent: LoopViewSvg.emptySvg })
                }
        }
 
@@ -88,7 +94,7 @@ class LoopViewSvg extends React.Component {
 
        render() {
                return (
-                       <LoopViewSvgDivStyled id="loop_svg" dangerouslySetInnerHTML={{ __html: this.state.svgContent }} onClick={this.handleSvgClick}>
+                       <LoopViewSvgDivStyled dangerouslySetInnerHTML={{ __html: this.state.svgContent }} onClick={this.handleSvgClick}>
 
                        </LoopViewSvgDivStyled>
                );