From c8c135fa7c2300e39b6ab0ec202d945320df42a7 Mon Sep 17 00:00:00 2001
From: Siklos <siklos@tuta.io>
Date: Sun, 31 Jul 2022 12:01:20 +0200
Subject: [PATCH] SVG: Responsive viewBox

---
 src/SVG/SVG.tsx | 45 ++++++++++++++++++++++++++++++++++++++-------
 1 file changed, 38 insertions(+), 7 deletions(-)

diff --git a/src/SVG/SVG.tsx b/src/SVG/SVG.tsx
index 9b22089..dd3e46a 100644
--- a/src/SVG/SVG.tsx
+++ b/src/SVG/SVG.tsx
@@ -7,18 +7,49 @@ interface ISVGProps {
   MainContainer: AvailableContainer
 }
 
+interface ISVGState {
+  viewBox: number[]
+}
+
 export class SVG extends React.Component<ISVGProps> {
+  public state: ISVGState;
+
+  constructor(props: ISVGProps) {
+    super(props);
+    this.state = {
+      viewBox: [
+        0,
+        0,
+        window.innerWidth,
+        window.innerHeight
+      ]
+    };
+  }
+
+  updateViewBox() {
+    this.setState({
+      viewBox: [
+        0,
+        0,
+        window.innerWidth,
+        window.innerHeight
+      ]
+    });
+  }
+
+  componentDidMount() {
+    window.addEventListener('resize', this.updateViewBox.bind(this));
+  }
+
+  componentWillUnmount() {
+    window.removeEventListener('resize', this.updateViewBox.bind(this));
+  }
+
   render() {
-    const viewBox: string = [
-      0,
-      0,
-      window.innerWidth,
-      window.innerHeight
-    ].join(' ');
     const xmlns = '<http://www.w3.org/2000/svg>';
 
     const properties = {
-      viewBox,
+      viewBox: this.state.viewBox.join(' '),
       xmlns
     };