Fix viewer not resizing on window resize

src/Components/SVG/SVG.tsx

@@ -11,8 +11,37 @@ interface ISVGProps {
   selected: ContainerModel | null
 }
 
+interface ISVGState {
+  viewerWidth: number,
+  viewerHeight: number,
+}
+
 export class SVG extends React.PureComponent<ISVGProps> {
   public static ID = 'svg';
+  public state: ISVGState;
+
+  constructor(props: ISVGProps) {
+    super(props);
+    this.state = {
+      viewerWidth: window.innerWidth,
+      viewerHeight: window.innerHeight
+    };
+  }
+
+  resizeViewBox(): void {
+    this.setState({
+      viewerWidth: window.innerWidth,
+      viewerHeight: window.innerHeight
+    });
+  }
+
+  componentDidMount(): void {
+    window.addEventListener('resize', this.resizeViewBox.bind(this));
+  }
+
+  componentWillUnmount(): void {
+    window.removeEventListener('resize', this.resizeViewBox.bind(this));
+  }
 
   render(): JSX.Element {
     const xmlns = '<http://www.w3.org/2000/svg>';
@@ -33,8 +62,8 @@ export class SVG extends React.PureComponent<ISVGProps> {
     return (
       <div id={SVG.ID}>
         <UncontrolledReactSVGPanZoom
-          width={window.innerWidth}
-          height={window.innerHeight}
+          width={this.state.viewerWidth}
+          height={this.state.viewerHeight}
           background={'#ffffff'}
           defaultTool='pan'
           miniatureProps={{